gistfile1.txt

@mixin bp($point, $high:'', $low:'') {

  /* XS */
  $mobile-max: 767;
  $mobile-min: 1;
  @if $point == xs {
    @if $high != '' {
      $mobile-max: $high;
    }
    @if $low != '' {
      $mobile-min: $low;
    }
  }

  /* SM */
  $portrait-min: 768;
  $portrait-max: 991;

  @if $point == sm {
    @if $high != '' {
      $portrait-max: $high;
    }
    @if $low != '' {
      $portrait-min: $low;
    }
  }

  /* MD */
  $tablet-min: 992;
  $tablet-max: 1200;

  @if $point == md {
    @if $high != '' {
      $tablet-max: $high;
    }
    @if $low != '' {
      $tablet-min: $low;
    }
  }

  /* LG */
  $desktop-min: 1200;

  @if $point == lg {
    @if $low != '' {
      $desktop-min: $low;
    }
  }


  $mobile: "(min-width: #{$mobile-min}px) and (max-width: #{$mobile-max}px)";

  $portrait: "(min-width: #{$portrait-min}px) and (max-width: #{$portrait-max}px)";

  $tablet: "(min-width: #{$tablet-min}px) and (max-width: #{$tablet-max}px)";

  $desktop: "(min-width: #{$desktop-min}px)";

  @if $point == xs {
    @media #{$mobile} { @content; }
  }
  @else if $point == md {
    @media #{$tablet} { @content; }
  }
  @else if $point == sm {
    @media #{$portrait} { @content; }
  }
  @else if $point == lg {
    @media #{$desktop}  { @content; }
  }

}