1
0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-09-24 19:38:27 +02:00

Added active state for parent section in mobile navigation

This commit is contained in:
squidfunk 2020-02-26 09:33:24 +01:00
parent 63a309bd72
commit 2a63915a3e
6 changed files with 37 additions and 18 deletions

View File

@ -1,8 +1,8 @@
{ {
"assets/javascripts/bundle.js": "assets/javascripts/bundle.379e8f0f.min.js", "assets/javascripts/bundle.js": "assets/javascripts/bundle.a7251a2a.min.js",
"assets/javascripts/bundle.js.map": "assets/javascripts/bundle.379e8f0f.min.js.map", "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.a7251a2a.min.js.map",
"assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js", "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js",
"assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map", "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map",
"assets/stylesheets/main.scss": "assets/stylesheets/main.1e2c5b46.min.css", "assets/stylesheets/main.scss": "assets/stylesheets/main.949e77d3.min.css",
"assets/stylesheets/palette.scss": "assets/stylesheets/palette.f5f04e6f.min.css" "assets/stylesheets/palette.scss": "assets/stylesheets/palette.f5f04e6f.min.css"
} }

View File

@ -43,7 +43,7 @@
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.1e2c5b46.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/main.949e77d3.min.css' | url }}">
{% if palette.primary or palette.accent %} {% if palette.primary or palette.accent %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.f5f04e6f.min.css' | url }}"> <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.f5f04e6f.min.css' | url }}">
{% endif %} {% endif %}
@ -200,7 +200,7 @@
{% endblock %} {% endblock %}
</div> </div>
{% block scripts %} {% block scripts %}
<script src="{{ 'assets/javascripts/bundle.379e8f0f.min.js' | url }}"></script> <script src="{{ 'assets/javascripts/bundle.a7251a2a.min.js' | url }}"></script>
{%- set translations = {} -%} {%- set translations = {} -%}
{%- for key in [ {%- for key in [
"clipboard.copy", "clipboard.copy",

View File

@ -269,6 +269,11 @@
padding-left: px2rem(48px); padding-left: px2rem(48px);
} }
} }
// Active parent item
&--active > .md-nav__link {
color: var(--md-primary-fg-color);
}
} }
// Link inside item // Link inside item
@ -427,23 +432,37 @@
} }
} }
// [screen +]: Tree-like navigation // [tablet landscape +]: Tree-like navigation
@include break-from-device(screen) { @include break-from-device(tablet landscape) {
// Animation is only possible if JavaScript is available, as the max-height
// property must be calculated before transitioning
transition: max-height 250ms cubic-bezier(0.86, 0, 0.07, 1);
// List title // List title
.md-nav__title { &--secondary .md-nav__title {
// Snap to site and table of contents title // Snap to table of contents title
&[for="__drawer"],
&[for="__toc"] { &[for="__toc"] {
scroll-snap-align: start; scroll-snap-align: start;
} }
// Hide icons // Hide icon
.md-nav__icon {
display: none;
}
}
}
// [screen +]: Tree-like navigation
@include break-from-device(screen) {
transition: max-height 250ms cubic-bezier(0.86, 0, 0.07, 1);
// List title
&--primary .md-nav__title {
// Snap to site title
&[for="__drawer"] {
scroll-snap-align: start;
}
// Hide icon
.md-nav__icon { .md-nav__icon {
display: none; display: none;
} }