diff --git a/src/pages/settings/GenericSettings.tsx b/src/pages/settings/GenericSettings.tsx index 12a4665c..90e7ac9a 100644 --- a/src/pages/settings/GenericSettings.tsx +++ b/src/pages/settings/GenericSettings.tsx @@ -132,7 +132,11 @@ export function GenericSettings({ )} {(!isTouchscreenDevice || typeof page === "undefined") && (
-
+
{isTouchscreenDevice && indexHeader} {pages.map((entry, i) => diff --git a/src/pages/settings/Settings.module.scss b/src/pages/settings/Settings.module.scss index f18c0ee8..a38cb38f 100644 --- a/src/pages/settings/Settings.module.scss +++ b/src/pages/settings/Settings.module.scss @@ -38,6 +38,14 @@ flex-direction: column; background: var(--primary-header); + ::-webkit-scrollbar-thumb { + min-height: 100px; + width: 4px; + background-clip: content-box; + border-top: var(--header-height) solid transparent; + border-bottom: var(--bottom-navigation-height) solid transparent; + } + .sidebar, .content { background: var(--primary-background); @@ -48,8 +56,7 @@ overflow-y: auto; .container { - padding: calc(var(--header-height) + 4px) 8px - calc(var(--bottom-navigation-height) + 30px); + padding: 20px 10px 80px; min-width: 218px; } @@ -63,7 +70,9 @@ /* Content */ .content { - padding: 0; + ::-webkit-scrollbar-thumb { + border-bottom: none; + } .scrollbox { overflow: auto; @@ -71,7 +80,7 @@ .contentcontainer { max-width: unset !important; - padding: 72px 12px var(--bottom-navigation-height) !important; + padding: 20px 10px 80px; } } }