Generated by SassMeister.com.

input.scss

$left-width-initial: 95px;
$left-width-sm-up: 110px;
$left-width-lg-up: 123px;

$image-ml: 16px;

$image-path: "test/";
$icon: test;
$selector: "";

@mixin icon($icon, $image-path: $image-path) {
    &:before {
        content: url("#{$image-path}icons/#{$icon}.svg")
    }
}

@mixin icon2($icon, $selector: $selector, $image-path: $image-path) {
    #{$selector}:before {
        content: url("#{$image-path}icons/#{$icon}.svg")
    }
}

.test {
    padding-left: $image-ml + $left-width-sm-up;
    @include icon($icon);
}

.test2 {
    $icon: test2;
    @include icon($icon);
    
}

// ===========================

.test3 {
    $selector: ".hgroup [itemprop='headline'], .hgroup .headline";
    
    &[class*="media-gallery"], &[class*="media-imagegallery"] {
        @include icon2("gallery-24px", $selector);
    }

}

.test4 {
    $selector: ".hgroup a";
    
    &[class*="media-gallery"], &[class*="media-imagegallery"] {
        @include icon2("gallery-24px", $selector);
    }

}

output.css

.test {
  padding-left: 126px;
}
.test:before {
  content: url("test/icons/test.svg");
}

.test2:before {
  content: url("test/icons/test2.svg");
}

.test3[class*=media-gallery] .hgroup [itemprop=headline], .test3[class*=media-gallery] .hgroup .headline:before, .test3[class*=media-imagegallery] .hgroup [itemprop=headline], .test3[class*=media-imagegallery] .hgroup .headline:before {
  content: url("test/icons/gallery-24px.svg");
}

.test4[class*=media-gallery] .hgroup a:before, .test4[class*=media-imagegallery] .hgroup a:before {
  content: url("test/icons/gallery-24px.svg");
}

settings.json

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