aevgarik/paperclip
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix sidebar scrollbar pushing content on hover

Browse Source 
Reserve 8px scrollbar width at all times instead of expanding from 0 on
hover. The thumb stays transparent until hover so the scrollbar is
visually hidden but no longer causes a layout shift.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
dotta
2026-03-18 14:40:50 -05:00
parent 3b03ac1734
commit e99fa66daf
1 changed files with 2 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
ui/src/index.css
View File

@@ -178,9 +178,9 @@
background: oklch(0.5 0 0); background: oklch(0.5 0 0);
} }
/* Auto-hide scrollbar: completely hidden by default, visible on container hover */ /* Auto-hide scrollbar: always reserves space, thumb visible only on hover */
.scrollbar-auto-hide::-webkit-scrollbar { .scrollbar-auto-hide::-webkit-scrollbar {
width: 0 !important; width: 8px !important;
background: transparent !important; background: transparent !important;
} }
.scrollbar-auto-hide::-webkit-scrollbar-track { .scrollbar-auto-hide::-webkit-scrollbar-track {
@@ -189,9 +189,6 @@
.scrollbar-auto-hide::-webkit-scrollbar-thumb { .scrollbar-auto-hide::-webkit-scrollbar-thumb {
background: transparent !important; background: transparent !important;
} }
.scrollbar-auto-hide:hover::-webkit-scrollbar {
width: 8px !important;
}
.scrollbar-auto-hide:hover::-webkit-scrollbar-track { .scrollbar-auto-hide:hover::-webkit-scrollbar-track {
background: oklch(0.205 0 0) !important; background: oklch(0.205 0 0) !important;
} }