From 1cf89bacba59c1edbc5a65d3f6e3ea2b575b89c4 Mon Sep 17 00:00:00 2001 From: Biswa Kalyan Bhuyan Date: Thu, 29 May 2025 01:50:36 +0530 Subject: fix: Improved UI and NavBar Menu - Fixed alignment issues in the frontend - Fixed the box border hover selection in the menu bar (mobile) - Changed the theme toggle button color to standard frontend theme - Enhanced UI components --- frontend/src/app/globals.css | 63 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 63 insertions(+) (limited to 'frontend/src/app') diff --git a/frontend/src/app/globals.css b/frontend/src/app/globals.css index 5210ba7..0b2a4b4 100644 --- a/frontend/src/app/globals.css +++ b/frontend/src/app/globals.css @@ -708,6 +708,55 @@ a.nav-button-transparent:not(:hover):not(:focus):not(:active) { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; } + + /* Hide scrollbar in mobile menu while maintaining scroll functionality */ + [data-radix-dialog-content] { + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* Internet Explorer and Edge */ + } + + [data-radix-dialog-content]::-webkit-scrollbar { + display: none; /* Chrome, Safari, Opera */ + width: 0; + height: 0; + } + + /* Specifically target Sheet content scrolling areas */ + [data-radix-dialog-content] .overflow-y-auto, + [data-radix-dialog-content] .overflow-auto { + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* Internet Explorer and Edge */ + } + + [data-radix-dialog-content] .overflow-y-auto::-webkit-scrollbar, + [data-radix-dialog-content] .overflow-auto::-webkit-scrollbar { + display: none; /* Chrome, Safari, Opera */ + width: 0; + height: 0; + } + + /* Mobile navigation specific scrollbar hiding */ + .mobile-nav-scroll { + scrollbar-width: none !important; /* Firefox */ + -ms-overflow-style: none !important; /* Internet Explorer and Edge */ + } + + .mobile-nav-scroll::-webkit-scrollbar { + display: none !important; /* Chrome, Safari, Opera */ + width: 0 !important; + height: 0 !important; + background: transparent !important; + } + + /* Additional scrollbar hiding for all mobile menu elements */ + [data-radix-dialog-content] *, + [data-radix-dialog-content] *::-webkit-scrollbar { + scrollbar-width: none !important; + -ms-overflow-style: none !important; + display: none !important; + width: 0 !important; + height: 0 !important; + } } /* Small mobile optimizations */ @@ -756,3 +805,17 @@ a.nav-button-transparent:not(:hover):not(:focus):not(:active) { outline: 2px solid var(--ring) !important; outline-offset: 2px !important; } + +/* Mobile menu icon stroke uniformity */ +.mobile-nav-scroll svg, +[data-radix-dialog-content] svg { + stroke-linecap: round !important; + stroke-linejoin: round !important; +} + +/* Force consistent stroke width for mobile quick action icons */ +@media (max-width: 768px) { + [data-radix-dialog-content] button svg { + stroke-width: inherit !important; + } +} -- cgit v1.2.3-59-g8ed1b