SvenBudak

$breakpoints: ('xs': 0, 'sm': 600px) !default;
// $breakpoints: ('xs': 0,'sm': 600px,'md': 960px,'lg': 1280px,'xl': 1920px) !default;
$spacings: 4px, 8px !default;
// $spacings: 4px, 8px, 12px, 16px, 24px, 32px, 40px, 48px, 56px, 64px !default;
$types: 'margin', 'padding';
@mixin media-min($var) {@media only screen and (min-width: $var) {@content;}}

SvenBudak

$breakpoints: ('xs': 0, 'sm': 600px) !default;
@mixin media-min($var) {@media only screen and (min-width: $var) {@content;}}
@mixin media-max($var) {@media only screen and (max-width: $var - 1px) {@content;}}
@mixin media-from-to($var1, $var2) {@media only screen and (min-width: $var1) and (max-width: $var2 - 1px) {@content;}}



$spacings: (
  'margin': (
    'shorten-class-names': false,

SvenBudak

.test {
    color:blue;
}

SvenBudak

// https://material.angular.io/cdk/layout/overview#predefined-breakpoints
$res-xs: 0 !default; // Smartphone
$res-sm: 600px !default; // Tablet
$res-md: 960px !default; // Large Tablet
$res-lg: 1280px !default; // Large Tablet and Notebooks
$res-xl: 1920px !default; // Desktop +

$breakpoints: (
  'xs': $res-xs,
  'sm': $res-sm,