mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-17 09:52:29 +01:00
Fixes #12738
* Removes default max-height from .navbar-collapse (so not every navbar will get a max-height collapse section) * Scopes regular 340px max-height to fixed top and bottom navbars only (those are the only ones that really need a max-height to enable scrolling) * Adds a landscape media query for phones to cap the max-height at 200px for fixed navbars"
This commit is contained in:
parent
1a5fb4ef24
commit
b4d66b7f6b
13
dist/css/bootstrap-rtl.css
vendored
13
dist/css/bootstrap-rtl.css
vendored
@ -4649,7 +4649,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
max-height: 340px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
overflow-x: visible;
|
||||
@ -4690,6 +4689,18 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 340px;
|
||||
}
|
||||
|
||||
@media (max-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,
|
||||
|
2
dist/css/bootstrap-rtl.min.css
vendored
2
dist/css/bootstrap-rtl.min.css
vendored
File diff suppressed because one or more lines are too long
11
dist/css/bootstrap.css
vendored
11
dist/css/bootstrap.css
vendored
@ -3705,7 +3705,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
}
|
||||
}
|
||||
.navbar-collapse {
|
||||
max-height: 340px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
overflow-x: visible;
|
||||
@ -3740,6 +3739,16 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
.navbar-fixed-top .navbar-collapse,
|
||||
.navbar-fixed-bottom .navbar-collapse {
|
||||
max-height: 340px;
|
||||
}
|
||||
@media (max-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,
|
||||
|
2
dist/css/bootstrap.css.map
vendored
2
dist/css/bootstrap.css.map
vendored
File diff suppressed because one or more lines are too long
2
dist/css/bootstrap.min.css
vendored
2
dist/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
2
docs/dist/css/bootstrap-rtl.min.css
vendored
2
docs/dist/css/bootstrap-rtl.min.css
vendored
File diff suppressed because one or more lines are too long
2
docs/dist/css/bootstrap.css.map
vendored
2
docs/dist/css/bootstrap.css.map
vendored
File diff suppressed because one or more lines are too long
2
docs/dist/css/bootstrap.min.css
vendored
2
docs/dist/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
@ -48,7 +48,6 @@
|
||||
// content for the user's viewport.
|
||||
|
||||
.navbar-collapse {
|
||||
max-height: @navbar-collapse-max-height;
|
||||
overflow-x: visible;
|
||||
padding-right: @navbar-padding-horizontal;
|
||||
padding-left: @navbar-padding-horizontal;
|
||||
@ -88,6 +87,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-fixed-top,
|
||||
.navbar-fixed-bottom {
|
||||
.navbar-collapse {
|
||||
max-height: @navbar-collapse-max-height;
|
||||
|
||||
@media (max-width: @screen-phone) and (orientation: landscape) {
|
||||
max-height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Both navbar header and collapse
|
||||
//
|
||||
|
@ -261,7 +261,7 @@
|
||||
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
|
||||
|
||||
// Extra small screen / phone
|
||||
// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1, and @screen-xs-min as of v3.2.0
|
||||
// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1
|
||||
@screen-xs: 480px;
|
||||
@screen-xs-min: @screen-xs;
|
||||
@screen-phone: @screen-xs-min;
|
||||
|
Loading…
x
Reference in New Issue
Block a user