Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----

@function create-media-query($min-width: null, $max-width: null, $retina: false, $dpr: 1.5, $media: 'only-screen') {
  $query: $media + ' ';
  
  @if $min-width {
    $query: $query + ' and (min-width: ' + $min-width + ')';
  }
  
  @if $max-width {
    $query: $query + ' and (max-width: ' + $max-width + ')';
  }
  
  @if $retina {
    // TODO: add min-resolution
    $query: $query + ' and (-webkit-min-device-pixel-ratio: ' + $dpr + ')';
  }

  @return $query;
};

@mixin max-width($width, $retina: false) {
  $query: create-media-query(null, $width, $retina, 2);
  
  @media #{$query} {
    @content;
  }
}

.test {
  @include max-width(1024, true) {
    width: 100%;
  }
}

SassMeister-output.css

@media only-screen and (max-width: 1024) and (-webkit-min-device-pixel-ratio: 2) {
  .test {
    width: 100%;
  }
}