koto/theme/_primary-nav.scss
Joshua Strobl 812cdc6677 Implement pseudoactive style and apply it to our KotoButton on hover / leave (removal).
Apply our pseudoactive styling to very specific KotoButtons in our KotoNav.
2021-07-08 14:39:39 +03:00

35 lines
No EOL
874 B
SCSS

.primary-nav {
padding: 10px 0;
& > viewport > box {
& > .koto-button, // Direct buttons like Home
& > .expander > .expander-header { // Expander Headers
font-size: large;
padding-top: 10px;
padding-bottom: 10px;
}
& > .koto-button, // Direct buttons like Home
& > .expander > .expander-header, // Expander Headers
& > .expander revealer .koto-button { // Expander revealer Buttons
margin-left: 10px;
margin-right: 10px;
padding-left: 10px;
padding-right: 10px;
}
& > .koto-button, // Direct buttons like Home
& > .expander revealer .koto-button { // Expander revealer Buttons
&.pseudoactive { // When hovering or explicit request to show as active
background-color: $primary-nav-button-active-color;
border-radius: 10px;
}
}
& > .expander {
& > .expander-header {
color: $text-color-faded;
}
}
}
}