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

Added support for scrollbar-gutter

Browse Source
This commit is contained in:
squidfunk 2022-09-28 18:41:33 +02:00
parent 290de4acc7
commit 4c8620c6ee
5 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
material/assets/stylesheets/main.4eacb97b.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
material/assets/stylesheets/main.80dcb947.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
material/assets/stylesheets/main.4eacb97b.min.css.map → material/assets/stylesheets/main.80dcb947.min.css.map
View File

File diff suppressed because one or more lines are too long

2
material/base.html
View File

@ -34,7 +34,7 @@
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.4eacb97b.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/main.80dcb947.min.css' | url }}">
{% if config.theme.palette %} {% if config.theme.palette %}
{% set palette = config.theme.palette %} {% set palette = config.theme.palette %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.cbb835fc.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.cbb835fc.min.css' | url }}">

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

@ -130,6 +130,7 @@
// this reason, we disable scroll snapping until this is resolved (#1667). // this reason, we disable scroll snapping until this is resolved (#1667).
// scroll-snap-type: y mandatory; // scroll-snap-type: y mandatory;
scrollbar-width: thin; scrollbar-width: thin;
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 // Sidebar scroll wrapper on hover
@ -154,9 +155,6 @@
} }
} }
// Sidebar wrapper
&__inner {
// 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
// sections will jump by `4px` when the sidebar is shown. We wanted to fix // sections will jump by `4px` when the sidebar is shown. We wanted to fix
@ -167,6 +165,14 @@
// sidebar's content doesn't overflow. This hack is inspired and adapted // sidebar's content doesn't overflow. This hack is inspired and adapted
// from Ayke van Laëthem's year old trick – see https://bit.ly/3Sb1qql // from Ayke van Laëthem's year old trick – see https://bit.ly/3Sb1qql
@supports selector(::-webkit-scrollbar) { @supports selector(::-webkit-scrollbar) {
// Sidebar scroll wrapper
&__scrollwrap {
scrollbar-gutter: auto;
}
// Sidebar wrapper
&__inner {
padding-inline-end: calc(100% - #{px2rem(230px)}); padding-inline-end: calc(100% - #{px2rem(230px)});
} }
} }