1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Show scrollbar only on hover

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2023-02-03 10:44:22 +03:00
parent 5002b450fd
commit 7c3cf69afe
3 changed files with 15 additions and 1 deletions

View File

@ -4,7 +4,9 @@
*/ */
.sidebarNav { .sidebarNav {
@apply flex overflow-auto flex-col; display: flex;
flex-direction: column;
overflow: overlay;
width: var(--sidebar-width); width: var(--sidebar-width);
padding-bottom: calc(var(--padding) * 3); padding-bottom: calc(var(--padding) * 3);
@ -17,6 +19,16 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 40px, 100% 40px, 100% 12px, 100% 12px; background-size: 100% 40px, 100% 40px, 100% 12px, 100% 12px;
background-attachment: local, local, scroll, scroll; background-attachment: local, local, scroll, scroll;
&::-webkit-scrollbar-thumb {
background-color: transparent;
}
&:hover {
&::-webkit-scrollbar-thumb {
background-color: var(--sidebarScrollbarBackground);
}
}
} }
.sidebarNav :global(.Icon) { .sidebarNav :global(.Icon) {

View File

@ -38,6 +38,7 @@ const lensDarkThemeInjectable = getInjectable({
sidebarActiveColor: "#ffffff", sidebarActiveColor: "#ffffff",
sidebarSubmenuActiveColor: "#ffffff", sidebarSubmenuActiveColor: "#ffffff",
sidebarItemHoverBackground: "#3a3e44", sidebarItemHoverBackground: "#3a3e44",
sidebarScrollbarBackground: "#9da7b033",
badgeBackgroundColor: "#ffba44", badgeBackgroundColor: "#ffba44",
buttonPrimaryBackground: "#3d90ce", buttonPrimaryBackground: "#3d90ce",
buttonDefaultBackground: "#414448", buttonDefaultBackground: "#414448",

View File

@ -38,6 +38,7 @@ const lensLightThemeInjectable = getInjectable({
sidebarSubmenuActiveColor: "#3d90ce", sidebarSubmenuActiveColor: "#3d90ce",
sidebarBackground: "#e8e8e8", sidebarBackground: "#e8e8e8",
sidebarItemHoverBackground: "#f0f2f5", sidebarItemHoverBackground: "#f0f2f5",
sidebarScrollbarBackground: "#666f7940",
badgeBackgroundColor: "#ffba44", badgeBackgroundColor: "#ffba44",
buttonPrimaryBackground: "#3d90ce", buttonPrimaryBackground: "#3d90ce",
buttonDefaultBackground: "#414448", buttonDefaultBackground: "#414448",