mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
rename @screen-XX to @screen-XX-min for clarity+unambiguity
This commit is contained in:
parent
d666a89621
commit
a3a02f9e6e
5 changed files with 52 additions and 48 deletions
|
@ -558,7 +558,7 @@
|
|||
padding-right: (@gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: @screen-sm) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
|
@ -566,17 +566,17 @@
|
|||
|
||||
// Generate the small column offsets
|
||||
.make-sm-column-offset(@columns) {
|
||||
@media (min-width: @screen-sm) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-sm-column-push(@columns) {
|
||||
@media (min-width: @screen-sm) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-sm-column-pull(@columns) {
|
||||
@media (min-width: @screen-sm) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
@ -591,7 +591,7 @@
|
|||
padding-right: (@gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: @screen-md) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
|
@ -599,7 +599,7 @@
|
|||
|
||||
// Generate the large column offsets
|
||||
.make-md-column-offset(@columns) {
|
||||
@media (min-width: @screen-md) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
@ -609,7 +609,7 @@
|
|||
}
|
||||
}
|
||||
.make-md-column-pull(@columns) {
|
||||
@media (min-width: @screen-md) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
@ -624,7 +624,7 @@
|
|||
padding-right: (@gutter / 2);
|
||||
|
||||
// Calculate width based on number of columns available
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
|
@ -632,17 +632,17 @@
|
|||
|
||||
// Generate the large column offsets
|
||||
.make-lg-column-offset(@columns) {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-lg-column-push(@columns) {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-lg-column-pull(@columns) {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
|
|
@ -162,7 +162,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
> li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
|
|
|
@ -41,17 +41,17 @@
|
|||
.responsive-visibility();
|
||||
}
|
||||
&.visible-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
&.visible-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
&.visible-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
|
@ -63,16 +63,16 @@
|
|||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
&.visible-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
&.visible-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
|
@ -85,15 +85,15 @@
|
|||
}
|
||||
}
|
||||
&.visible-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
&.visible-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
|
@ -106,16 +106,16 @@
|
|||
}
|
||||
}
|
||||
&.visible-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
&.visible-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-visibility();
|
||||
}
|
||||
}
|
||||
|
@ -126,17 +126,17 @@
|
|||
.responsive-invisibility();
|
||||
}
|
||||
&.hidden-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
&.hidden-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
&.hidden-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
|
@ -148,16 +148,16 @@
|
|||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
&.hidden-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
&.hidden-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
|
@ -170,15 +170,15 @@
|
|||
}
|
||||
}
|
||||
&.hidden-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
&.hidden-lg {
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
|
@ -191,16 +191,16 @@
|
|||
}
|
||||
}
|
||||
&.hidden-sm {
|
||||
@media (min-width: @screen-sm) and (max-width: @screen-sm-max) {
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
&.hidden-md {
|
||||
@media (min-width: @screen-md) and (max-width: @screen-md-max) {
|
||||
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-lg) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.responsive-invisibility();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -180,7 +180,7 @@ table {
|
|||
// by enabling horizontal scrolling. Only applies <768px. Everything above that
|
||||
// will display normally.
|
||||
|
||||
@media (max-width: @screen-sm) {
|
||||
@media (max-width: @screen-sm-min) {
|
||||
.table-responsive {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
|
|
|
@ -200,25 +200,29 @@
|
|||
// --------------------------------------------------
|
||||
|
||||
// Extra small screen / phone
|
||||
@screen-xs: 480px;
|
||||
@screen-phone: @screen-xs;
|
||||
@screen-xs: 480px;// NOTE: Deprecated in favor of @screen-xs-min
|
||||
@screen-xs-min: @screen-xs;
|
||||
@screen-phone: @screen-xs-min;
|
||||
|
||||
// Small screen / tablet
|
||||
@screen-sm: 768px;
|
||||
@screen-tablet: @screen-sm;
|
||||
@screen-sm: 768px;// NOTE: Deprecated in favor of @screen-sm-min
|
||||
@screen-sm-min: @screen-sm;
|
||||
@screen-tablet: @screen-sm-min;
|
||||
|
||||
// Medium screen / desktop
|
||||
@screen-md: 992px;
|
||||
@screen-desktop: @screen-md;
|
||||
@screen-md: 992px;// NOTE: Deprecated in favor of @screen-md-min
|
||||
@screen-md-min: @screen-md;
|
||||
@screen-desktop: @screen-md-min;
|
||||
|
||||
// Large screen / wide desktop
|
||||
@screen-lg: 1200px;
|
||||
@screen-lg-desktop: @screen-lg;
|
||||
@screen-lg: 1200px;// NOTE: Deprecated in favor of @screen-lg-min
|
||||
@screen-lg-min: @screen-lg;
|
||||
@screen-lg-desktop: @screen-lg-min;
|
||||
|
||||
// So media queries don't overlap when required, provide a maximum
|
||||
@screen-xs-max: (@screen-sm - 1);
|
||||
@screen-sm-max: (@screen-md - 1);
|
||||
@screen-md-max: (@screen-lg - 1);
|
||||
@screen-xs-max: (@screen-sm-min - 1);
|
||||
@screen-sm-max: (@screen-md-min - 1);
|
||||
@screen-md-max: (@screen-lg-min - 1);
|
||||
|
||||
|
||||
// Grid system
|
||||
|
|
Loading…
Reference in a new issue