Skip to content
GitLab
Commit a3a02f9e authored by Chris Rebert's avatar Chris Rebert
Browse files

rename @screen-XX to @screen-XX-min for clarity+unambiguity

parent d666a896
Hide whitespace changes
Inline Side-by-side
Showing
with 52 additions and 48 deletions
+52 -48
less/mixins.less
+ 11
- 11
View file @ a3a02f9e
...@@ -558,7 +558,7 @@ ...@@ -558,7 +558,7 @@
padding-right: (@gutter / 2); padding-right: (@gutter / 2);
// Calculate width based on number of columns available // Calculate width based on number of columns available
@media (min-width: @screen-sm) { @media (min-width: @screen-sm-min) {
float: left; float: left;
width: percentage((@columns / @grid-columns)); width: percentage((@columns / @grid-columns));
} }
...@@ -566,17 +566,17 @@ ...@@ -566,17 +566,17 @@
// Generate the small column offsets // Generate the small column offsets
.make-sm-column-offset(@columns) { .make-sm-column-offset(@columns) {
@media (min-width: @screen-sm) { @media (min-width: @screen-sm-min) {
margin-left: percentage((@columns / @grid-columns)); margin-left: percentage((@columns / @grid-columns));
} }
} }
.make-sm-column-push(@columns) { .make-sm-column-push(@columns) {
@media (min-width: @screen-sm) { @media (min-width: @screen-sm-min) {
left: percentage((@columns / @grid-columns)); left: percentage((@columns / @grid-columns));
} }
} }
.make-sm-column-pull(@columns) { .make-sm-column-pull(@columns) {
@media (min-width: @screen-sm) { @media (min-width: @screen-sm-min) {
right: percentage((@columns / @grid-columns)); right: percentage((@columns / @grid-columns));
} }
} }
...@@ -591,7 +591,7 @@ ...@@ -591,7 +591,7 @@
padding-right: (@gutter / 2); padding-right: (@gutter / 2);
// Calculate width based on number of columns available // Calculate width based on number of columns available
@media (min-width: @screen-md) { @media (min-width: @screen-md-min) {
float: left; float: left;
width: percentage((@columns / @grid-columns)); width: percentage((@columns / @grid-columns));
} }
...@@ -599,7 +599,7 @@ ...@@ -599,7 +599,7 @@
// Generate the large column offsets // Generate the large column offsets
.make-md-column-offset(@columns) { .make-md-column-offset(@columns) {
@media (min-width: @screen-md) { @media (min-width: @screen-md-min) {
margin-left: percentage((@columns / @grid-columns)); margin-left: percentage((@columns / @grid-columns));
} }
} }
...@@ -609,7 +609,7 @@ ...@@ -609,7 +609,7 @@
} }
} }
.make-md-column-pull(@columns) { .make-md-column-pull(@columns) {
@media (min-width: @screen-md) { @media (min-width: @screen-md-min) {
right: percentage((@columns / @grid-columns)); right: percentage((@columns / @grid-columns));
} }
} }
...@@ -624,7 +624,7 @@ ...@@ -624,7 +624,7 @@
padding-right: (@gutter / 2); padding-right: (@gutter / 2);
// Calculate width based on number of columns available // Calculate width based on number of columns available
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
float: left; float: left;
width: percentage((@columns / @grid-columns)); width: percentage((@columns / @grid-columns));
} }
...@@ -632,17 +632,17 @@ ...@@ -632,17 +632,17 @@
// Generate the large column offsets // Generate the large column offsets
.make-lg-column-offset(@columns) { .make-lg-column-offset(@columns) {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
margin-left: percentage((@columns / @grid-columns)); margin-left: percentage((@columns / @grid-columns));
} }
} }
.make-lg-column-push(@columns) { .make-lg-column-push(@columns) {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
left: percentage((@columns / @grid-columns)); left: percentage((@columns / @grid-columns));
} }
} }
.make-lg-column-pull(@columns) { .make-lg-column-pull(@columns) {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
right: percentage((@columns / @grid-columns)); right: percentage((@columns / @grid-columns));
} }
} }
......
less/navs.less
+ 1
- 1
View file @ a3a02f9e
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
} }
} }
@media (min-width: @screen-sm) { @media (min-width: @screen-sm-min) {
> li { > li {
display: table-cell; display: table-cell;
width: 1%; width: 1%;
......
less/responsive-utilities.less
+ 24
- 24
View file @ a3a02f9e
...@@ -41,17 +41,17 @@ ...@@ -41,17 +41,17 @@
.responsive-visibility(); .responsive-visibility();
} }
&.visible-sm { &.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(); .responsive-visibility();
} }
} }
&.visible-md { &.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(); .responsive-visibility();
} }
} }
&.visible-lg { &.visible-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-visibility(); .responsive-visibility();
} }
} }
...@@ -63,16 +63,16 @@ ...@@ -63,16 +63,16 @@
.responsive-visibility(); .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(); .responsive-visibility();
} }
&.visible-md { &.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(); .responsive-visibility();
} }
} }
&.visible-lg { &.visible-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-visibility(); .responsive-visibility();
} }
} }
...@@ -85,15 +85,15 @@ ...@@ -85,15 +85,15 @@
} }
} }
&.visible-sm { &.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(); .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(); .responsive-visibility();
} }
&.visible-lg { &.visible-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-visibility(); .responsive-visibility();
} }
} }
...@@ -106,16 +106,16 @@ ...@@ -106,16 +106,16 @@
} }
} }
&.visible-sm { &.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(); .responsive-visibility();
} }
} }
&.visible-md { &.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(); .responsive-visibility();
} }
} }
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-visibility(); .responsive-visibility();
} }
} }
...@@ -126,17 +126,17 @@ ...@@ -126,17 +126,17 @@
.responsive-invisibility(); .responsive-invisibility();
} }
&.hidden-sm { &.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(); .responsive-invisibility();
} }
} }
&.hidden-md { &.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(); .responsive-invisibility();
} }
} }
&.hidden-lg { &.hidden-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-invisibility(); .responsive-invisibility();
} }
} }
...@@ -148,16 +148,16 @@ ...@@ -148,16 +148,16 @@
.responsive-invisibility(); .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(); .responsive-invisibility();
} }
&.hidden-md { &.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(); .responsive-invisibility();
} }
} }
&.hidden-lg { &.hidden-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-invisibility(); .responsive-invisibility();
} }
} }
...@@ -170,15 +170,15 @@ ...@@ -170,15 +170,15 @@
} }
} }
&.hidden-sm { &.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(); .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(); .responsive-invisibility();
} }
&.hidden-lg { &.hidden-lg {
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-invisibility(); .responsive-invisibility();
} }
} }
...@@ -191,16 +191,16 @@ ...@@ -191,16 +191,16 @@
} }
} }
&.hidden-sm { &.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(); .responsive-invisibility();
} }
} }
&.hidden-md { &.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(); .responsive-invisibility();
} }
} }
@media (min-width: @screen-lg) { @media (min-width: @screen-lg-min) {
.responsive-invisibility(); .responsive-invisibility();
} }
} }
......
less/tables.less
+ 1
- 1
View file @ a3a02f9e
...@@ -180,7 +180,7 @@ table { ...@@ -180,7 +180,7 @@ table {
// by enabling horizontal scrolling. Only applies <768px. Everything above that // by enabling horizontal scrolling. Only applies <768px. Everything above that
// will display normally. // will display normally.
@media (max-width: @screen-sm) { @media (max-width: @screen-sm-min) {
.table-responsive { .table-responsive {
width: 100%; width: 100%;
margin-bottom: 15px; margin-bottom: 15px;
......
less/variables.less
+ 15
- 11
View file @ a3a02f9e
...@@ -200,25 +200,29 @@ ...@@ -200,25 +200,29 @@
// -------------------------------------------------- // --------------------------------------------------
// Extra small screen / phone // Extra small screen / phone
@screen-xs: 480px; @screen-xs: 480px;// NOTE: Deprecated in favor of @screen-xs-min
@screen-phone: @screen-xs; @screen-xs-min: @screen-xs;
@screen-phone: @screen-xs-min;
// Small screen / tablet // Small screen / tablet
@screen-sm: 768px; @screen-sm: 768px;// NOTE: Deprecated in favor of @screen-sm-min
@screen-tablet: @screen-sm; @screen-sm-min: @screen-sm;
@screen-tablet: @screen-sm-min;
// Medium screen / desktop // Medium screen / desktop
@screen-md: 992px; @screen-md: 992px;// NOTE: Deprecated in favor of @screen-md-min
@screen-desktop: @screen-md; @screen-md-min: @screen-md;
@screen-desktop: @screen-md-min;
// Large screen / wide desktop // Large screen / wide desktop
@screen-lg: 1200px; @screen-lg: 1200px;// NOTE: Deprecated in favor of @screen-lg-min
@screen-lg-desktop: @screen-lg; @screen-lg-min: @screen-lg;
@screen-lg-desktop: @screen-lg-min;
// So media queries don't overlap when required, provide a maximum // So media queries don't overlap when required, provide a maximum
@screen-xs-max: (@screen-sm - 1); @screen-xs-max: (@screen-sm-min - 1);
@screen-sm-max: (@screen-md - 1); @screen-sm-max: (@screen-md-min - 1);
@screen-md-max: (@screen-lg - 1); @screen-md-max: (@screen-lg-min - 1);
// Grid system // Grid system
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment