mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-11-12 01:50:52 +01:00
Added smooth transition to sidebar navigation
This commit is contained in:
parent
62bd70a6d2
commit
208ac1ac3a
@ -385,7 +385,7 @@
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
// Toggle for nested navigation
|
||||
// Hide nested navigation
|
||||
&__toggle ~ & {
|
||||
display: flex;
|
||||
opacity: 0;
|
||||
@ -522,14 +522,32 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Hide toggle for nested navigation
|
||||
// Hide nested navigation
|
||||
&__toggle ~ & {
|
||||
display: none;
|
||||
display: grid;
|
||||
grid-template-rows: 0fr;
|
||||
visibility: collapse;
|
||||
opacity: 0;
|
||||
transition:
|
||||
grid-template-rows 250ms cubic-bezier(0.86, 0, 0.07, 1),
|
||||
opacity 250ms,
|
||||
visibility 0ms 250ms;
|
||||
|
||||
// Navigation list
|
||||
> .md-nav__list {
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
// Show nested navigation when toggle is active or indeterminate
|
||||
&__toggle:is(:checked, :indeterminate) ~ & {
|
||||
display: block;
|
||||
grid-template-rows: 1fr;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transition:
|
||||
grid-template-rows 250ms cubic-bezier(0.86, 0, 0.07, 1),
|
||||
opacity 150ms 100ms,
|
||||
visibility 0ms;
|
||||
}
|
||||
|
||||
// Hide navigation title in nested navigation
|
||||
|
Loading…
Reference in New Issue
Block a user