1
0
mirror of https://github.com/moparisthebest/mail synced 2024-08-13 16:43:47 -04:00
mail/src/sass/_responsive.scss
Tankred Hase b20ab9790c refactor files for transform transition for mobile
use prototypical inheritance by invoking parent functions in child scopes
2013-10-27 13:03:13 +01:00

34 lines
1.1 KiB
SCSS
Executable File

// Central Media Query Helper
// -------------------------
@mixin respond-to($media) {
@if $media == mobile {
@media only screen and (max-width: $respond-size-desktop - 1) { @content; }
}
@else if $media == desktop {
@media only screen and (min-width: $respond-size-desktop) { @content; }
}
@else if $media == retina {
@media all and (-webkit-min-device-pixel-ratio : 1.5),
all and (-o-min-device-pixel-ratio: 3/2),
all and (min--moz-device-pixel-ratio: 1.5),
all and (min-device-pixel-ratio: 1.5) {
@content
}
}
}
// Visibility classes (mobile first approach)
// -------------------------
.visible-phone { display: inherit !important; }
.hidden-phone { display: none !important; }
.visible-desktop { display: none !important; }
.hidden-desktop { display: inherit !important; }
@include respond-to(desktop) {
.visible-desktop { display: inherit !important; }
.hidden-desktop { display: none !important; }
.visible-phone { display: none !important; }
.hidden-phone { display: inherit !important; }
}