mirror of
https://github.com/danog/sass-site.git
synced 2024-12-14 10:28:05 +01:00
85 lines
1.5 KiB
SCSS
85 lines
1.5 KiB
SCSS
.navigation {
|
|
@include padding-leader;
|
|
background: $color-background;
|
|
|
|
li {
|
|
@include trailer(.5);
|
|
|
|
&:last-child { margin-bottom: 0; }
|
|
}
|
|
|
|
a {
|
|
@include padding-leader(.5);
|
|
@include padding-trailer(.5);
|
|
display: block;
|
|
padding: {
|
|
right: $gutter-width;
|
|
left: $gutter-width;
|
|
}
|
|
background: mix($color-background, $color-background-shade);
|
|
|
|
&:hover,
|
|
&:focus { background: $color-background-shade; }
|
|
}
|
|
|
|
@include breakpoint($tablet-small) {
|
|
margin: {
|
|
right: 0;
|
|
left: 0;
|
|
}
|
|
|
|
ul { @extend %clear-fix-tablet-small; }
|
|
|
|
li {
|
|
float: left;
|
|
width: 50%;
|
|
|
|
&:nth-child(odd) {
|
|
clear: both;
|
|
padding-right: $gutter-width / 2;
|
|
}
|
|
|
|
&:nth-child(even) { padding-left: $gutter-width / 2; }
|
|
}
|
|
}
|
|
|
|
@include breakpoint($tablet-large) {
|
|
@extend %table-layout-cell-tablet-large;
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align: right;
|
|
background: none;
|
|
|
|
&.collapse { display: table-cell !important; }
|
|
|
|
ul {
|
|
display: inline-block;
|
|
margin: 0 #{-$gutter-width} 0 $gutter-width;
|
|
}
|
|
|
|
li {
|
|
margin: {
|
|
right: $gutter-width;
|
|
bottom: 0;
|
|
}
|
|
width: auto;
|
|
|
|
&:nth-child(odd) {
|
|
clear: none;
|
|
padding-right: 0;
|
|
}
|
|
|
|
&:nth-child(even) { padding-left: 0; }
|
|
|
|
&:last-child { margin-right: 0; }
|
|
}
|
|
|
|
a {
|
|
background: none;
|
|
|
|
&:hover,
|
|
&:focus { background: $color-background-shade; }
|
|
}
|
|
}
|
|
}
|