From: Chris Rebert Date: Wed, 21 Aug 2013 00:31:02 +0000 (-0700) Subject: rename @screen-XX to @screen-XX-min for clarity+unambiguity X-Git-Tag: v3.0.1~146^2 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=a3a02f9e6e0d1cb76a0214388c40df971f70a037;p=thirdparty%2Fbootstrap.git rename @screen-XX to @screen-XX-min for clarity+unambiguity --- diff --git a/less/mixins.less b/less/mixins.less index 3f230205b6..e78878b4d2 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -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)); } } diff --git a/less/navs.less b/less/navs.less index 6002a8cdd1..868aeb817c 100644 --- a/less/navs.less +++ b/less/navs.less @@ -162,7 +162,7 @@ } } - @media (min-width: @screen-sm) { + @media (min-width: @screen-sm-min) { > li { display: table-cell; width: 1%; diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index 4976e2fcd9..02bb39bfbb 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -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(); } } diff --git a/less/tables.less b/less/tables.less index 7543b165a2..5b6ea44d90 100644 --- a/less/tables.less +++ b/less/tables.less @@ -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; diff --git a/less/variables.less b/less/variables.less index fa623e283e..63cc86ca62 100644 --- a/less/variables.less +++ b/less/variables.less @@ -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