Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.2.19)
// Compass (v0.12.7)
// ----

$resolution-default: 2 !default;
$resolution-presets: (
  ldpi: 75%,
  mdpi: 100%,
  hdpi: 150%,
  xhdpi: 200%,
  xxhdpi: 300%,
  xxxhdpi: 400%,
  retina: 2,
  "@2x": 2,
  "@3x": 3
) !default;

@mixin resolution($resolution: $resolution-default) {
  @if map-has-key($resolution-presets, $resolution) {
    $resolution: map-get($resolution-presets, $resolution);
  }
  @if $resolution and type-of($resolution) == number {
    @if unit($resolution) == "dpi" {
      $resolution: $resolution / 96dpi;
    } @else if unit($resolution) == "%" {
      $resolution: $resolution / 100%;
    } @else {
      $resolution: $resolution / ($resolution * 0 + 1)
    }
    @media (-webkit-min-device-pixel-ratio: #{$resolution}), (min-resolution: #{$resolution * 96dpi}) {
      @content;
    }
  }
}

.example {
  @include resolution {
    content: "default";
  }
  @include resolution(2dppx) {
    content: "2dppx";
  }
  @include resolution(192dpi) {
    content: "192dpi";
  }
  @include resolution(1.5) {
    content: "1.5";
  }
  @include resolution(3dppx) {
    content: "3dppx";
  }
  @include resolution(2.5) {
    content: "2.5";
  }
  @include resolution(240dpi) {
    content: "240dpi";
  }
  @include resolution(retina) {
    content: "retina";
  }
  @include resolution(hdpi) {
    content: "hdpi";
  }
  @include resolution(xhdpi) {
    content: "xhdpi";
  }
  @include resolution(xxhdpi) {
    content: "xxhdpi";
  }
  @include resolution(3x) {
    content: "3x";
  }
  @include resolution("@3x") {
    content: "@3x";
  }
  @include resolution(150%) {
    content: "150%";
  }
}

SassMeister-output.css

Invalid CSS after "  ldpi": expected ")", was ": 75%,"