diff options
Diffstat (limited to 'frontend/src/app/globals.css')
-rw-r--r-- | frontend/src/app/globals.css | 63 |
1 files changed, 63 insertions, 0 deletions
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; + } +} |