theme-blog-ewen/assets/scss/templates/_navigation.scss
2023-12-15 17:27:07 +01:00

127 lines
2.3 KiB
SCSS

.nav-item {
margin: 0;
.nav-link {
text-transform: initial;
}
}
.navbar-white .navbar-nav .nav-link {
color: $text-color-dark;
&:hover {
color: $primary-color;
}
}
.navbar-expand-lg .navbar-nav .nav-link {
padding: 20px;
}
.navbar-brand {
font-family: KallaikosrevveRegular;
font-weight: bold;
font-size: 26px;
color: $text-color-dark;
text-decoration: none;
&:hover {
text-decoration: none;
}
}
/* Collapses */
#navbar-toggle-cbox {
display: none;
}
#navbar-toggle-cbox:checked ~ .collapse {
display: block;
}
/*
#piv-on-toggle-cbox {
display: none;
}
#piv-on-toggle-cbox:checked ~ .collapse {
display: block;
}
*/
.mydropdown {
input {
display: none;
&:checked ~ .collapse {
display: block;
}
}
&-toggler {
display: flex;
align-items: center;
li {
a {
display: flex;
align-self: center;
padding: 5px;
border-radius: 3px;
text-align: center;
color: $text-color-dark;
width: 100%;
&:after {
content: "\f0d7";
font-family: FontAwesome;
padding-left: 7px;
margin: auto;
font-size: .7em;
}
}
}
}
&-menu {
position: absolute;
z-index: 999;
display: block;
padding: 6px 0;
list-style: none;
background: #fff;
border: 1px solid $text-color-dark;
border-radius: 3px;
min-width: 100px;
a {
display: block;
padding: 6px 15px;
text-decoration: none;
color: $text-color-dark;
&:hover,
&:focus {
color: $white;
background: $primary-color;
}
}
}
.flag {
display: block;
width: 32px;
margin: auto;
padding-top: 2px;
}
}
#lang-toggle-cbox:checked ~ .lang-toggler li a:after {
content: "\f0d8";
}
.desktop-view {
display: block;
@include desktop {
display: none;
}
}