pico/docs/scss/layout/_aside.scss
2019-12-11 08:46:32 +07:00

73 lines
1.0 KiB
SCSS

/**
* Docs: Aside
*/
main > aside {
nav {
width: 100%;
margin-bottom: $spacing-block;
h1 {
margin-bottom: $spacing-typography;
}
@media (min-width: map-get($breakpoints, "lg")) {
position: fixed;
width: 200px;
max-height: calc(100vh - 5.5rem);
margin-bottom: 0;
overflow-x: hidden;
overflow-y: auto;
h1 {
display: none;
}
}
}
li, summary {
padding-top: 0;
padding-bottom: 0;
font-size: 16px;
}
li a {
padding: 0.375rem 0.5rem;
svg {
vertical-align: middle;
}
}
a.secondary:focus {
background-color: transparent;
color: var(--primary-hover);
}
a.active,
a.active:hover {
color: var(--primary);
}
details {
padding-bottom: .25rem;
border-bottom: none;
summary {
color: var(--h3);
font-size: 14px;
font-weight: 300;
text-transform: uppercase;
&::after {
display: none;
}
}
&[open] summary {
color: var(--h3);
}
}
}