generate angular material classes version 1

generate-material-classes-v1.scss

@use '../palette';

@mixin app-primary-colors {
  $colors-map: ();

  @each $key, $value in $app-primary {
    @if $key !=contrast {
      .app-primary-#{$key} {
        color: map-get($app-primary, $key);
      }

    $map: ();
    $map: map-merge($map, ($key: $value));
    $colors-map: map-merge($colors-map, $map);
    }
  }

  :root {
    @each $key, $value in $colors-map {
      --app-primary-#{$key}: #{$value};
    }
  }
}

@mixin app-accent-colors {
  $colors-map: ();

  @each $key, $value in $app-accent {
    @if $key !=contrast {
      .app-accent-#{$key} {
        color: map-get($app-accent, $key);
      }

    $map: ();
    $map: map-merge($map, ($key: $value));
    $colors-map: map-merge($colors-map, $map);
    }
  }

  :root {
    @each $key, $value in $colors-map {
      --app-accent-#{$key}: #{$value};
    }
  }
}

@mixin app-warning-colors {
  $colors-map: ();

  @each $key, $value in $app-warning {
    @if $key !=contrast {
      .app-warning-#{$key} {
        color: map-get($app-warning, $key);
      }

    $map: ();
    $map: map-merge($map, ($key: $value));
    $colors-map: map-merge($colors-map, $map);
    }
  }

  :root {
    @each $key, $value in $colors-map {
      --app-warning-#{$key}: #{$value};
    }
  }
}


@mixin app-generate-color-classes {
  @include app-primary-colors();
  @include app-accent-colors();
  @include app-warning-colors();
}