Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI Enhancement: Centered game controls with improved start/restart bu… #145 #176

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

nihasinghania22
Copy link

…ttons

PR Description 📜

UI Enhancement: Centered game controls with improved start/restart buttons

This pull request aims to improve the user interface of our game by centering the game controls and enhancing the appearance of the start and restart buttons. These changes will make the game more visually appealing and improve user experience.

Changes implemented:

  1. Added a new container div for game controls
  2. Centered the start and restart buttons both vertically and horizontally on the page
  3. Styled the buttons with distinct appearances:
    • Start button: Green background
    • Restart button: Light gray background with a border
  4. Implemented hover effects for better user feedback
  5. Adjusted z-index values to ensure buttons appear above the game canvas and background layers

These modifications make the game interface more intuitive and visually cohesive. The centered controls provide better accessibility, especially on different screen sizes.

To test:

  1. Load the game and verify that the start and restart buttons are centered
  2. Check that the buttons have the correct styling and hover effects
  3. Ensure the buttons appear above all other game elements
  4. Test on different screen sizes to confirm responsiveness

Screenshots of the changes are attached for reference.

Let me know if any further modifications or clarifications are needed!
Fixes # <your_issue_number>


Mark the task you have completed ✅

  • [✅ ] I follow CONTRIBUTING GUIDELINE & CODE OF CONDUCT of this project.
  • [✅ ] I have performed a self-review of my own code or work.
  • [ ✅] I have commented my code, particularly in hard-to-understand areas.
  • [ ✅] My changes generates no new warnings.
  • [ ✅] I have followed proper naming convention showed in CONTRIBUTING GUIDELINE
  • [✅ ] I have added screenshot for review.

## Add your screenshots(Optional) 📸

image



Thank you soo much for contributing to our repository 💗

@nihasinghania22
Copy link
Author

Could you please review this. I have adjusted the size of the start and stop button.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant