_layout.scss 567 B

123456789101112131415161718192021222324252627
  1. // breakpoints
  2. $S: 480px;
  3. $M: 768px;
  4. $L: 1100px;
  5. // media queries
  6. @mixin MQ($canvas) {
  7. @if $canvas == S {
  8. @media only screen and (min-width: $S) { @content; }
  9. }
  10. @else if $canvas == M {
  11. @media only screen and (min-width: $M) { @content; }
  12. }
  13. @else if $canvas == L {
  14. @media only screen and (min-width: $L) { @content; }
  15. }
  16. }
  17. // super light grid - it works with the .cd-container class inside style.scss
  18. @mixin column($percentage, $float-direction:left) {
  19. width: 100% * $percentage;
  20. float: $float-direction;
  21. }