Hide scrollbars completely by setting width and height to 0 (#225)

* fix: hide tabbar scrollbar by setting width/height to 0

The no-scrollbar utility's display:none wasn't fully overriding the
global scrollbar styles that set width/height to 8px. Adding explicit
width:0 and height:0 ensures the scrollbar is completely hidden in
WebKit browsers.

https://claude.ai/code/session_018RiPf74GNf2oWcoYNRoZyx

* fix: use !important to override global scrollbar styles

The global * selector's scrollbar-width: thin was overriding the
no-scrollbar utility due to CSS cascade order. Adding !important
ensures the utility always wins.

https://claude.ai/code/session_018RiPf74GNf2oWcoYNRoZyx

---------

Co-authored-by: Claude <noreply@anthropic.com>
This commit is contained in:
Alejandro
2026-01-29 13:02:17 +01:00
committed by GitHub
parent 0b3c657705
commit f9733878e2

View File

@@ -303,20 +303,24 @@
========================================================================== */
@utility no-scrollbar {
-ms-overflow-style: none;
scrollbar-width: none;
-ms-overflow-style: none !important;
scrollbar-width: none !important;
&::-webkit-scrollbar {
display: none;
display: none !important;
width: 0 !important;
height: 0 !important;
}
}
@utility hide-scrollbar {
-ms-overflow-style: none;
scrollbar-width: none;
-ms-overflow-style: none !important;
scrollbar-width: none !important;
&::-webkit-scrollbar {
display: none;
display: none !important;
width: 0 !important;
height: 0 !important;
}
}