Single-rule mixin for generating breakpoints

SassMeister-input.scss

// ----
// Sass (v3.4.25)
// Compass (v1.0.3)
// ----

$breakpoints: (
small: 34em,
medium: 50em,
large: 70em
);

@function get-map-value-by-index($map, $index) {
  //(2)
  $i: 0;

  @each $key, $value in $map {
    $i: $i + 1;

    @if $i == $index {
      @return $value;
    }
    @else {
      //      @return $index;
    }
  }
}

@mixin prop($property, $values...) {
  $i: 0;

  @each $value in $values {
    @if $i == 0 {
      #{$property}: $value;
    }
    @else {
      @media screen and (min-width: get-map-value-by-index($breakpoints, $i)) {
        #{$property}: $value;
      }
    }

    $i: $i + 1;
  }
}

a {
  @include prop(font-size, 1.4em, 1em, 0.85em);
  @include prop(text-align, center, center, left);
  @include prop(display, block, block, inline);
  @include prop(padding, 0.4em, 0.4em, 0);
}

SassMeister-output.css

a {
  font-size: 1.4em;
  text-align: center;
  display: block;
  padding: 0.4em;
}
@media screen and (min-width: 34em) {
  a {
    font-size: 1em;
  }
}
@media screen and (min-width: 50em) {
  a {
    font-size: 0.85em;
  }
}
@media screen and (min-width: 34em) {
  a {
    text-align: center;
  }
}
@media screen and (min-width: 50em) {
  a {
    text-align: left;
  }
}
@media screen and (min-width: 34em) {
  a {
    display: block;
  }
}
@media screen and (min-width: 50em) {
  a {
    display: inline;
  }
}
@media screen and (min-width: 34em) {
  a {
    padding: 0.4em;
  }
}
@media screen and (min-width: 50em) {
  a {
    padding: 0;
  }
}