28 lines
622 B
SCSS
28 lines
622 B
SCSS
// use with @include
|
|
@mixin breakpoint($breakpoint) {
|
|
$phone-width: 430px;
|
|
$phone-height: 850px;
|
|
|
|
$tablet-width: 1024px;
|
|
$tablet-height: 1024px;
|
|
|
|
@if $breakpoint == tablet {
|
|
// prettier-ignore
|
|
@media only screen
|
|
and (max-width: $tablet-width)
|
|
and (max-height: $tablet-height)
|
|
and (-webkit-min-device-pixel-ratio: 2) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@if $breakpoint == phone {
|
|
// prettier-ignore
|
|
@media only screen
|
|
and (max-width: $phone-width)
|
|
and (max-height: $phone-height)
|
|
and (-webkit-min-device-pixel-ratio: 2) {
|
|
@content;
|
|
}
|
|
}
|
|
}
|