Skip to content

_breakpoint.scss

abstracts/_breakpoints.scss
// BREAKPOINTS
// max-width entspricht ≤
// min-width entspricht ≥
// max-width + 0.0625rem = max-width + 1px
// Media query:
// el1: max-width: $breakpoint-mobile-menu; (≤ 1024px)
// el2: min-width: $breakpoint-mobile-menu + 0.0625rem; (≥ 1024px + 1px)
// el1: width <= $breakpoint-mobile-menu;
// el2: width > $breakpoint-mobile-menu;
$breakpoint-mobile-menu: 62em; // entspricht 992px
// TWEAKPOINTS
$tweakpoint-53: 53em; // entspricht 848px
$tweakpoint-tablet: 48em; // entspricht 768px
$tweakpoint-40: 40em; // entspricht 640px
$tweakpoint-30: 30em; // entspricht 480px