mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-05-18 12:39:41 +03:00
Clean up navbar to remove .navbar-toggle, .navbar-collapse, and .navbar-header as they are no longer used; Add .navbar-toggler to .navbar-inverse
This commit is contained in:
Mark Otto
Vendored
+3
-102
@@ -3120,73 +3120,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
border-radius: .25rem;
|
||||
}
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-header {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.navbar-collapse {
|
||||
padding-right: .75rem;
|
||||
padding-left: .75rem;
|
||||
overflow-x: visible;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
border-top: 1px solid transparent;
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
|
||||
}
|
||||
.navbar-collapse.in {
|
||||
overflow-y: auto;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-collapse {
|
||||
width: auto;
|
||||
border-top: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: block !important;
|
||||
height: auto !important;
|
||||
padding-bottom: 0;
|
||||
overflow: visible !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
.navbar-collapse.in {
|
||||
overflow-y: visible;
|
||||
}
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-static-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 340px;
|
||||
}
|
||||
@media (max-device-width: 480px) and (orientation: landscape) {
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 200px;
|
||||
}
|
||||
}
|
||||
.container > .navbar-header,
|
||||
.container-fluid > .navbar-header,
|
||||
.container > .navbar-collapse,
|
||||
.container-fluid > .navbar-collapse {
|
||||
margin-right: -.75rem;
|
||||
margin-left: -.75rem;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.container > .navbar-header,
|
||||
.container-fluid > .navbar-header,
|
||||
.container > .navbar-collapse,
|
||||
.container-fluid > .navbar-collapse {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
.navbar-static-top {
|
||||
z-index: 1000;
|
||||
border-width: 0 0 1px;
|
||||
@@ -3256,35 +3189,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
.navbar-toggler:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
position: relative;
|
||||
float: right;
|
||||
padding: 9px 10px;
|
||||
margin-top: 8px;
|
||||
margin-right: .75rem;
|
||||
margin-bottom: 8px;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
.navbar-toggle:focus {
|
||||
outline: 0;
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 2px;
|
||||
border-radius: 1px;
|
||||
}
|
||||
.navbar-toggle .icon-bar + .icon-bar {
|
||||
margin-top: 4px;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-toggle {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.navbar-nav {
|
||||
margin: 6.5px -.75rem;
|
||||
}
|
||||
@@ -3556,12 +3460,15 @@ fieldset[disabled] .navbar-default .btn-link:focus {
|
||||
background-color: #373a3c;
|
||||
border-color: #1f2021;
|
||||
}
|
||||
.navbar-inverse .navbar-toggler,
|
||||
.navbar-inverse .navbar-brand > a,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link {
|
||||
color: #aab0b5;
|
||||
}
|
||||
.navbar-inverse .navbar-toggler:hover,
|
||||
.navbar-inverse .navbar-brand > a:hover,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link:hover,
|
||||
.navbar-inverse .navbar-toggler:focus,
|
||||
.navbar-inverse .navbar-brand > a:focus,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link:focus {
|
||||
color: #fff;
|
||||
@@ -5163,10 +5070,6 @@ button.close {
|
||||
.nav:after,
|
||||
.navbar:before,
|
||||
.navbar:after,
|
||||
.navbar-header:before,
|
||||
.navbar-header:after,
|
||||
.navbar-collapse:before,
|
||||
.navbar-collapse:after,
|
||||
.pager:before,
|
||||
.pager:after,
|
||||
.modal-footer:before,
|
||||
@@ -5184,8 +5087,6 @@ button.close {
|
||||
.btn-group-vertical > .btn-group:after,
|
||||
.nav:after,
|
||||
.navbar:after,
|
||||
.navbar-header:after,
|
||||
.navbar-collapse:after,
|
||||
.pager:after,
|
||||
.modal-footer:after {
|
||||
clear: both;
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+3
-102
@@ -3120,73 +3120,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
border-radius: .25rem;
|
||||
}
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-header {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.navbar-collapse {
|
||||
padding-right: .75rem;
|
||||
padding-left: .75rem;
|
||||
overflow-x: visible;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
border-top: 1px solid transparent;
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
|
||||
}
|
||||
.navbar-collapse.in {
|
||||
overflow-y: auto;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-collapse {
|
||||
width: auto;
|
||||
border-top: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: block !important;
|
||||
height: auto !important;
|
||||
padding-bottom: 0;
|
||||
overflow: visible !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
.navbar-collapse.in {
|
||||
overflow-y: visible;
|
||||
}
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-static-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 340px;
|
||||
}
|
||||
@media (max-device-width: 480px) and (orientation: landscape) {
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 200px;
|
||||
}
|
||||
}
|
||||
.container > .navbar-header,
|
||||
.container-fluid > .navbar-header,
|
||||
.container > .navbar-collapse,
|
||||
.container-fluid > .navbar-collapse {
|
||||
margin-right: -.75rem;
|
||||
margin-left: -.75rem;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.container > .navbar-header,
|
||||
.container-fluid > .navbar-header,
|
||||
.container > .navbar-collapse,
|
||||
.container-fluid > .navbar-collapse {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
.navbar-static-top {
|
||||
z-index: 1000;
|
||||
border-width: 0 0 1px;
|
||||
@@ -3256,35 +3189,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
.navbar-toggler:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
position: relative;
|
||||
float: right;
|
||||
padding: 9px 10px;
|
||||
margin-top: 8px;
|
||||
margin-right: .75rem;
|
||||
margin-bottom: 8px;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
.navbar-toggle:focus {
|
||||
outline: 0;
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 2px;
|
||||
border-radius: 1px;
|
||||
}
|
||||
.navbar-toggle .icon-bar + .icon-bar {
|
||||
margin-top: 4px;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.navbar-toggle {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.navbar-nav {
|
||||
margin: 6.5px -.75rem;
|
||||
}
|
||||
@@ -3556,12 +3460,15 @@ fieldset[disabled] .navbar-default .btn-link:focus {
|
||||
background-color: #373a3c;
|
||||
border-color: #1f2021;
|
||||
}
|
||||
.navbar-inverse .navbar-toggler,
|
||||
.navbar-inverse .navbar-brand > a,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link {
|
||||
color: #aab0b5;
|
||||
}
|
||||
.navbar-inverse .navbar-toggler:hover,
|
||||
.navbar-inverse .navbar-brand > a:hover,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link:hover,
|
||||
.navbar-inverse .navbar-toggler:focus,
|
||||
.navbar-inverse .navbar-brand > a:focus,
|
||||
.navbar-inverse .nav-pills > .nav-item > .nav-link:focus {
|
||||
color: #fff;
|
||||
@@ -5163,10 +5070,6 @@ button.close {
|
||||
.nav:after,
|
||||
.navbar:before,
|
||||
.navbar:after,
|
||||
.navbar-header:before,
|
||||
.navbar-header:after,
|
||||
.navbar-collapse:before,
|
||||
.navbar-collapse:after,
|
||||
.pager:before,
|
||||
.pager:after,
|
||||
.modal-footer:before,
|
||||
@@ -5184,8 +5087,6 @@ button.close {
|
||||
.btn-group-vertical > .btn-group:after,
|
||||
.nav:after,
|
||||
.navbar:after,
|
||||
.navbar-header:after,
|
||||
.navbar-collapse:after,
|
||||
.pager:after,
|
||||
.modal-footer:after {
|
||||
clear: both;
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
+7
-138
@@ -24,102 +24,6 @@
|
||||
}
|
||||
|
||||
|
||||
// Navbar heading
|
||||
//
|
||||
// Groups `.navbar-brand` and `.navbar-toggle` into a single component for easy
|
||||
// styling of responsive aspects.
|
||||
|
||||
.navbar-header {
|
||||
&:extend(.clearfix all);
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Navbar collapse (body)
|
||||
//
|
||||
// Group your navbar content into this for easy collapsing and expanding across
|
||||
// various device sizes. By default, this content is collapsed when <768px, but
|
||||
// will expand past that for a horizontal display.
|
||||
//
|
||||
// To start (on mobile devices) the navbar links, forms, and buttons are stacked
|
||||
// vertically and include a `max-height` to overflow in case you have too much
|
||||
// content for the user's viewport.
|
||||
|
||||
.navbar-collapse {
|
||||
overflow-x: visible;
|
||||
padding-right: @navbar-padding-horizontal;
|
||||
padding-left: @navbar-padding-horizontal;
|
||||
border-top: 1px solid transparent;
|
||||
.box-shadow(inset 0 1px 0 rgba(255,255,255,.1));
|
||||
&:extend(.clearfix all);
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
&.in {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
width: auto;
|
||||
border-top: 0;
|
||||
.box-shadow(none);
|
||||
|
||||
&.collapse {
|
||||
display: block !important;
|
||||
visibility: visible !important;
|
||||
height: auto !important;
|
||||
padding-bottom: 0; // Override default setting
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
&.in {
|
||||
overflow-y: visible;
|
||||
}
|
||||
|
||||
// Undo the collapse side padding for navbars with containers to ensure
|
||||
// alignment of right-aligned contents.
|
||||
.navbar-fixed-top &,
|
||||
.navbar-static-top &,
|
||||
.navbar-fixed-bottom & {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-fixed-top,
|
||||
.navbar-fixed-bottom {
|
||||
.navbar-collapse {
|
||||
max-height: @navbar-collapse-max-height;
|
||||
|
||||
@media (max-device-width: 480px) and (orientation: landscape) {
|
||||
max-height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Both navbar header and collapse
|
||||
//
|
||||
// When a container is present, change the behavior of the header and collapse.
|
||||
|
||||
.container,
|
||||
.container-fluid {
|
||||
> .navbar-header,
|
||||
> .navbar-collapse {
|
||||
margin-right: -@navbar-padding-horizontal;
|
||||
margin-left: -@navbar-padding-horizontal;
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Navbar alignment options
|
||||
//
|
||||
@@ -190,7 +94,12 @@
|
||||
*/
|
||||
}
|
||||
|
||||
// New hotness
|
||||
|
||||
// Navbar toggle
|
||||
//
|
||||
// Custom button for toggling the `.navbar-collapse`, powered by the collapse
|
||||
// JavaScript plugin.
|
||||
|
||||
.navbar-toggler {
|
||||
float: left;
|
||||
padding: .55rem .75rem;
|
||||
@@ -208,47 +117,6 @@
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Navbar toggle
|
||||
//
|
||||
// Custom button for toggling the `.navbar-collapse`, powered by the collapse
|
||||
// JavaScript plugin.
|
||||
|
||||
.navbar-toggle {
|
||||
position: relative;
|
||||
float: right;
|
||||
margin-right: @navbar-padding-horizontal;
|
||||
padding: 9px 10px;
|
||||
.navbar-vertical-align(34px);
|
||||
background-color: transparent;
|
||||
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
|
||||
border: 1px solid transparent;
|
||||
.border-radius(@border-radius-base);
|
||||
|
||||
// We remove the `outline` here, but later compensate by attaching `:hover`
|
||||
// styles to `:focus`.
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
// Bars
|
||||
.icon-bar {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 2px;
|
||||
.border-radius(1px);
|
||||
}
|
||||
.icon-bar + .icon-bar {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Navbar nav links
|
||||
//
|
||||
// Builds on top of the `.nav` components with its own modifier class to make
|
||||
@@ -553,6 +421,7 @@
|
||||
background-color: @navbar-inverse-bg;
|
||||
border-color: @navbar-inverse-border;
|
||||
|
||||
.navbar-toggler,
|
||||
.navbar-brand > a,
|
||||
.nav-pills > .nav-item > .nav-link {
|
||||
color: @navbar-inverse-link-color;
|
||||
|
||||
Reference in New Issue
Block a user