Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Tree: 3cae5d174a
Fetching contributors…

Cannot retrieve contributors at this time

193 lines (162 sloc) 3.335 kB
//
// Navigation for screens < 980px
// --------------------------------------------------
.main-navigation {
width: 100%;
margin: 0 auto;
.menu {
list-style: none;
margin: 0;
}
.menu-item {
float: none;
width: 100%;
margin: 8px 0;
}
.menu-item > a {
color: #c6c6c6;
display: block;
padding: 14px 20px;
}
.menu-item > a:hover,
.menu-item > a:focus,
.current-menu-item > a,
.current-menu-ancestor > a {
background: darken(@grayDarker, 5%);
color: #ececec;
}
.menu-list-container,
.search,
.sep {
display: none;
}
}
#topbar .search {
border: 1px solid @grayDarker;
border-width: 1px 0;
float: none;
padding: 20px;
box-shadow: inset 0 1px 0 fade(@white, 10%), 0 1px 0 fade(@white, 10%);
}
/* Toggle button */
#menu-toggle {
#gradient > .vertical(#555, #444);
#font > .alternative(21px, bold, 1.5);
box-shadow: 0 1px 0 fade(@white, 10%);
border-bottom: 1px solid #050505;
color: @white;
cursor: pointer;
display: block;
width: 100%;
padding: 15px 0;
margin: 0;
text-align: center;
&:hover {
background: @grayDark;
}
&:active,
&:focus {
background: @grayDarker;
}
}
//
// Navigation for screens > 980px
// --------------------------------------------------
@media screen and (min-width: 980px) {
.main-navigation {
width: @siteWidth;
margin: 0 auto;
padding: 0 @gutterWidth - 15px; // 15px is the padding-left on .menu-item a {}
ul {
list-style: none;
margin: 0;
padding: 0;
}
.menu-list-container,
.search {
display: block !important;
}
// Each item in the navigation
.menu-item {
background: @topbarBackground ~"url(images/topbar.png)" repeat;
float: left;
width: auto;
margin: 0;
position: relative;
> a {
color: #ccc;
display: inline-block;
#font > .alternative(15px, bold, normal);
padding: 20px 15px;
text-shadow: 1px 1px 0 @grayDarker;
.transition(all 150ms);
}
}
.menu-item > a:hover,
.current-menu-item > a,
.current-menu-ancestor > a {
background-color: #444;
#gradient > .vertical(fade(@white, 0%), fade(@white, 20%));
color: #ececec;
}
// Level two */
.sub-menu {
background: @topbarBackground ~"url(images/topbar.png)" repeat;
box-shadow: 1px 2px 2px fade(@black, 30%);
border-radius: 0 0 5px 5px;
display: none;
position: absolute;
top: 100%;
left: 0;
z-index: 500;
.menu-item {
background: none;
float: none;
}
.menu-item > a {
border-top: 1px solid #3a3a3a;
border-bottom: 1px solid #262627;
font-size: 14px;
display: block;
width: 180px;
padding: 18px 14px;
}
.menu-item:first-of-type > a {
border-top: none;
}
.menu-item:last-of-type > a {
border-bottom: none;
}
// Level n
.sub-menu {
top: 0;
left: 100%;
}
}
// Display the sub menus on hover
.menu-item:hover > ul {
display: block;
}
/* Separator */
.sep {
display: inline;
color: #808080;
}
.sub-menu .sep,
.menu-item:last-of-type .sep {
display: none;
}
}
/* Hide toggle button */
#menu-toggle {
display: none;
}
} // Media query: min-width 980px;
/* No JS; show the menu */
.no-js .main-navigation .menu-list-container,
.no-js .main-navigation .search {
display: block !important;
}
.no-js #menu-toggle {
visibility: hidden;
}
Jump to Line
Something went wrong with that request. Please try again.