imio-publik-themes/static/imio/_menu.scss

141 lines
3.2 KiB
SCSS

@charset "UTF-8";
$nav-color: #333333 !default;
$nav-active-color: transparent !default;
$nav-item-selected-color: white !default;
$nav-item-selected-background-color: $primary-color !default; /*#D8297B !default;*/
$nav-item-decoration: None !default;
$nav-text-uppercase: false !default;
$nav-underline: false !default;
$nav-active-font-weight: normal !default;
div#nav {
background: $nav-background;
margin: 0 auto 1em auto;
}
div#nav > ul {
margin: 0;
}
div.gru-nav > ul > li a {
font-weight: normal;
text-transform: $nav-text-uppercase;
margin-right: 1px;
transition: background-color 0.2s, color 0.2s;
&:hover {
text-decoration: $nav-item-decoration;
}
}
div.gru-nav > ul > li.selected a {
font-weight: $nav-active-font-weight;
}
/*
div#nav ul li a {
font-weight: normal;
color:$nav-color;
@if $nav-text-uppercase {
text-transform: uppercase;
}
}
div#nav ul li.selected a,
div#nav ul li:hover a {
color: $nav-item-selected-color;
font-weight: $nav-active-font-weight;
background: $nav-item-selected-background;
}
*/
//new selector and styles
/*
div.gru-nav > ul > li a {
margin-right: 2px;
text-transform: uppercase;
padding: 0.5em 1em;
transition: background 0.5s, color 0.25s;
}
*/
/*
@if $nav-underline {
$nav-item-selected-mode: border-bottom;
$nav-item-hover-mode: border-bottom;
}
div#nav > ul {
border-color: transparent;
height: 36px;
overflow: unset;
padding: 0;
margin-top: 0;
}
div#nav > ul > li {
background: transparent;
margin-right: 0px;
display: inline-block;
margin: 0;
padding: 0;
}
div#nav li.selected > a {
padding-bottom: 2px;
background-color: transparent;
border-bottom: 2px solid;
@if $nav-item-selected-background-color != 'None' {
border-color:$nav-item-selected-background-color;
}
}
div#nav > ul > li a {
text-transform: uppercase;
color: #eee;
font-weight: normal;
padding: 0px 20px;
padding-bottom: 0px;
display: inline-block;
line-height: 2.8em;
-webkit-transition: background 0.5s, color 0.5s;
-moz-transition: background 0.5s, color 0.5s;
-ms-transition: background 0.5s, color 0.5s;
-o-transition: background 0.5s, color 0.5s;
transition: background 0.5s, color 0.25s;
text-decoration: none;
background-color:transparent;
}
div#nav > ul > li > a:hover {
padding-bottom: 2px;
border-bottom: 2px solid;
@if $nav-item-selected-background-color != 'None' {
border-color:$nav-item-selected-background-color;
}
}
}
@else {
div#nav ul li.selected a {
@if $nav-item-selected-background-color != 'None' {
background-color:$nav-item-selected-background-color;
}
}
div#nav ul li:hover a {
@if $nav-item-selected-background-color != 'None' {
background-color:$nav-item-selected-background-color;
}
}
div#nav ul li:hover a{
color:$nav-item-selected-color;
text-decoration: $nav-item-decoration;
}
div#nav > ul > li ul > li:hover > a > span {
color:$nav-item-selected-color;
transition: background 0.5s ease 0s, color 0.5s ease 0s;
}
}
*/