granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add small-tablet breakpoint

Browse source
This commit is contained in:
Justin Edmund 2023-06-30 22:53:37 -07:00
parent 4401756277
commit 1aebea8ba3
1 changed files with 14 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
styles/mixins.scss
View file

@ -1,7 +1,10 @@
// use with @include // use with @include
@mixin breakpoint($breakpoint) { @mixin breakpoint($breakpoint) {
$phone-width: 450px; $phone-width: 450px;
$phone-height: 920px; $phone-height: 1280px;
$small-tablet-width: 750px;
$small-tablet-height: 1024px;
$tablet-width: 1024px; $tablet-width: 1024px;
$tablet-height: 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 { @if $breakpoint == phone {
// prettier-ignore // prettier-ignore
@media only screen @media only screen