decePubClient/SCSS/mixins.scss

59 lines
1.0 KiB
SCSS
Raw Normal View History

2022-02-14 01:51:37 +01:00
//MEDIA QUERY MANAGER
/*$breakpoint argument choices:
- phone
- tab-port
- tab-land
- desk
- big-desktop
*/
@mixin MediaQuery($breakpoint) {
// max-width:768px;
@if $breakpoint==phone {
@media screen and (max-width: 768px) {
@content
}
}
@if $breakpoint==tab-p {
// min-width:768px;
// max-width:900px;
@media screen and (min-width: 768px) and (max-width: 900px) {
@content
}
}
@if $breakpoint==tab-l {
// min-width:901px;
// max-width:1200px;
@media screen and (min-width: 901px) and (max-width: 1200px) {
@content
}
}
@if $breakpoint==laptop {
// min-width:1201px;
// max-width:1366px;
@media screen and (min-width: 1201px) and (max-width: 1366px) {
@content
}
}
@if $breakpoint==desk {
// min-width:1201px;
// max-width:1800px;
@media screen and (min-width: 1201px) and (max-width: 1800px) {
@content
}
}
@if $breakpoint==big-d {
// min-width:1801px;
// max-width:4000px;
@media screen and (min-width: 1801px) and (max-width: 4000px) {
@content
}
}
}