From 99c7614b7b6927471f7af7085d374837ef111591 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Fri, 6 Sep 2024 23:32:42 +0200
Subject: [PATCH] Set scrollbar height

---
 src/components/chapter/ChapterList.tsx | 4 ++--
 src/theme.ts                           | 5 +++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/chapter/ChapterList.tsx b/src/components/chapter/ChapterList.tsx
index 1388ac4b..e9a2b6f2 100644
--- a/src/components/chapter/ChapterList.tsx
+++ b/src/components/chapter/ChapterList.tsx
@@ -45,11 +45,11 @@ import { Mangas } from '@/lib/data/Mangas';
 import { useNavBarContext } from '@/components/context/NavbarContext.tsx';
 import { useResizeObserver } from '@/util/useResizeObserver.tsx';
 import { MediaQuery } from '@/lib/ui/MediaQuery.tsx';
-import { SCROLLBAR_WIDTH } from '@/theme.ts';
+import { SCROLLBAR_SIZE } from '@/theme.ts';
 
 const ChapterListHeader = styled(Stack)(({ theme }) => ({
     padding: theme.spacing(1),
-    paddingRight: `calc(${SCROLLBAR_WIDTH}px + ${theme.spacing(1)})`,
+    paddingRight: `calc(${SCROLLBAR_SIZE}px + ${theme.spacing(1)})`,
     paddingBottom: 0,
     [theme.breakpoints.down('md')]: {
         paddingRight: theme.spacing(1),
diff --git a/src/theme.ts b/src/theme.ts
index b464de65..ac9a2c99 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -19,7 +19,7 @@ import { ThemeMode } from '@/components/context/ThemeModeContext.tsx';
 import { MediaQuery } from '@/lib/ui/MediaQuery.tsx';
 import { AppTheme } from '@/lib/ui/AppThemes.ts';
 
-export const SCROLLBAR_WIDTH = 14;
+export const SCROLLBAR_SIZE = 14;
 
 export const createTheme = (
     themeMode: ThemeMode,
@@ -82,7 +82,8 @@ export const createTheme = (
             MuiCssBaseline: {
                 styleOverrides: `
                         *::-webkit-scrollbar {
-                          width: ${SCROLLBAR_WIDTH}px;
+                          width: ${SCROLLBAR_SIZE}px;
+                          height: ${SCROLLBAR_SIZE}px;
                         }
                         *::-webkit-scrollbar-thumb {
                           border: 4px solid rgba(0, 0, 0, 0);