mirror of
https://github.com/13hannes11/hugo-coder-timeline.git
synced 2024-09-04 00:50:58 +02:00
* Add theme toggle button feature * Add theme toggle button feature * Replaced svg icon with FA icon + fixed indentation + refactored css * Added back colorsheme configurations + script moved to be process by hugo pipe * Make release * Fix toggle button not working when loading new page + setTheme() refactor * Make release * Update exampleSite/config.toml Co-authored-by: Luiz F. A. de Prá <luizdepra@users.noreply.github.com>
53 lines
997 B
SCSS
53 lines
997 B
SCSS
@mixin navigation_dark {
|
|
|
|
|
|
.navigation {
|
|
a, span {
|
|
color: $fg-color-dark;
|
|
}
|
|
a {
|
|
&:hover,
|
|
&:focus {
|
|
color: $link-color-dark;
|
|
}
|
|
}
|
|
.navigation-list {
|
|
@media only screen and (max-width : 768px) {
|
|
background-color: $bg-color-dark;
|
|
border-top: solid 2px $alt-bg-color-dark;
|
|
border-bottom: solid 2px $alt-bg-color-dark;
|
|
}
|
|
.menu-separator {
|
|
@media only screen and (max-width : 768px) {
|
|
border-top: 2px solid $fg-color-dark;
|
|
}
|
|
}
|
|
}
|
|
#menu-toggle {
|
|
@media only screen and (max-width : 768px) {
|
|
&:checked + label > i {
|
|
color: $alt-bg-color-dark;
|
|
}
|
|
}
|
|
}
|
|
i {
|
|
color: $fg-color-dark;
|
|
&:hover,
|
|
&:focus {
|
|
color: $link-color-dark;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
body.colorscheme-dark {
|
|
@include navigation_dark()
|
|
}
|
|
|
|
body.colorscheme-auto {
|
|
@media (prefers-color-scheme: dark) {
|
|
@include navigation_dark()
|
|
}
|
|
}
|