diff options
| author | Mark Otto <[email protected]> | 2012-03-22 21:54:54 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2012-03-22 21:54:54 -0700 |
| commit | 20da2c8ea08da9d15b72844f54bb91c9cba8b28e (patch) | |
| tree | de117cea9815ad5f1ced4e13e1c34f003046f4b4 /less/responsive-navbar.less | |
| parent | ab068f6fda525236220af6e1bf879a677ed6bfc0 (diff) | |
| download | bootstrap-20da2c8ea08da9d15b72844f54bb91c9cba8b28e.tar.xz bootstrap-20da2c8ea08da9d15b72844f54bb91c9cba8b28e.zip | |
add the broken out responsive files
Diffstat (limited to 'less/responsive-navbar.less')
| -rw-r--r-- | less/responsive-navbar.less | 131 |
1 files changed, 131 insertions, 0 deletions
diff --git a/less/responsive-navbar.less b/less/responsive-navbar.less new file mode 100644 index 000000000..59e456a22 --- /dev/null +++ b/less/responsive-navbar.less @@ -0,0 +1,131 @@ +// TABLETS AND BELOW +// ----------------- +@media (max-width: 979px) { + + // UNFIX THE TOPBAR + // ---------------- + // Remove any padding from the body + body { + padding-top: 0; + } + // Unfix the navbar + .navbar-fixed-top { + position: static; + margin-bottom: @baseLineHeight; + } + .navbar-fixed-top .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; + } + // Nav collapse clears brand + .navbar .nav-collapse { + clear: left; + } + // Block-level the nav + .navbar .nav { + float: none; + margin: 0 0 (@baseLineHeight / 2); + } + .navbar .nav > li { + float: none; + } + .navbar .nav > li > a { + margin-bottom: 2px; + } + .navbar .nav > .divider-vertical { + display: none; + } + .navbar .nav .nav-header { + color: @navbarText; + text-shadow: none; + } + // Nav and dropdown links in navbar + .navbar .nav > li > a, + .navbar .dropdown-menu a { + padding: 6px 15px; + font-weight: bold; + color: @navbarLinkColor; + .border-radius(3px); + } + .navbar .dropdown-menu li + li a { + margin-bottom: 2px; + } + .navbar .nav > li > a:hover, + .navbar .dropdown-menu a:hover { + background-color: @navbarBackground; + } + // Dropdowns in the navbar + .navbar .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); + } + .navbar .dropdown-menu:before, + .navbar .dropdown-menu:after { + display: none; + } + .navbar .dropdown-menu .divider { + display: none; + } + // Forms in navbar + .navbar-form, + .navbar-search { + float: none; + padding: (@baseLineHeight / 2) 15px; + margin: (@baseLineHeight / 2) 0; + border-top: 1px solid @navbarBackground; + border-bottom: 1px solid @navbarBackground; + @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1); + .box-shadow(@shadow); + } + // Pull right (secondary) nav content + .navbar .nav.pull-right { + float: none; + margin-left: 0; + } + // Static navbar + .navbar-static .navbar-inner { + padding-left: 10px; + padding-right: 10px; + } + // Navbar button + .btn-navbar { + display: block; + } + + // Hide everything in the navbar save .brand and toggle button */ + .nav-collapse { + overflow: hidden; + height: 0; + } +} + + +// DEFAULT DESKTOP +// --------------- + +// Required to make the collapsing navbar work on regular desktops +@media (min-width: 980px) { + .nav-collapse.collapse { + height: auto !important; + overflow: visible !important; + } +} |
