/** Mixins */

$break-small: 35.5rem; // >= 568px @ 16px
$break-medium: 48rem; // >= 768px @ 16px
$break-large: 64rem; // >= 1024px @ 16px
$break-extra-large: 80rem; // >= 1280px @ 16px
$break-largest: 90rem; // >= 1440px @ 16px

// @include respond-to( );
@mixin respond-to( $condition ) {
  @if $condition == 'initialize' { @media only screen and (min-width: 1px) { @content; } }

  @if $condition == 'small' { @media only screen and (min-width: $break-small) { @content; } }

  @if $condition == 'medium' { @media only screen and (min-width: $break-medium) { @content; } }

  @if $condition == 'large' { @media only screen and (min-width: $break-large) { @content; } }

  @if $condition == 'extra-large' { @media only screen and (min-width: $break-extra-large) { @content; } }

  @if $condition == 'largest' { @media only screen and (min-width: $break-largest) { @content; } }
}

// Text shadow
@mixin ts($tsval: 0 1px 0 #fff) {
  text-shadow: $tsval;
}

// Box shadow
@mixin bs($bsval: 0 0 0.83em #333, $due: 0 0 0 transparent) {
  -moz-box-shadow: $bsval, $due;
  -webkit-box-shadow: $bsval, $due;
  -o-box-shadow: $bsval, $due;
  box-shadow: $bsval, $due;
}

// Opacity
@mixin opacity($opacity) {
  opacity: $opacity;
  -moz-opacity: $opacity;
}

// Transitions
@mixin transition($transition: all linear 0.2s) {
  -webkit-transition: $transition;
  -moz-transition: $transition;
  -o-transition: $transition;
  -ms-transition: $transition;
  transition: $transition;
}

// Transforms
@mixin transform($transform: translate3d(0, 0, 0)) {
  -webkit-transform: $transform;
  -moz-transform: $transform;
  -ms-transform: $transform;
  -o-transform: $transform;
  transform: $transform;
}

@mixin animation($animate...) {
  $max: length($animate);
  $animations: '';

  @for $i from 1 through $max {
    $animations: #{$animations + nth($animate, $i)};

    @if $i < $max {
      $animations: #{$animations + ", "};
    }
  }

  -webkit-animation: $animations;
  -moz-animation: $animations;
  -o-animation: $animations;
  animation: $animations;
}

@mixin keyframes($animationName) {
  @-webkit-keyframes #{$animationName} {
    @content;
  }

  @-moz-keyframes #{$animationName} {
    @content;
  }

  @-o-keyframes #{$animationName} {
    @content;
  }

  @keyframes #{$animationName} {
    @content;
  }
}

@mixin strip($lines: 1, $font-size: 16px, $line-height: 1.3, $width: 100%) {
  display: block;
  width: $width;
  min-height: ($font-size*$line-height*$lines) + 2;
  max-height: ($font-size*$line-height*$lines) + 2; /* Fallback for non-webkit */
  font-size: $font-size;
  line-height: $line-height;
  white-space: nowrap;
  -webkit-line-clamp: $lines;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

@function strip-unit($num) {
  @return $num / ($num * 0 + 1);
}

// Utilities
// -------------------------

// Clearfix
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
//    contenteditable attribute is included anywhere else in the document.
//    Otherwise it causes space to appear at the top and bottom of elements
//    that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
//    `:before` to contain the top-margins of child elements.
@mixin clearfix() {
  zoom: 1;

  &::before,
  &::after {
    content: " "; /* 1 */
    display: table; /* 2 */
  }

  &::after {
    clear: both;
  }
}

