matcha-theme 19.56.0 → 19.58.0

package/abstracts/_colors.scss

@@ -134,66 +134,37 @@ $index: 0;
 // @ Dynamic color classes generator
 // -------------------------------------------------------------------------------------------------------------------
 @mixin colors-classes-dynamic($theme) {
+    $accent: map-get($theme, accent);
+    $warn: map-get($theme, warn);
+    $primary: map-get($theme, primary);
     $background: map-get($theme, background);
     $foreground: map-get($theme, foreground);
 
-    $is-dark: map-get($theme, is-dark);
-    $get-shade: if($is-dark, 100, 500); // Define $red-shade com base no valor de $is-dark
-
-    // colors from theme
-    $primary: map-get($theme, primary);
-    $primary-contrast: map-get($primary, 'contrast');
-    $accent: map-get($theme, accent);
-    $accent-contrast: map-get($accent, 'contrast');
-    $warn: map-get($theme, warn);
-    $warn-contrast: map-get($warn, 'contrast');
-
-    // colors from base palette
-    $palettes: getBaseColorsPalettes();
-
-    $red-palette: map-get($palettes, red);
-    $red-contrast-palette: map-get($red-palette, 'contrast');
-    $red-color: map-get($red-palette, $get-shade);
-    $red-color-alpha: rgba($red-color, 0.2);
-    $red-contrast: map-get($red-contrast-palette, $get-shade);
-    $red-contrast-alpha: rgba($red-contrast, 0.2);
-
-    $pink: map-get($palettes, pink);
-    $pink-contrast: map-get($pink, 'contrast');
-    $purple: map-get($palettes, purple);
-    $purple-contrast: map-get($purple, 'contrast');
-    $deep-purple: map-get($palettes, deep-purple);
-    $deep-purple-contrast: map-get($deep-purple, 'contrast');
-    $indigo: map-get($palettes, indigo);
-    $indigo-contrast: map-get($indigo, 'contrast');
-    $blue: map-get($palettes, blue);
-    $blue-contrast: map-get($blue, 'contrast');
-    $light-blue: map-get($palettes, light-blue);
-    $light-blue-contrast: map-get($light-blue, 'contrast');
-    $cyan: map-get($palettes, cyan);
-    $cyan-contrast: map-get($cyan, 'contrast');
-    $teal: map-get($palettes, teal);
-    $teal-contrast: map-get($teal, 'contrast');
-    $green: map-get($palettes, green);
-    $green-contrast: map-get($green, 'contrast');
-    $light-green: map-get($palettes, light-green);
-    $light-green-contrast: map-get($light-green, 'contrast');
-    $lime: map-get($palettes, lime);
-    $lime-contrast: map-get($lime, 'contrast');
-    $yellow: map-get($palettes, yellow);
-    $yellow-contrast: map-get($yellow, 'contrast');
-    $amber: map-get($palettes, amber);
-    $amber-contrast: map-get($amber, 'contrast');
-    $orange: map-get($palettes, orange);
-    $orange-contrast: map-get($orange, 'contrast');
-    $deep-orange: map-get($palettes, deep-orange);
-    $deep-orange-contrast: map-get($deep-orange, 'contrast');
-    $brown: map-get($palettes, brown);
-    $brown-contrast: map-get($brown, 'contrast');
-    $grey: map-get($palettes, grey);
-    $grey-contrast: map-get($grey, 'contrast');
-    $blue-grey: map-get($palettes, blue-grey);
-    $blue-grey-contrast: map-get($blue-grey, 'contrast');
+    $color-functions: (
+        red: getRed,
+        pink: getPink,
+        purple: getPurple,
+        deep-purple: getDeepPurple,
+        indigo: getIndigo,
+        blue: getBlue,
+        light-blue: getLightBlue,
+        cyan: getCyan,
+        teal: getTeal,
+        green: getGreen,
+        light-green: getLightGreen,
+        lime: getLime,
+        yellow: getYellow,
+        amber: getAmber,
+        orange: getOrange,
+        deep-orange: getDeepOrange,
+        brown: getBrown,
+        grey: getGrey,
+        blue-grey: getBlueGrey,
+        primary: getPrimary,
+        accent: getAccent,
+        warn: getWarn,
+        disabled: getDisabled,
+    );
 
     @include colors-classes-static($theme);
 
@@ -203,361 +174,23 @@ $index: 0;
             background: map-get($foreground, text );
         }
     }
