diff --git a/src-ui/app/main_page/sidebar_section/SidebarSection.jsx b/src-ui/app/main_page/sidebar_section/SidebarSection.jsx index 1d00ea55..f42ab854 100644 --- a/src-ui/app/main_page/sidebar_section/SidebarSection.jsx +++ b/src-ui/app/main_page/sidebar_section/SidebarSection.jsx @@ -10,15 +10,17 @@ import { OpenSettings } from "./open_settings/OpenSettings"; export const SidebarSection = () => { const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode(); - const container_class_name = clsx(styles["container"], { - [styles["is_compact_mode"]]: currentIsMainPageCompactMode + const container_class_name = clsx(styles.container, { + [styles.is_compact_mode]: currentIsMainPageCompactMode }); return (
- - {!currentIsMainPageCompactMode && } +
+ + {!currentIsMainPageCompactMode && } +
); diff --git a/src-ui/app/main_page/sidebar_section/SidebarSection.module.scss b/src-ui/app/main_page/sidebar_section/SidebarSection.module.scss index de2f091a..7042e5b4 100644 --- a/src-ui/app/main_page/sidebar_section/SidebarSection.module.scss +++ b/src-ui/app/main_page/sidebar_section/SidebarSection.module.scss @@ -1,3 +1,24 @@ +.scroll_container { + width: calc(100% + 0.8rem); + overflow-y: scroll; + overflow-x: hidden; + margin-bottom: calc(2rem + 1.6rem + 2rem); // config button's sizes (svg + padding + margin). + + &::-webkit-scrollbar { + width: 0.8rem; + } + &::-webkit-scrollbar-track { + background-color: var(--dark_888_color); + border-radius: 0.4rem; + } + &::-webkit-scrollbar-thumb { + background-color: var(--dark_800_color); + border-radius: 0.4rem; + } + + +} + .container { position: relative; min-width: 23rem;