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

Update Tailwind Config for Responsive Design #477

Closed
wants to merge 5 commits into from

Conversation

shivhere007
Copy link
Contributor

Description

This update enhances the user interface of the "DevDisplay" platform on tablet devices by aligning header elements and optimizing the light/dark mode toggle button for screens with a max-width of 768px and 1024px. These adjustments ensure a clean, centered header and an accessible toggle button, providing a seamless experience for tablet users.

Related Issues

Fixes #455

Changes Proposed

Custom Breakpoints Added: The md (medium) breakpoint has been set to 925px, allowing for a more tailored responsive design for medium-sized screens. The lg (large) breakpoint has been adjusted to 1100px, providing a better fit for larger screens while ensuring optimal layout and spacing. Other breakpoints remain unchanged at 640px for sm (small) and 1280px for xl (extra-large).

Checklist

  • I have read and followed the Contribution Guidelines.
  • All new and existing tests passed.
  • I have updated the documentation to reflect the changes I've made.
  • My code follows the code style of this project.
  • The title of my pull request is a short description of the requested changes.

Screenshots

After :

Screenshot 2024-10-28 121107
Screenshot 2024-10-28 121139

Before :

Screenshot 2024-10-28 122108
Screenshot 2024-10-28 122132

Kindly review this and merge it @codeaashu , @ishap11 , @madhukalita .

Copy link

vercel bot commented Oct 28, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
devdisplay ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 29, 2024 2:48am

Copy link

netlify bot commented Oct 28, 2024

Deploy Preview for devdisplay failed.

Name Link
🔨 Latest commit be725cc
🔍 Latest deploy log https://app.netlify.com/sites/devdisplay/deploys/67204cef98d23d00080743e0

@codeaashu codeaashu self-requested a review October 28, 2024 06:59
@codeaashu codeaashu added hacktoberfest Label is used for Issues and pull request related to Hacktoberfest 2024 open source contribution. hacktoberfest2024 Label for tracking contributions and activities during Hacktoberfest 2024 gssoc24 Label is used for Issues and pull request related to GSSOC 2024 open source contribution. opensource Label is used for Issues and pull request related to all open source contribution. hacktoberfest-accepted Label is used for accept the pull request of contributer in Hacktoberfest 2024. gssoc-ext Label is used for Issues and pull request related to GSSOC 2024 open source contribution. level2 labels Oct 28, 2024
@codeaashu
Copy link
Owner

Hi @shivhere007 , thanks for your interest in contributing to DevDisplay!

Before we proceed, we noticed you haven't adding our profile on #DevDisplay also forgot to star the repo. It's like making an amazing sandwich and forgetting to take a bite! -- I think our repo's feeling a little lonely without your 🤗 So, be sure to star the DevDisplay GitHub Repository. 🌟

💌 This is a mandatory step for all contributors. & It's is the first priority of contribution in DevDisplay 💌

🚀 We look forward to your contribution once these steps are completed. 🚀

Thanks 👍🏻

@shivhere007
Copy link
Contributor Author

Kindly check and merge at your earliest convenience @codeaashu , @ishap11 , @madhukalita .

@shivhere007
Copy link
Contributor Author

shivhere007 commented Oct 28, 2024

I have already starred the project and just now added my profile too. Kindly review and merge my PR @codeaashu , @ishap11

@shivhere007
Copy link
Contributor Author

@codeaashu kindly review and take some actions.

@shivhere007 shivhere007 closed this by deleting the head repository Oct 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
gssoc24 Label is used for Issues and pull request related to GSSOC 2024 open source contribution. gssoc-ext Label is used for Issues and pull request related to GSSOC 2024 open source contribution. hacktoberfest Label is used for Issues and pull request related to Hacktoberfest 2024 open source contribution. hacktoberfest2024 Label for tracking contributions and activities during Hacktoberfest 2024 hacktoberfest-accepted Label is used for accept the pull request of contributer in Hacktoberfest 2024. level2 opensource Label is used for Issues and pull request related to all open source contribution.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[style]: Responsive Header and Toggle Button Adjustment for Tablet View
2 participants