Some Foundation 5 Mixins

foundation-5-mixins.scss

/*! Source: http://foundation.zurb.com/forum/posts/850-foundation-5-and-mixins @ Alexander Assimidis */
@mixin image-2x($image, $width, $height) {
  @media (min--moz-device-pixel-ratio: 1.3),
         (-o-min-device-pixel-ratio: 2.6/2),
         (-webkit-min-device-pixel-ratio: 1.3),
         (min-device-pixel-ratio: 1.3),
         (min-resolution: 1.3dppx) {
    background-image: url($image);
    background-size: $width $height;
  }
}
@mixin breakpoint($point) {
  @if $point == small-only {
    @media #{$screen} and (max-width: #{upper-bound($small-range)})  { @content; }
  }
    @else if $point == medium-up {
    @media #{$screen} and (min-width: #{lower-bound($medium-range)}) { @content; }
  }
    @else if $point == medium-only {
    @media #{$screen} and (min-width: #{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})  { @content; }
  }
    @else if $point == large-up {
    @media #{$screen} and (min-width:#{lower-bound($large-range)})  { @content; }
  }
    @else if $point == large-only {
    @media #{$screen} and (min-width: #{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})  { @content; }
  }
    @else if $point == xlarge-up {
    @media #{$screen} and (min-width: #{lower-bound($xlarge-range)})  { @content; }
  }
    @else if $point == xlarge-only {
    @media #{$screen} and (min-width: #{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})  { @content; }
  }
    @else if $point == xxlarge-up {
    @media #{$screen} and (min-width:#{lower-bound($xxlarge-range)})  { @content; }
  }
    @else if $point == xxlarge-only {
    @media #{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})  { @content; }
  }
}
@mixin border-radius($radius) {
  -webkit-border-radius: $radius / $rem-base + rem;
     -moz-border-radius: $radius / $rem-base + rem;
      -ms-border-radius: $radius / $rem-base + rem;
       -o-border-radius: $radius / $rem-base + rem;
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
       -o-border-radius: $radius;
          border-radius: $radius / $rem-base + rem; 
          border-radius: $radius;
}
@mixin clearfix() {
    &:before,
    &:after {
        content: "";
        display: table;
    }
    &:after {
        clear: both;
    }
}
@mixin opacity($opacity) {
  opacity: $opacity;
  $opacity-ie: $opacity * 100;
  filter: alpha(opacity=$opacity-ie); //IE8
}
@mixin animation($animateText..) {
    $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;
    }
}