- Move Bootstrap LESS files into new subdirectory - Change app.css to app.less, add @import's to utilize Bootstrap variables and mixins - Remove plugins.js and main.js - Move Bootstrap JS plugins into new subdirectory - Add new _main.js file with example DOM-based routing script that works off the WordPress body_class - lib/scripts.php has been updated to remove all extra CSS and JS files and also places JavaScript in the footer
178 lines
3.8 KiB
Plaintext
Executable File
178 lines
3.8 KiB
Plaintext
Executable File
//
|
|
// Responsive: Navbar
|
|
// --------------------------------------------------
|
|
|
|
|
|
// TABLETS AND BELOW
|
|
// -----------------
|
|
@media (max-width: @navbarCollapseWidth) {
|
|
|
|
// UNFIX THE TOPBAR
|
|
// ----------------
|
|
// Remove any padding from the body
|
|
body {
|
|
padding-top: 0;
|
|
}
|
|
// Unfix the navbars
|
|
.navbar-fixed-top,
|
|
.navbar-fixed-bottom {
|
|
position: static;
|
|
}
|
|
.navbar-fixed-top {
|
|
margin-bottom: @baseLineHeight;
|
|
}
|
|
.navbar-fixed-bottom {
|
|
margin-top: @baseLineHeight;
|
|
}
|
|
.navbar-fixed-top .navbar-inner,
|
|
.navbar-fixed-bottom .navbar-inner {
|
|
padding: 5px;
|
|
}
|
|
.navbar .container {
|
|
width: auto;
|
|
padding: 0;
|
|
}
|
|
// Account for brand name
|
|
.navbar .brand {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
margin: 0 0 0 -5px;
|
|
}
|
|
|
|
// COLLAPSIBLE NAVBAR
|
|
// ------------------
|
|
// Nav collapse clears brand
|
|
.nav-collapse {
|
|
clear: both;
|
|
}
|
|
// Block-level the nav
|
|
.nav-collapse .nav {
|
|
float: none;
|
|
margin: 0 0 (@baseLineHeight / 2);
|
|
}
|
|
.nav-collapse .nav > li {
|
|
float: none;
|
|
}
|
|
.nav-collapse .nav > li > a {
|
|
margin-bottom: 2px;
|
|
}
|
|
.nav-collapse .nav > .divider-vertical {
|
|
display: none;
|
|
}
|
|
.nav-collapse .nav .nav-header {
|
|
color: @navbarText;
|
|
text-shadow: none;
|
|
}
|
|
// Nav and dropdown links in navbar
|
|
.nav-collapse .nav > li > a,
|
|
.nav-collapse .dropdown-menu a {
|
|
padding: 9px 15px;
|
|
font-weight: bold;
|
|
color: @navbarLinkColor;
|
|
.border-radius(3px);
|
|
}
|
|
// Buttons
|
|
.nav-collapse .btn {
|
|
padding: 4px 10px 4px;
|
|
font-weight: normal;
|
|
.border-radius(4px);
|
|
}
|
|
.nav-collapse .dropdown-menu li + li a {
|
|
margin-bottom: 2px;
|
|
}
|
|
.nav-collapse .nav > li > a:hover,
|
|
.nav-collapse .dropdown-menu a:hover {
|
|
background-color: @navbarBackground;
|
|
}
|
|
.navbar-inverse .nav-collapse .nav > li > a:hover,
|
|
.navbar-inverse .nav-collapse .dropdown-menu a:hover {
|
|
background-color: @navbarInverseBackground;
|
|
}
|
|
// Buttons in the navbar
|
|
.nav-collapse.in .btn-group {
|
|
margin-top: 5px;
|
|
padding: 0;
|
|
}
|
|
// Dropdowns in the navbar
|
|
.nav-collapse .dropdown-menu {
|
|
position: static;
|
|
top: auto;
|
|
left: auto;
|
|
float: none;
|
|
display: block;
|
|
max-width: none;
|
|
margin: 0 15px;
|
|
padding: 0;
|
|
background-color: transparent;
|
|
border: none;
|
|
.border-radius(0);
|
|
.box-shadow(none);
|
|
}
|
|
.nav-collapse .dropdown-menu:before,
|
|
.nav-collapse .dropdown-menu:after {
|
|
display: none;
|
|
}
|
|
.nav-collapse .dropdown-menu .divider {
|
|
display: none;
|
|
}
|
|
.nav-collapse .nav > li > .dropdown-menu {
|
|
&:before,
|
|
&:after {
|
|
display: none;
|
|
}
|
|
}
|
|
// Forms in navbar
|
|
.nav-collapse .navbar-form,
|
|
.nav-collapse .navbar-search {
|
|
float: none;
|
|
padding: (@baseLineHeight / 2) 15px;
|
|
margin: (@baseLineHeight / 2) 0;
|
|
border-top: 1px solid @navbarBackground;
|
|
border-bottom: 1px solid @navbarBackground;
|
|
.box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1));
|
|
}
|
|
.navbar-inverse .nav-collapse .navbar-form,
|
|
.navbar-inverse .nav-collapse .navbar-search {
|
|
border-top-color: @navbarInverseBackground;
|
|
border-bottom-color: @navbarInverseBackground;
|
|
}
|
|
// Pull right (secondary) nav content
|
|
.navbar .nav-collapse .nav.pull-right {
|
|
float: none;
|
|
margin-left: 0;
|
|
}
|
|
// Hide everything in the navbar save .brand and toggle button */
|
|
.nav-collapse,
|
|
.nav-collapse.collapse {
|
|
overflow: hidden;
|
|
height: 0;
|
|
}
|
|
// Navbar button
|
|
.navbar .btn-navbar {
|
|
display: block;
|
|
}
|
|
|
|
// STATIC NAVBAR
|
|
// -------------
|
|
.navbar-static .navbar-inner {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
// DEFAULT DESKTOP
|
|
// ---------------
|
|
|
|
@media (min-width: 980px) {
|
|
|
|
// Required to make the collapsing navbar work on regular desktops
|
|
.nav-collapse.collapse {
|
|
height: auto !important;
|
|
overflow: visible !important;
|
|
}
|
|
|
|
}
|