Add small-tablet breakpoint
This commit is contained in:
parent
4401756277
commit
1aebea8ba3
1 changed files with 14 additions and 1 deletions
|
|
@ -1,7 +1,10 @@
|
|||
// use with @include
|
||||
@mixin breakpoint($breakpoint) {
|
||||
$phone-width: 450px;
|
||||
$phone-height: 920px;
|
||||
$phone-height: 1280px;
|
||||
|
||||
$small-tablet-width: 750px;
|
||||
$small-tablet-height: 1024px;
|
||||
|
||||
$tablet-width: 1024px;
|
||||
$tablet-height: 1024px;
|
||||
|
|
@ -16,6 +19,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
@if $breakpoint == small-tablet {
|
||||
// prettier-ignore
|
||||
@media only screen
|
||||
and (max-width: $small-tablet-width)
|
||||
and (max-height: $small-tablet-height)
|
||||
and (-webkit-min-device-pixel-ratio: 2) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@if $breakpoint == phone {
|
||||
// prettier-ignore
|
||||
@media only screen
|
||||
|
|
|
|||
Loading…
Reference in a new issue