1@mixin breakpoint($class) {
2 @if $class == xs {
3 @media (max-width: 767px) { @content; } }
4 @else if $class == sm {
5 @media (min-width: 768px) { @content; } }
6 @else if $class == md {
7 @media (min-width: 992px) { @content; } }
8 @else if $class == lg {
9 @media (min-width: 1200px) { @content; } }
10 @else {
11 @warn "Breakpoint mixin supports: xs, sm, md, lg";
12 }
13}