-
-    .background-red-alpha {background: getRedAlpha($theme)}
-    .red .ripple{background: getRedAlpha($theme)}
-    .background-red{background: getRed($theme)}
-    .border-color-red{border-color: getRed($theme)}
-    .color-red{color: getRed($theme)!important}
-    .fill-red{fill: getRed($theme)}
-    .stroke-red{stroke: getRed($theme)}
-    .color-red-alpha{color: getRedAlpha($theme)!important}
-    .red-alpha{
-        background: getRedAlpha($theme);
-        color: getRedContrast($theme);
-    }
-    .red{
-        background: getRed($theme);
-        color: getRedContrast($theme);
-    }
-    .background-pink-alpha {background: getPinkAlpha($theme)}
-    .pink .ripple{background: getPinkAlpha($theme)}
-    .background-pink{background: getPink($theme)}
-    .border-color-pink{border-color: getPink($theme)}
-    .color-pink{color: getPink($theme)!important}
-    .fill-pink{fill: getPink($theme)}
-    .stroke-pink{stroke: getPink($theme)}
-    .color-pink-alpha{color: getPinkAlpha($theme)!important}
-    .pink-alpha{
-        background: getPinkAlpha($theme);
-        color: getPinkContrast($theme);
-    }
-    .pink{
-        background: getPink($theme);
-        color: getPinkContrast($theme);
-    }
-    .background-purple-alpha {background: getPurpleAlpha($theme)}
-    .purple .ripple{background: getPurpleAlpha($theme)}
-    .background-purple{background: getPurple($theme)}
-    .border-color-purple{border-color: getPurple($theme)}
-    .color-purple{color: getPurple($theme)!important}
-    .fill-purple{fill: getPurple($theme)}
-    .stroke-purple{stroke: getPurple($theme)}
-    .color-purple-alpha{color: getPurpleAlpha($theme)!important}
-    .purple-alpha{
-        background: getPurpleAlpha($theme);
-        color: getPurpleContrast($theme);
-    }
-    .purple{
-        background: getPurple($theme);
-        color: getPurpleContrast($theme);
-    }
-    .background-deep-purple-alpha {background: getDeepPurpleAlpha($theme)}
-    .deep-purple .ripple{background: getDeepPurpleAlpha($theme)}
-    .background-deep-purple{background: getDeepPurple($theme)}
-    .border-color-deep-purple{border-color: getDeepPurple($theme)}
-    .color-deep-purple{color: getDeepPurple($theme)!important}
-    .fill-deep-purple{fill: getDeepPurple($theme)}
-    .stroke-deep-purple{stroke: getDeepPurple($theme)}
-    .color-deep-purple-alpha{color: getDeepPurpleAlpha($theme)!important}
-    .deep-purple-alpha{
-        background: getDeepPurpleAlpha($theme);
-        color: getDeepPurpleContrast($theme);
-    }
-    .deep-purple{
-        background: getDeepPurple($theme);
-        color: getDeepPurpleContrast($theme);
-    }
-    .background-indigo-alpha {background: getIndigoAlpha($theme)}
-    .indigo .ripple{background: getIndigoAlpha($theme)}
-    .background-indigo{background: getIndigo($theme)}
-    .border-color-indigo{border-color: getIndigo($theme)}
-    .color-indigo{color: getIndigo($theme)!important}
-    .fill-indigo{fill: getIndigo($theme)}
-    .stroke-indigo{stroke: getIndigo($theme)}
-    .color-indigo-alpha{color: getIndigoAlpha($theme)!important}
-    .indigo-alpha{
-        background: getIndigoAlpha($theme);
-        color: getIndigoContrast($theme);
-    }
-    .indigo{
-        background: getIndigo($theme);
-        color: getIndigoContrast($theme);
-    }
-    .background-blue-alpha {background: getBlueAlpha($theme)}
-    .blue .ripple{background: getBlueAlpha($theme)}
-    .background-blue{background: getBlue($theme)}
-    .border-color-blue{border-color: getBlue($theme)}
-    .color-blue{color: getBlue($theme)!important}
-    .fill-blue{fill: getBlue($theme)}
-    .stroke-blue{stroke: getBlue($theme)}
-    .color-blue-alpha{color: getBlueAlpha($theme)!important}
-    .blue-alpha{
-        background: getBlueAlpha($theme);
-        color: getBlueContrast($theme);
-    }
-    .blue{
-        background: getBlue($theme);
-        color: getBlueContrast($theme);
-    }
-    .background-light-blue-alpha {background: getLightBlueAlpha($theme)}
-    .light-blue .ripple{background: getLightBlueAlpha($theme)}
-    .background-light-blue{background: getLightBlue($theme)}
-    .border-color-light-blue{border-color: getLightBlue($theme)}
-    .color-light-blue{color: getLightBlue($theme)!important}
-    .fill-light-blue{fill: getLightBlue($theme)}
-    .stroke-light-blue{stroke: getLightBlue($theme)}
-    .color-light-blue-alpha{color: getLightBlueAlpha($theme)!important}
-    .light-blue-alpha{
-        background: getLightBlueAlpha($theme);
-        color: getLightBlueContrast($theme);
-    }
-    .light-blue{
-        background: getLightBlue($theme);
-        color: getLightBlueContrast($theme);
-    }
-    .background-cyan-alpha {background: getCyanAlpha($theme)}
-    .cyan .ripple{background: getCyanAlpha($theme)}
-    .background-cyan{background: getCyan($theme)}
-    .border-color-cyan{border-color: getCyan($theme)}
-    .color-cyan{color: getCyan($theme)!important}
-    .fill-cyan{fill: getCyan($theme)}
-    .stroke-cyan{stroke: getCyan($theme)}
-    .color-cyan-alpha{color: getCyanAlpha($theme)!important}
-    .cyan-alpha{
-        background: getCyanAlpha($theme);
-        color: getCyanContrast($theme);
-    }
-    .cyan{
-        background: getCyan($theme);
-        color: getCyanContrast($theme);
-    }
-    .background-teal-alpha {background: getTealAlpha($theme)}
-    .teal .ripple{background: getTealAlpha($theme)}
-    .background-teal{background: getTeal($theme)}
-    .border-color-teal{border-color: getTeal($theme)}
-    .color-teal{color: getTeal($theme)!important}
-    .fill-teal{fill: getTeal($theme)}
-    .stroke-teal{stroke: getTeal($theme)}
-    .color-teal-alpha{color: getTealAlpha($theme)!important}
-    .teal-alpha{
-        background: getTealAlpha($theme);
-        color: getTealContrast($theme);
-    }
-    .teal{
-        background: getTeal($theme);
-        color: getTealContrast($theme);
-    }
-    .background-green-alpha {background: getGreenAlpha($theme)}
-    .green .ripple{background: getGreenAlpha($theme)}
-    .background-green{background: getGreen($theme)}
-    .border-color-green{border-color: getGreen($theme)}
-    .color-green{color: getGreen($theme)!important}
-    .fill-green{fill: getGreen($theme)}
-    .stroke-green{stroke: getGreen($theme)}
-    .color-green-alpha{color: getGreenAlpha($theme)!important}
-    .green-alpha{
-        background: getGreenAlpha($theme);
-        color: getGreenContrast($theme);
-    }
-    .green{
-        background: getGreen($theme);
-        color: getGreenContrast($theme);
-    }
-    .background-light-green-alpha {background: getLightGreenAlpha($theme)}
-    .light-green .ripple{background: getLightGreenAlpha($theme)}
-    .background-light-green{background: getLightGreen($theme)}
-    .border-color-light-green{border-color: getLightGreen($theme)}
-    .color-light-green{color: getLightGreen($theme)!important}
-    .fill-light-green{fill: getLightGreen($theme)}
-    .stroke-light-green{stroke: getLightGreen($theme)}
-    .color-light-green-alpha{color: getLightGreenAlpha($theme)!important}
-    .light-green-alpha{
-        background: getLightGreenAlpha($theme);
-        color: getLightGreenContrast($theme);
-    }
-    .light-green{
-        background: getLightGreen($theme);
-        color: getLightGreenContrast($theme);
-    }
-    .background-lime-alpha {background: getLimeAlpha($theme)}
-    .lime .ripple{background: getLimeAlpha($theme)}
-    .background-lime{background: getLime($theme)}
-    .border-color-lime{border-color: getLime($theme)}
-    .color-lime{color: getLime($theme)!important}
-    .fill-lime{fill: getLime($theme)}
-    .stroke-lime{stroke: getLime($theme)}
-    .color-lime-alpha{color: getLimeAlpha($theme)!important}
-    .lime-alpha{
-        background: getLimeAlpha($theme);
-        color: getLimeContrast($theme);
-    }
-    .lime{
-        background: getLime($theme);
-        color: getLimeContrast($theme);
-    }
-    .background-yellow-alpha {background: getYellowAlpha($theme)}
-    .yellow .ripple{background: getYellowAlpha($theme)}
-    .background-yellow{background: getYellow($theme)}
-    .border-color-yellow{border-color: getYellow($theme)}
-    .color-yellow{color: getYellow($theme)!important}
-    .fill-yellow{fill: getYellow($theme)}
-    .stroke-yellow{stroke: getYellow($theme)}
-    .color-yellow-alpha{color: getYellowAlpha($theme)!important}
-    .yellow-alpha{
-        background: getYellowAlpha($theme);
-        color: getYellowContrast($theme);
-    }
-    .yellow{
-        background: getYellow($theme);
-        color: getYellowContrast($theme);
-    }
-    .background-amber-alpha {background: getAmberAlpha($theme)}
-    .amber .ripple{background: getAmberAlpha($theme)}
-    .background-amber{background: getAmber($theme)}
-    .border-color-amber{border-color: getAmber($theme)}
-    .color-amber{color: getAmber($theme)!important}
-    .fill-amber{fill: getAmber($theme)}
-    .stroke-amber{stroke: getAmber($theme)}
-    .color-amber-alpha{color: getAmberAlpha($theme)!important}
-    .amber-alpha{
-        background: getAmberAlpha($theme);
-        color: getAmberContrast($theme);
-    }
-    .amber{
-        background: getAmber($theme);
-        color: getAmberContrast($theme);
-    }
-    .background-orange-alpha {background: getOrangeAlpha($theme)}
-    .orange .ripple{background: getOrangeAlpha($theme)}
-    .background-orange{background: getOrange($theme)}
-    .border-color-orange{border-color: getOrange($theme)}
-    .color-orange{color: getOrange($theme)!important}
-    .fill-orange{fill: getOrange($theme)}
-    .stroke-orange{stroke: getOrange($theme)}
-    .color-orange-alpha{color: getOrangeAlpha($theme)!important}
-    .orange-alpha{
-        background: getOrangeAlpha($theme);
-        color: getOrangeContrast($theme);
-    }
-    .orange{
-        background: getOrange($theme);
-        color: getOrangeContrast($theme);
-    }
-    .background-deep-orange-alpha {background: getDeepOrangeAlpha($theme)}
-    .deep-orange .ripple{background: getDeepOrangeAlpha($theme)}
-    .background-deep-orange{background: getDeepOrange($theme)}
-    .border-color-deep-orange{border-color: getDeepOrange($theme)}
-    .color-deep-orange{color: getDeepOrange($theme)!important}
-    .fill-deep-orange{fill: getDeepOrange($theme)}
-    .stroke-deep-orange{stroke: getDeepOrange($theme)}
-    .color-deep-orange-alpha{color: getDeepOrangeAlpha($theme)!important}
-    .deep-orange-alpha{
-        background: getDeepOrangeAlpha($theme);
-        color: getDeepOrangeContrast($theme);
-    }
-    .deep-orange{
-        background: getDeepOrange($theme);
-        color: getDeepOrangeContrast($theme);
-    }
-    .background-brown-alpha {background: getBrownAlpha($theme)}
-    .brown .ripple{background: getBrownAlpha($theme)}
-    .background-brown{background: getBrown($theme)}
-    .border-color-brown{border-color: getBrown($theme)}
-    .color-brown{color: getBrown($theme)!important}
-    .fill-brown{fill: getBrown($theme)}
-    .stroke-brown{stroke: getBrown($theme)}
-    .color-brown-alpha{color: getBrownAlpha($theme)!important}
-    .brown-alpha{
-        background: getBrownAlpha($theme);
-        color: getBrownContrast($theme);
-    }
-    .brown{
-        background: getBrown($theme);
-        color: getBrownContrast($theme);
-    }
-    .background-grey-alpha {background: getGreyAlpha($theme)}
-    .grey .ripple{background: getGreyAlpha($theme)}
-    .background-grey{background: getGrey($theme)}
-    .border-color-grey{border-color: getGrey($theme)}
-    .color-grey{color: getGrey($theme)!important}
-    .fill-grey{fill: getGrey($theme)}
-    .stroke-grey{stroke: getGrey($theme)}
-    .color-grey-alpha{color: getGreyAlpha($theme)!important}
-    .grey-alpha{
-        background: getGreyAlpha($theme);
-        color: getGreyContrast($theme);
-    }
-    .grey{
-        background: getGrey($theme);
-        color: getGreyContrast($theme);
-    }
-    .background-blue-grey-alpha {background: getBlueGreyAlpha($theme)}
-    .blue-grey .ripple{background: getBlueGreyAlpha($theme)}
-    .background-blue-grey{background: getBlueGrey($theme)}
-    .border-color-blue-grey{border-color: getBlueGrey($theme)}
-    .color-blue-grey{color: getBlueGrey($theme)!important}
-    .fill-blue-grey{fill: getBlueGrey($theme)}
-    .stroke-blue-grey{stroke: getBlueGrey($theme)}
-    .color-blue-grey-alpha{color: getBlueGreyAlpha($theme)!important}
-    .blue-grey-alpha{
-        background: getBlueGreyAlpha($theme);
-        color: getBlueGreyContrast($theme);
-    }
-    .blue-grey{
-        background: getBlueGrey($theme);
-        color: getBlueGreyContrast($theme);
-    }
-
-    .background-primary-alpha {background: getPrimaryAlpha($theme)}
-    .primary .ripple{background: getPrimaryContrastAlpha($theme)}
-    .background-primary{background: getPrimary($theme)}
-    .border-color-primary{border-color: getPrimary($theme)}
-    .color-primary{color: getPrimary($theme)!important}
-    .fill-primary{fill: getPrimary($theme)}
-    .stroke-primary{stroke: getPrimary($theme)}
-    .color-primary-alpha{color: getPrimaryAlpha($theme)!important}
-    .primary-alpha{
-        background: getPrimaryAlpha($theme);
-        color: getPrimaryContrast($theme);
-    }
-    .primary{
-        background: getPrimary($theme);
-        color: getPrimaryContrast($theme);
-    }
-
-    .background-accent-alpha {background: getAccentAlpha($theme)}
-    .accent .ripple{background: getAccentContrastAlpha($theme)}
-    .background-accent{background: getAccent($theme)}
-    .border-color-accent{border-color: getAccent($theme)}
-    .color-accent{color: getAccent($theme)!important}
-    .fill-accent{fill: getAccent($theme)}
-    .stroke-accent{stroke: getAccent($theme)}
-    .color-accent-alpha{color: getAccentAlpha($theme)!important}
-    .accent-alpha{
-        background: getAccentAlpha($theme);
-        color: getAccentContrast($theme);
-    }
-    .accent{
-        background: getAccent($theme);
-        color: getAccentContrast($theme);
-    }
-
-    .background-warn-alpha {background: getWarnAlpha($theme)}
-    .warn .ripple{background: getWarnContrastAlpha($theme)}
-    .background-warn{background: getWarn($theme)}
-    .border-color-warn{border-color: getWarn($theme)}
-    .color-warn{color: getWarn($theme)!important}
-    .fill-warn{fill: getWarn($theme)}
-    .stroke-warn{stroke: getWarn($theme)}
-    .color-warn-alpha{color: getWarnAlpha($theme)!important}
-    .warn-alpha{
-        background: getWarnAlpha($theme);
-        color: getWarnContrast($theme);
-    }
-    .warn{
-        background: getWarn($theme);
-        color: getWarnContrast($theme);
+    @each $colorName, $colorFn in $color-functions {
+        .background-#{$colorName}-alpha {background: call(#{$colorFn}Alpha, $theme)}
+        .#{$colorName} .ripple{background: call(#{$colorFn}Alpha, $theme)}
+        .background-#{$colorName}{background: call(#{$colorFn}, $theme)}
+        .border-color-#{$colorName}{border-color: call(#{$colorFn}, $theme)}
+        .color-#{$colorName}{color: call(#{$colorFn}, $theme)!important}
+        .fill-#{$colorName}{fill: call(#{$colorFn}, $theme)}
+        .stroke-#{$colorName}{stroke: call(#{$colorFn}, $theme)}
+        .color-#{$colorName}-alpha{color: call(#{$colorFn}Alpha, $theme)!important}
+        .#{$colorName}-alpha{
+            background: call(#{$colorFn}Alpha, $theme);
+            color: call(#{$colorFn}, $theme);
+        }
+        .#{$colorName}{
+            background: call(#{$colorFn}, $theme);
+            color: call(#{$colorFn}Contrast, $theme);
+        }
     }
 
     .background-basic-alpha {background: getForegroundAlpha($theme)}
@@ -585,15 +218,9 @@ $index: 0;
         background: transparent;
     }
 
-    $attributes: (
-        color: $foreground,
-        border-color: $foreground,
-        background: $background,
-        fill: $background,
-        stroke: $background
+    $attributes: (color, border-color, background, fill, stroke
     );
-
-    @each $attribute, $colorLevel in $attributes {
+    @each $attribute in $attributes {
         @if ($attribute != "color") {
             .#{$attribute}-bg {
                 #{$attribute}: getBackground($theme) !important;