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

Fixed the theme button position on small devices #1919

Merged
merged 4 commits into from
Dec 18, 2024

Conversation

SHRUTISINHA250714
Copy link
Contributor

@SHRUTISINHA250714 SHRUTISINHA250714 commented Dec 17, 2024

Fixes Issue🛠️

Closes #1916

Description👨‍💻

This PR moves the theme toggle button next to the hamburger icon on small screens for better accessibility. Previously, the toggle was hidden inside the hamburger menu, making it harder to access. The layout has been adjusted using CSS to align both elements side by side, ensuring a more user-friendly experience on mobile devices.

Changes:

Repositioned theme toggle next to the hamburger icon on small screens.
Adjusted CSS for better alignment and responsiveness.

Issue Fixed:

Improved the visibility and accessibility of the theme toggle on small screens.

Type of Change📄

  • Bug fix (non-breaking change which fixes a bug)

Checklist✅

  • I am an Open Source contributor
  • I have performed a self-review of my code
  • My code follows the style guidelines of this project

Screenshots/GIF📷

Before

pr1

pr2

After

pr3

pr4

pr5

Copy link

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @SHRUTISINHA250714, Welcome to the project CalcDiverse! 🎊
Thanks for your contribution! Your effort makes this project better. Keep it up! 🙌
Please wait for the PR to be reviewed. Happy Coding!! ✨

Copy link

netlify bot commented Dec 17, 2024

Deploy Preview for calcdiverse ready!

Name Link
🔨 Latest commit c4d5e2e
🔍 Latest deploy log https://app.netlify.com/sites/calcdiverse/deploys/676257ec8c4aca000800f697
😎 Deploy Preview https://deploy-preview-1919--calcdiverse.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@Rakesh9100
Copy link
Owner

The navbar items are centered which should not, no changes to the other existing styles, please fix by making the new commits in this same PR @SHRUTISINHA250714

image

@Rakesh9100 Rakesh9100 added the question 🤔 Further information is requested label Dec 17, 2024
@Rakesh9100 Rakesh9100 changed the title Theme toggle button position fixed Fixed the theme button position on small devices Dec 17, 2024
@SHRUTISINHA250714
Copy link
Contributor Author

image
@Rakesh9100 Made the required changes. Please review.

@Rakesh9100 Rakesh9100 merged commit 548272c into Rakesh9100:main Dec 18, 2024
4 checks passed
Copy link

Congrats, Your pull request has been successfully merged 🥳🎉 Thank you for your contribution to my project 🚀 Keep Contributing!! ✨ @SHRUTISINHA250714

@Rakesh9100 Rakesh9100 added Completed 🥳 PR successfully merged and issue resolved on completion KWOC KWOC Open Source Program and removed question 🤔 Further information is requested labels Dec 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Completed 🥳 PR successfully merged and issue resolved on completion KWOC KWOC Open Source Program
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug] Fix the theme button position on small devices
2 participants