Generated by SassMeister.com.

browserslist

> 0.3%
last 2 versions
not dead
Chrome >= 45
Firefox >= 38
Edge >= 12
Explorer >= 11
iOS >= 9
Safari >= 9
Android >= 4.4
Opera >= 30

input.scss

.foo {
  width: max(10px, env(safe-area-inset-left));
}

@mixin foobar {
    display: flex;
}
@mixin baz {
    @include foobar;
    font-weight: 400;
}

.foo {
    color: red;
    .bar {
        color: green;
        background: red;
    }
    & .baz {
        color: gold;
    }
    .baz & {
        color: crimson;
        @include baz;
    }
}

$foo: foobar;

a {
    color: $foo;
}

output.css

.foo {
  width: max(10px, env(safe-area-inset-left));
}

.foo {
  color: red;
}
.foo .bar {
  color: green;
  background: red;
}
.foo .baz {
  color: gold;
}
.baz .foo {
  color: crimson;
  display: flex;
  font-weight: 400;
}

a {
  color: foobar;
}

settings.json

{
  "sass": {
    "compiler": "dart-sass/1.26.11",
    "extensions": {},
    "syntax": "SCSS",
    "outputStyle": "expanded"
  },
  "autoprefixer": true
}