Skip to content

Commit

Permalink
Fix .small-scrollbar style for chromium
Browse files Browse the repository at this point in the history
.small-scrollbar is used on poster rating/status lists, but wasn't working because we also have the `scrollbar-width` property set, so now if the browser supports the webkit scrollbar styling, we will prefer that over scrollbar-width.

Don't know if this will break safari or whatever but hell if ima download that.

firefox scrollbar looks nice and this will let us keep using scrollbar-width: small wherever we want for that sweet smol bar action in ff
  • Loading branch information
IRHM committed Oct 4, 2024
1 parent 09954d2 commit 2fbdd5a
Showing 1 changed file with 19 additions and 10 deletions.
29 changes: 19 additions & 10 deletions src/norm.scss
Original file line number Diff line number Diff line change
Expand Up @@ -253,18 +253,27 @@
}

.small-scrollbar {
&::-webkit-scrollbar {
width: 4.5px;
}
@supports selector(::-webkit-scrollbar) {
&::-webkit-scrollbar {
width: 4.5px;
}

&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-track {
background: transparent;
}

&::-webkit-scrollbar-thumb {
background-color: rgba(155, 155, 155, 0.5);
border-radius: 20px;
border: transparent;
}

&::-webkit-scrollbar-thumb {
background-color: rgba(155, 155, 155, 0.5);
border-radius: 20px;
border: transparent;
// The scrollbar-width property will always override
// -webkit-scrollbar, but since the scrollbars in
// chromium look ugly af, we will try to unset scrollbar-width
// in these cases and use our manual styling instead to try
// mimicking beatiful firefox.
scrollbar-width: auto !important;
}
}
}
Expand Down

0 comments on commit 2fbdd5a

Please sign in to comment.