hippie/source/style/modules/navigation/_nav_module.scss
Stephan Hagedorn a4a1fbc14d gulp and file structure overhaul
new gulp setup
including new npm packages
new file structure
moved all development files to source/
used files are in build/ now
2017-09-26 22:02:10 +02:00

162 lines
2 KiB
SCSS

nav {
ul {
padding-left: 0;
}
li {
margin-bottom: $basic_space;
list-style: none;
}
}
.nav__horizontal {
ul {
@extend .overflow;
ul {
margin: $basic_space 0;
}
li {
@extend .float_space_left;
margin-right: $basic_space;
margin-bottom: 0;
&:last-child {
margin-right: 0;
}
}
}
}
.nav__right {
float: right;
margin-left: $basic_space;
.align_parent {
margin-right: $basic_space * -1;
}
}
.nav__separate {
li {
position: relative;
padding-left: $tiny_space;
&:not(:first-child) {
&::before {
content: "";
position: absolute;
width: $tiny_space;
height: 100%;
left: 0;
top: 0;
background-color: $darkest_color;
}
}
}
}
.nav__separate_right {
float: right;
li {
position: relative;
&:first-child {
padding-left: $basic_space * 2 + $tiny_space;
&::before {
content: "";
position: absolute;
width: $tiny_space;
height: 100%;
left: 0;
top: 0;
background-color: $brightest_color;
margin: 0 $basic_space;
}
}
}
}
.nav__center_old {
@extend .nav__horizontal;
float: right;
position: relative;
left: -50%;
ul {
position: relative;
left: 50%;
text-align: center;
}
}
.nav__column {
position: relative;
margin: $basic_space 0;
ul {
@extend .flex;
margin: 0 $space_5;
li {
@extend .flex__child;
flex-grow: 1;
margin: 0;
text-align: center;
a {
display: block;
}
}
}
}
.nav__page_meta {
position: fixed;
// display: table;
// width: 3em;
right: 0;
bottom: $double_space;
ul {
margin: $basic_space 0;
}
li {
margin-bottom: 0;
}
.a_button_meta {
// display: table-cell;
display: inline-block;
&:active,
&:focus {
background-color: transparent;
}
&:hover {
background-color: $basic_action_color;
}
}
}
.header__page {
nav {
@extend .nav__horizontal;
a {
&:active,
&:focus,
&:hover {
background-color: rgba($basic_font_color, .2);
color: $basic_font_color;
}
}
}
}