diff options
author | Thomas Park <thomas@thomaspark.me> | 2013-10-30 16:13:42 -0400 |
---|---|---|
committer | Thomas Park <thomas@thomaspark.me> | 2013-10-30 16:13:42 -0400 |
commit | 48c64127b37be4a692a70cb7b38ed9744163582b (patch) | |
tree | dcf4b4b76612269a6b135c695861eca7e89a0cfa /bower_components/bootstrap/less/responsive-utilities.less | |
parent | 620e501c3d804b1dc2c7d796d7ae378db5e1a040 (diff) |
3.0.0 -> 3.0.1
Diffstat (limited to 'bower_components/bootstrap/less/responsive-utilities.less')
-rwxr-xr-x | bower_components/bootstrap/less/responsive-utilities.less | 125 |
1 files changed, 57 insertions, 68 deletions
diff --git a/bower_components/bootstrap/less/responsive-utilities.less b/bower_components/bootstrap/less/responsive-utilities.less index c756b236..df53e479 100755 --- a/bower_components/bootstrap/less/responsive-utilities.less +++ b/bower_components/bootstrap/less/responsive-utilities.less @@ -3,36 +3,25 @@ // -------------------------------------------------- -// IE10 Metro responsive -// Required for Windows 8 Metro split-screen snapping with IE10 +// IE10 in Windows (Phone) 8 // -// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/ -@-ms-viewport{ - width: device-width; -} - -// IE10 on Windows Phone 8 -// IE10 on WP8 doesn't report CSS pixels, but actual device pixels. In -// other words, say on a Lumia, you'll get 768px as the device width, -// meaning users will see the tablet styles and not phone styles. +// Support for responsive views via media queries is kind of borked in IE10, for +// Surface/desktop in split view and for Windows Phone 8. This particular fix +// must be accompanied by a snippet of JavaScript to sniff the user agent and +// apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at +// our Getting Started page for more information on this bug. // -// Alternatively you can override this with JS (see source below), but -// we won't be doing that here given our limited scope. +// For more information, see the following: // -// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ -@media screen and (max-width: 400px) { - @-ms-viewport{ - width: 320px; - } -} +// Issue: https://github.com/twbs/bootstrap/issues/10497 +// Docs: http://getbootstrap.com/getting-started/#browsers +// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/ -// Hide from screenreaders and browsers -// Credit: HTML5 Boilerplate -.hidden { - display: none !important; - visibility: hidden !important; +@-ms-viewport { + width: device-width; } + // Visibility utilities .visible-xs { @@ -41,19 +30,19 @@ .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(); - } + } } } .visible-sm { @@ -61,20 +50,20 @@ &.visible-xs { @media (max-width: @screen-xs-max) { .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(); - } + } } } .visible-md { @@ -82,20 +71,20 @@ &.visible-xs { @media (max-width: @screen-xs-max) { .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(); } } - @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(); - } + } } } .visible-lg { @@ -103,19 +92,19 @@ &.visible-xs { @media (max-width: @screen-xs-max) { .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(); - } + } } - @media (min-width: @screen-lg) { + @media (min-width: @screen-lg-min) { .responsive-visibility(); } } @@ -126,19 +115,19 @@ .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(); - } + } } } .hidden-sm { @@ -148,18 +137,18 @@ .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(); - } + } } } .hidden-md { @@ -167,20 +156,20 @@ &.hidden-xs { @media (max-width: @screen-xs-max) { .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(); - } + } } - @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(); - } + } } } .hidden-lg { @@ -188,19 +177,19 @@ &.hidden-xs { @media (max-width: @screen-xs-max) { .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(); - } + } } - @media (min-width: @screen-lg) { + @media (min-width: @screen-lg-min) { .responsive-invisibility(); } } |