OpenSourceArk/mkdocs-material
1
0
Fork 0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-06-14 11:52:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Only show sidebar scrollbar on hover or focus

Browse Source
This commit is contained in:
squidfunk 2022-12-02 18:57:42 +01:00
parent b75c6494e6
commit b82f8a587d
1 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/assets/stylesheets/main/layout/_sidebar.scss
View File

@ -133,17 +133,17 @@
scrollbar-gutter: stable; scrollbar-gutter: stable;
scrollbar-color: var(--md-default-fg-color--lighter) transparent; scrollbar-color: var(--md-default-fg-color--lighter) transparent;
// Sidebar scroll wrapper on hover
&:hover {
scrollbar-color: var(--md-accent-fg-color) transparent;
}
// Webkit scrollbar // Webkit scrollbar
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: px2rem(4px); width: px2rem(4px);
height: px2rem(4px); height: px2rem(4px);
} }
// Sidebar scroll wrapper on focus/hover
&:focus-within,
&:hover {
scrollbar-color: var(--md-accent-fg-color) transparent;
// Webkit scrollbar thumb // Webkit scrollbar thumb
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: var(--md-default-fg-color--lighter); background-color: var(--md-default-fg-color--lighter);
@ -154,6 +154,7 @@
} }
} }
} }
}
// Hack: the scrollbar is only visible when the sidebar's contents overflow, // Hack: the scrollbar is only visible when the sidebar's contents overflow,
// which is nice, but leads to the problem where the chevrons of expandable // which is nice, but leads to the problem where the chevrons of expandable