diff --git a/less/_carousel.less b/less/_carousel.less index 19313ed6ab..a00d289df6 100644 --- a/less/_carousel.less +++ b/less/_carousel.less @@ -219,8 +219,7 @@ // Scale up controls for tablets and up -@media screen and (min-width: @screen-sm-min) { - +.media-sm({ // Scale up the controls a smidge .carousel-control { .icon-prev, @@ -249,4 +248,4 @@ .carousel-indicators { bottom: 20px; } -} +}); diff --git a/less/_dropdown.less b/less/_dropdown.less index 6ccd7566ce..a4bd721e40 100644 --- a/less/_dropdown.less +++ b/less/_dropdown.less @@ -192,7 +192,7 @@ // // Reiterate per navbar.less and the modified component alignment there. -@media (min-width: @grid-float-breakpoint) { +.media-sm({ .navbar-right { .dropdown-menu { .dropdown-menu-right(); @@ -203,4 +203,4 @@ .dropdown-menu-left(); } } -} +}); diff --git a/less/_forms.less b/less/_forms.less index 8a9ba01e1b..3022165562 100644 --- a/less/_forms.less +++ b/less/_forms.less @@ -424,7 +424,7 @@ input[type="checkbox"] { .form-inline { // Kick in the inline - @media (min-width: @screen-sm-min) { + .media-sm({ // Inline-block all the things for "inline" .form-group { display: inline-block; @@ -489,7 +489,7 @@ input[type="checkbox"] { .has-feedback .form-control-feedback { top: 0; } - } + }); } @@ -525,13 +525,13 @@ input[type="checkbox"] { // Reset spacing and right align labels, but scope to media queries so that // labels on narrow viewports stack the same as a default form example. - @media (min-width: @screen-sm-min) { + .media-sm({ .control-label { text-align: right; margin-bottom: 0; padding-top: (@padding-base-vertical + 1); // Default padding plus a border } - } + }); // Validation states // diff --git a/less/_grid.less b/less/_grid.less index 9957a44af8..28dbb9f970 100644 --- a/less/_grid.less +++ b/less/_grid.less @@ -61,24 +61,24 @@ // Columns, offsets, pushes, and pulls for the small device range, from phones // to tablets. -@media (min-width: @screen-sm-min) { +.media-sm({ .make-grid(sm); -} +}); // Medium grid // // Columns, offsets, pushes, and pulls for the desktop device range. -@media (min-width: @screen-md-min) { +.media-md({ .make-grid(md); -} +}); // Large grid // // Columns, offsets, pushes, and pulls for the large desktop device range. -@media (min-width: @screen-lg-min) { +.media-lg({ .make-grid(lg); -} +}); diff --git a/less/_jumbotron.less b/less/_jumbotron.less index 840de26596..c59690550d 100644 --- a/less/_jumbotron.less +++ b/less/_jumbotron.less @@ -27,7 +27,7 @@ border-top-color: darken(@jumbotron-bg, 10%); } -@media (min-width: @screen-sm-min) { +.media-sm({ .jumbotron { padding: (@jumbotron-padding * 1.6) 0; @@ -41,4 +41,4 @@ .jumbotron-heading { font-size: (@font-size-base * 4.5); } -} +}); diff --git a/less/_modal.less b/less/_modal.less index 09cef4b31f..539d0fef2a 100644 --- a/less/_modal.less +++ b/less/_modal.less @@ -130,7 +130,7 @@ } // Scale up the modal -@media (min-width: @screen-sm-min) { +.media-sm({ // Automatically set modal's width for larger viewports .modal-dialog { width: @modal-md; @@ -142,8 +142,8 @@ // Modal sizes .modal-sm { width: @modal-sm; } -} +}); -@media (min-width: @screen-md-min) { +.media-sm({ .modal-lg { width: @modal-lg; } -} +});