76 lines
1.2 KiB
SCSS
76 lines
1.2 KiB
SCSS
.menu {
|
|
.menu-list {
|
|
margin-top: 1rem;
|
|
|
|
a {
|
|
font-weight: $weight-semibold;
|
|
padding: 0.5rem 1.5rem;
|
|
border-radius: 0;
|
|
box-shadow: inset 0 0 0 $grey-blue;
|
|
transition: box-shadow 0.1s ease-in-out;
|
|
text-decoration: none;
|
|
|
|
&:hover,
|
|
&.is-active {
|
|
background: transparent;
|
|
box-shadow: inset -3px 0 0 $blue;
|
|
color: $blue;
|
|
|
|
.icon {
|
|
fill: $blue;
|
|
}
|
|
}
|
|
|
|
.tag {
|
|
margin-left: 0.5em;
|
|
}
|
|
|
|
.icon {
|
|
margin-right: 0.5em;
|
|
fill: lighten($text, 30%);
|
|
}
|
|
}
|
|
|
|
.menu-item {
|
|
margin: 0.5rem 1.5rem;
|
|
|
|
&.is-wide {
|
|
margin: 0.5rem 1rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
.menu-label {
|
|
margin: 1rem 0.75rem 0.5rem;
|
|
padding-top: 0.5rem;
|
|
color: darken($grey-blue, 20%);
|
|
letter-spacing: 0;
|
|
|
|
&:first-child {
|
|
margin-top: 0;
|
|
padding-top: 1rem;
|
|
}
|
|
|
|
&:not(:first-child) {
|
|
border-top: 1px solid $grey-blue;
|
|
}
|
|
|
|
&.is-minor {
|
|
border-top: none;
|
|
margin-top: 0;
|
|
}
|
|
|
|
+ .menu-list {
|
|
margin-top: 0.5rem;
|
|
}
|
|
}
|
|
|
|
.collapsed-only + .menu-label {
|
|
border-top: none;
|
|
|
|
@media #{$mq-hidden-gutter} {
|
|
border-top: 1px solid $grey-blue;
|
|
}
|
|
}
|
|
}
|