exampleSite/static/scss/partials/_layout.scss


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// breakpoints
   
$S:     480px;   
$M:     768px;     
$L:     1024px;     

// media queries

@mixin MQ($canvas) {
  @if $canvas == S {
   @media only screen and (min-width: $S) { @content; } 
  }
  @else if $canvas == M {
   @media only screen and (min-width: $M) { @content; } 
  }
  @else if $canvas == L {
   @media only screen and (min-width: $L) { @content; } 
  }
}