diff --git a/src/lib/poster/GamePoster.svelte b/src/lib/poster/GamePoster.svelte index 6e129798..857a1616 100644 --- a/src/lib/poster/GamePoster.svelte +++ b/src/lib/poster/GamePoster.svelte @@ -207,7 +207,7 @@ role="button" tabindex="-1" > - +

{title} {#if year} @@ -329,6 +329,7 @@ & > a { height: 100%; + overflow: auto; } h2 { diff --git a/src/lib/poster/Poster.svelte b/src/lib/poster/Poster.svelte index 2048ac35..b372d345 100644 --- a/src/lib/poster/Poster.svelte +++ b/src/lib/poster/Poster.svelte @@ -175,7 +175,7 @@ role="button" tabindex="-1" > - +

{title} {#if year} @@ -277,6 +277,7 @@ & > a { height: 100%; + overflow: auto; } h2 { diff --git a/src/norm.scss b/src/norm.scss index 83646766..56013643 100644 --- a/src/norm.scss +++ b/src/norm.scss @@ -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; } } }