Vulcan/packages/telescope-theme-hubble/lib/client/scss/modules/_nav.scss
2015-03-20 18:31:49 +09:00

141 lines
No EOL
2.1 KiB
SCSS

// 1. Neutral
// 2. Mobile (+see Base theme for mobile nav)
// 3. Desktop
// a. Top Nav
// b. Side nav
.header{
background-color:$highlight-color;
position:relative;
z-index: 100;
.top-nav &{
height: 60px;
padding: 0 20px;
margin-bottom:$grid-margin;
@include cf;
@include small{
padding: 0 10px;
}
.primary-nav{
float:left;
z-index: 20;
position: relative;
}
.logo{
@extend %vcenter;
position:absolute;
display:block;
text-align:center;
color:white;
@include small{
font-size: 18px;
a{
position: static;
}
}
@include medium-large{
font-size:24px;
}
left: 0px;
right: 0px;
}
.logo-image{
line-height: 1;
a{
display:inline-block;
background: no-repeat center center;
font: 0/0 a;
text-shadow: none;
color: transparent;
}
}
.secondary-nav{
z-index: 20;
position: relative;
float:right;
.submit{
// background:$red;
// display:block;
// padding:0px 10px;
}
}
}
}
.logo{
a, a:visited{
color:white;
}
}
.sign-in{
margin-right: 10px;
}
.nav{
.top-nav &{
@extend %vcenter;
}
@include cf;
>li{
line-height: 2;
&:last-child{
margin-right: 0px;
}
>a, >div >a{
color:white;
font-size:15px;
font-weight:normal;
}
}
}
.has-dropdown .user-menu .dropdown-menu{
left: auto;
right: 10px;
}
.has-dropdown .notifications-menu .dropdown-menu{
left: auto;
right: 10px;
}
.newsletter-dismiss{
line-height: 30px !important;
}
$nav-width: 250px;
.side-nav{
.inner-wrapper{
margin-left: $nav-width;
padding-top: 20px;
}
.header{
width: $nav-width;
position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
height: 100%;
background: #e1e4e5;
overflow-y: auto;
.dropdown-top-level{
display: block;
border-bottom: 1px solid #ccc;
padding-bottom: 5px;
margin-bottom: 5px;
}
.menu-label{
display: block;
}
.menu-description{
// display: block;
display: none;
font-weight: normal;
}
.account-link{
display: block;
font-weight: bold;
}
}
.dropdown-menu{
max-height: 90px;
overflow: hidden;
margin-bottom: $grid-margin;
}
}