search

YadavAkhileshh / Alien-Invasion-Defense

Alien Invasion Defense is a fun web-based game created with HTML, CSS, and JavaScript. With a user-friendly interface and smooth gameplay, it’s perfect for players of all ages. Over 1,000 users have enjoyed the engaging challenges as they defend Earth from alien invaders. Join the action and see if you have what it takes to protect our planet!
https://alienid.netlify.app/
MIT License
61 stars 199 forks source link

[BUG] UI Layout Misalignment and Cluttered Design #351

Open 13Sharad opened 1 month ago

13Sharad commented 1 month ago

Description

The website's UI layout appears misaligned, with certain elements (like the score, life indicators, and game interface) overlapping or not positioned correctly. The visual clutter from snowflakes and other elements makes it difficult to navigate or play the game smoothly. I tried adjusting the screen size, resolution, and layout, but the issue persists across different devices. Even changing the game settings did not resolve the UI alignment problems.

Screenshots

Screenshot 2024-10-14 005317

Any additional information?

The issue seems to be more prominent on smaller screens or devices with lower resolutions. It could be related to the responsiveness of the UI design or conflicts between certain CSS elements (e.g., z-index, flex, or grid settings). Ensuring proper scaling and alignment across different screen sizes might help resolve this. Additionally, the snowflake effect, while visually appealing, may be contributing to the visual clutter and could be optimized or minimized for better clarity during gameplay.

What browser are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

Checklist

github-actions[bot] commented 1 month ago

👋 Thank you @13Sharad for raising an issue! We appreciate your effort in helping us improve. Our team will review it shortly. Stay tuned!

Iampratyush004 commented 1 month ago

@YadavAkhileshh this issue is resolved in my PR #344 kidnly review and merge so that it is becoming easy to make improvements for anyone further. I will change the logo in the subsequent issue .please cooperate and understand the need to it. I have attached the old ui and new ui screenshot along with the PR #344 . hoping for the tags : hacktoberfest-accepted, gssoc extd and level2 in both my issue #277 and PR #344 Hoping for a positive response on this. Thanks Regards