liebling/src/sass/components/header/_nav.scss
2020-07-02 22:23:00 +02:00

95 lines
1.5 KiB
SCSS

.m-nav {
@include respond-to('medium') {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.m-nav__left {
margin-bottom: 30px;
@include respond-to('medium') {
margin-bottom: 0;
}
ul {
padding: 0;
margin: 0;
@include respond-to('medium') {
display: flex;
align-items: center;
}
}
li {
color: var(--titles-color);
letter-spacing: 0.3px;
font-size: 1.125rem;
margin-bottom: 15px;
@include respond-to('medium') {
margin-bottom: 0;
margin-right: 35px;
position: relative;
}
&:last-of-type {
margin-bottom: 0;
@include respond-to('medium') {
margin-right: 0;
}
}
&.nav-current {
font-weight: 600;
}
a {
color: inherit;
}
&.more {
a {
display: inline-flex;
align-items: center;
@include respond-to('medium') {
display: flex;
}
span {
display: inline-block;
color: inherit;
font-size: 0.375rem;
margin-left: 8px;
@include transform(translateY(1px));
}
}
}
}
}
.m-nav__right {
display: flex;
align-items: center;
justify-content: flex-end;
}
.rtl {
.m-nav__left li {
@include respond-to('medium') {
margin-right: 0;
margin-left: 35px;
&:last-of-type {
@include respond-to('medium') {
margin-left: 0;
}
}
}
}
}