matcha-theme 19.20.0 → 19.22.0

package/abstracts/_colors.scss

@@ -172,7 +172,7 @@ $index: 0;
     $deep-orange-contrast: map-get($deep-orange, 'contrast');
     $brown: map-get($palettes, brown);
     $brown-contrast: map-get($brown, 'contrast');
-    $gray: map-get($palettes, gray);
+    $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');
@@ -511,8 +511,8 @@ $index: 0;
     .stroke-primary{stroke: map-get($primary, default)}
     .color-primary-alpha{color: rgba(map-get($primary, default),0.2)!important}
     .primary-alpha{
-        background: rgba(map-get($primary, $get-shade),0.2);
-        color: map-get($primary-contrast, $get-shade);
+        background: rgba(map-get($primary, default),0.2);
+        color: map-get($primary, default-contrast);
     }
     .primary{
         background: map-get($primary, default);
@@ -528,8 +528,8 @@ $index: 0;
     .stroke-accent{stroke: map-get($accent, default)}
     .color-accent-alpha{color: rgba(map-get($accent, default),0.2)!important}
     .accent-alpha{
-        background: rgba(map-get($accent, $get-shade),0.2);
-        color: map-get($accent-contrast, $get-shade);
+        background: rgba(map-get($accent, default),0.2);
+        color: map-get($accent, default-contrast);
     }
     .accent{
         background: map-get($accent, default);
@@ -545,8 +545,8 @@ $index: 0;
     .stroke-warn{stroke: map-get($warn, default)}
     .color-warn-alpha{color: rgba(map-get($warn, default),0.2)!important}
     .warn-alpha{
-        background: rgba(map-get($warn, $get-shade),0.2);
-        color: map-get($warn-contrast, $get-shade);
+        background: rgba(map-get($warn, default),0.2);
+        color: map-get($warn, default-contrast);
     }
     .warn{
         background: map-get($warn, default);

package/components/matcha-buttons.scss

@@ -226,7 +226,7 @@ a[matcha-button] {
     $deep-orange-contrast: map-get($deep-orange, 'contrast');
     $brown: map-get($palettes, brown);
     $brown-contrast: map-get($brown, 'contrast');
-    $gray: map-get($palettes, gray);
+    $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');
@@ -244,7 +244,6 @@ a[matcha-button] {
 
     $get-shade: if($is-dark, 100, 500); // Define $red-shade com base no valor de $is-dark
 
-
     button[matcha-button],
     a[matcha-button] {
         &:not([color]) .ripple {
@@ -573,24 +572,24 @@ a[matcha-button] {
         }
         &[color="brown"] .ripple{background: rgba(map-get($brown-contrast, $get-shade), 0.2)}
 
-        // gray
-        &[color="gray"][outline]:not([outline="false"]) .ripple {
-            background: rgba(map-get($gray, $get-shade), 0.2)
+        // grey
+        &[color="grey"][outline]:not([outline="false"]) .ripple {
+            background: rgba(map-get($grey, $get-shade), 0.2)
         }
-        &[color="gray"][alpha]:not([alpha="false"]){
-            background: rgba(map-get($gray, $get-shade), 0.2);
-            color: map-get($gray, $get-shade);
+        &[color="grey"][alpha]:not([alpha="false"]){
+            background: rgba(map-get($grey, $get-shade), 0.2);
+            color: map-get($grey, $get-shade);
         }
-        &[color="gray"][outline]:not([outline="false"]),
-        &[color="gray"][link]:not([link="false"]),
-        &[color="gray"][basic]:not([basic="false"]) {
-            color: map-get($gray, $get-shade)!important
+        &[color="grey"][outline]:not([outline="false"]),
+        &[color="grey"][link]:not([link="false"]),
+        &[color="grey"][basic]:not([basic="false"]) {
+            color: map-get($grey, $get-shade)!important
         }
-        &[color="gray"]{
-            background: map-get($gray, $get-shade);
+        &[color="grey"]{
+            background: map-get($grey, $get-shade);
             color: map-get($grey-contrast, $get-shade);
         }
-        &[color="gray"] .ripple{background: rgba(map-get($grey-contrast, $get-shade), 0.2)}
+        &[color="grey"] .ripple{background: rgba(map-get($grey-contrast, $get-shade), 0.2)}
 
         // blue-grey
         &[color="blue-grey"][outline]:not([outline="false"]) .ripple {
@@ -613,60 +612,60 @@ a[matcha-button] {
 
         // primary
         &[color="primary"][outline]:not([outline="false"]) .ripple {
-            background: rgba(map-get($primary, $get-shade), 0.2)
+            background: rgba(map-get($primary, default), 0.2)
         }
         &[color="primary"][alpha]:not([alpha="false"]){
-            background: rgba(map-get($primary, $get-shade), 0.2);
-            color: map-get($primary, $get-shade);
+            background: rgba(map-get($primary, default), 0.2);
+            color: map-get($primary, default);
         }
         &[color="primary"][outline]:not([outline="false"]),
         &[color="primary"][link]:not([link="false"]),
         &[color="primary"][basic]:not([basic="false"]) {
-            color: map-get($primary, $get-shade)!important
+            color: map-get($primary, default)!important
         }
         &[color="primary"]{
-            background: map-get($primary, $get-shade);
-            color: map-get($primary-contrast, $get-shade);
+            background: map-get($primary, default);
+            color: map-get($primary, default-contrast);
         }
-        &[color="primary"] .ripple{background: rgba(map-get($primary-contrast, $get-shade), 0.2)}
+        &[color="primary"] .ripple{background: rgba(map-get($primary, default-contrast), 0.2)}
 
         // accent
         &[color="accent"][outline]:not([outline="false"]) .ripple {
-            background: rgba(map-get($accent, $get-shade), 0.2)
+            background: rgba(map-get($accent, default), 0.2)
         }
         &[color="accent"][alpha]:not([alpha="false"]){
-            background: rgba(map-get($accent, $get-shade), 0.2);
-            color: map-get($accent, $get-shade);
+            background: rgba(map-get($accent, default), 0.2);
+            color: map-get($accent, default);
         }
         &[color="accent"][outline]:not([outline="false"]),
         &[color="accent"][link]:not([link="false"]),
         &[color="accent"][basic]:not([basic="false"]) {
-            color: map-get($accent, $get-shade)!important
+            color: map-get($accent, default)!important
         }
         &[color="accent"]{
-            background: map-get($accent, $get-shade);
-            color: map-get($accent-contrast, $get-shade);
+            background: map-get($accent, default);
+            color: map-get($accent, default-contrast);
         }
-        &[color="accent"] .ripple{background: rgba(map-get($accent-contrast, $get-shade), 0.2)}
+        &[color="accent"] .ripple{background: rgba(map-get($accent, default-contrast), 0.2)}
 
         // warn
         &[color="warn"][outline]:not([outline="false"]) .ripple {
-            background: rgba(map-get($warn, $get-shade), 0.2)
+            background: rgba(map-get($warn, default), 0.2)
         }
         &[color="warn"][alpha]:not([alpha="false"]){
-            background: rgba(map-get($warn, $get-shade), 0.2);
-            color: map-get($warn, $get-shade);
+            background: rgba(map-get($warn, default), 0.2);
+            color: map-get($warn, default);
         }
         &[color="warn"][outline]:not([outline="false"]),
         &[color="warn"][link]:not([link="false"]),
         &[color="warn"][basic]:not([basic="false"]) {
-            color: map-get($warn, $get-shade)!important
+            color: map-get($warn, default)!important
         }
         &[color="warn"]{
-            background: map-get($warn, $get-shade);
-            color: map-get($warn-contrast, $get-shade);
+            background: map-get($warn, default);
+            color: map-get($warn, default-contrast);
         }
-        &[color="warn"] .ripple{background: rgba(map-get($warn-contrast, $get-shade), 0.2)}
+        &[color="warn"] .ripple{background: rgba(map-get($warn, default-contrast), 0.2)}
 
         //basic
         &[color="basic"][outline]:not([outline="false"]) .ripple {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "matcha-theme",
-    "version": "19.20.0",
+    "version": "19.22.0",
     "description": "Themes for matcha-design-system",
     "main": "main.scss",
     "scripts": {