dasig-solid/frontend/src/styles/breakpoint.sass
2025-11-24 15:42:06 +08:00

49 lines
1.3 KiB
Sass

@use '../../configs/design.site' as design
.on-desktop-only
@media only screen and (min-width: 0px) and (max-width: design.$desktop)
display: none
@media only screen and (min-width: design.$desktop)
display: block
.on-tablet-only
@media only screen and (min-width: 0px) and (max-width: design.$tablet)
display: none
@media only screen and (min-width: design.$tablet) and (max-width: design.$desktop)
display: block
@media only screen and (min-width: design.$desktop)
display: none
.on-mobile-only
@media only screen and (max-width: design.$mobile)
display: block
@media only screen and (min-width: design.$tablet)
display: none
.on-desktop-tablet-only
@media only screen and (min-width: 0px) and (max-width: design.$tablet)
display: none
@media only screen and (min-width: design.$tablet)
display: block
.on-desktop-mobile-only
@media only screen and (min-width: 0px) and (max-width: design.$mobile)
display: block
@media only screen and (min-width: design.$mobile) and (max-width: design.$desktop)
display: none
@media only screen and (min-width: design.$desktop)
display: block
.on-tablet-mobile-only
@media only screen and (min-width: 0px) and (max-width: design.$desktop)
display: block
@media only screen and (min-width: design.$desktop)
display: none