Files
SCSS-Framework/mixins/queries/_01-mixins-media-queries.scss
T
2017-02-17 10:24:32 +01:00

46 lines
544 B
SCSS

/*
Widths
*/
$phone-width: 480px;
$tablet-width: 768px;
$notebook-width: 1024px;
$desktop-width: 1280px;
/*
Queries
*/
@mixin phone {
@media(max-width: $tablet-width) {
@content
}
}
@mixin tablet {
@media /*(min-width: $tablet-width) and*/
(max-width: $notebook-width) {
@content
}
}
@mixin notebook {
@media(min-width: $notebook-width) and (max-width: $desktop-width) {
@content
}
}
@mixin desktop {
@media(min-width: $desktop-width) {
@content
}
}
@mixin print {
@media print {
@content
}
}