fix: make mobile nav backgrounds fully opaque#29781
Conversation
|
Welcome to Cal.diy, @prathamesh04! Thanks for opening this pull request. A few things to keep in mind:
A maintainer will review your PR soon. Thanks for contributing! |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
📝 WalkthroughWalkthroughUpdated the mobile top navigation background from semi-transparent to opaque and updated the fixed bottom mobile navigation background from partially transparent to opaque. Existing positioning, borders, layout, blur behavior, rendering logic, and embed visibility conditions remain unchanged. 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
This PR has been marked as stale due to inactivity. If you're still working on it or need any help, please let us know or update the PR to keep it active. |
fixes #29757
the mobile top nav and bottom nav were using semi-transparent backgrounds (
bg-cal-muted/50andbg-cal-muted/40respectively). when you scroll down on any page, the content underneath bleeds through and overlaps with the nav text, making it unreadable.changed both to use
bg-cal-muted(fully opaque) so the nav stays solid regardless of scroll position. kept thebackdrop-blurfor the visual effect.what changed:
TopNav.tsx:bg-cal-muted/50→bg-cal-mutedNavigation.tsx:bg-cal-muted/40→bg-cal-mutedtested on chrome/android, scrolling up and down on event-types and bookings pages. nav stays opaque now, no text bleeding through.
cc @dhairyashiil @bandhan-majumder would appreciate a review when you get a chance