Files
project-work/worker-toolkit-flaredown/repo/frontend/app/styles/components/navigation-bar.scss

83 lines
1.5 KiB
SCSS

$large-screen: 50em !default;
$medium-screen: 30em !default;
$submenu-width: 12em;
$action-color: #477DCA !default;
$sliding-panel-border-color: #eee;
$sliding-panel-background: #fff;
$sliding-panel-color: $primary;
$sliding-panel-border: 1px solid $sliding-panel-border-color;
$sliding-panel-background-hover: $primary;
$sliding-panel-color-hover: #fff;
$sliding-panel-background-focus: darken($sliding-panel-background, 5%);
.navigation-bar {
display: none;
@include media ($medium-screen) {
display: inline-block;
}
.navigation-wrapper {
@include clearfix;
@include outer-container;
position: relative;
}
.logo {
float: left;
img {
max-height: 2em;
padding-left: 1em;
padding-right: 1em;
}
}
nav {
float: none;
@include media ($medium-screen) {
float: left;
text-align: center;
line-height: 1.5em;
padding-top: 0.3em;
}
}
ul.navigation-menu {
clear: both;
margin: 0 auto;
overflow: visible;
padding: 0;
width: 100%;
@include media ($medium-screen) {
display: block;
margin: 0;
padding: 0;
}
}
// Nav items
ul li.nav-link {
display: block;
text-align: right;
width: 100%;
@include media ($medium-screen) {
background: transparent;
display: inline;
text-decoration: none;
width: auto;
}
}
li.nav-link a {
display: inline-block;
@include media ($large-screen) {
padding-right: 1em;
}
}
}