Contents

@function breakpoint-infix($name) {
  @return if(breakpoint-min($name) == null, '', '-#{$name}');
}

@function breakpoint-max($name) {
  $next: breakpoint-next($name);

  @return if($next, breakpoint-min($next) - 0.02px, null);
}

@function breakpoint-min($name) {
  $min: map-get($grid-breakpoints, $name);

  @return if($min != 0, $min, null);
}

@function breakpoint-next($name) {
  $map: map-keys($grid-breakpoints);
  $n: index($map, $name);

  @return if($n < length($map), nth($map, $n + 1), null);
}

@mixin media-breakpoint-down($name) {
  $max: breakpoint-max($name);

  @if $max {
    @media (max-width: $max) {
      @content;
    }
  } @else {
    @content;
  }
}

@mixin media-breakpoint-up($name) {
  $min: breakpoint-min($name);

  @if $min {
    @media (min-width: $min) {
      @content;
    }
  } @else {
    @content;
  }
}

// Additional mixins

@mixin media-breakpoint-between($lower, $upper) {
  $max: breakpoint-max($upper);
  $min: breakpoint-min($lower);

  @media (min-width: $min) and (max-width: $max) {
    @content;
  }
}

@mixin media-breakpoint-only($name) {
  $max: breakpoint-max($name);
  $min: breakpoint-min($name);

  @media (min-width: $min) and (max-width: $max) {
    @content;
  }
}

@mixin media-moz-webkit {
  @-moz-document url-prefix('') {
    @content;
  }

  // stylelint-disable-next-line media-feature-name-no-vendor-prefix
  @media (-webkit-min-device-pixel-ratio: 0) {
    @content;
  }
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
material-sass-4.0.0.beta3	assets/stylesheets/material/mixins/_breakpoint.scss