matcha-theme 19.93.0 → 19.94.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/abstracts/_functions.scss +31 -14
  2. package/components/matcha-cards.scss +1 -1
  3. package/components/matcha-modal.scss +1 -1
  4. package/components/matcha-tooltip.scss +6 -7
  5. package/package.json +1 -1
package/abstracts/_functions.scss CHANGED
@@ -94,6 +94,8 @@
94
94
  brown: $brown,
95
95
  grey: $grey,
96
96
  blue-grey: $blue-grey,
97
+ light-grey: $light-grey,
98
+ dark-grey: $dark-grey,
97
99
  primary: $primary,
98
100
  accent: $accent,
99
101
  warn: $warn
@@ -154,24 +156,39 @@
154
156
 
155
157
  // Foreground
156
158
  @function getForeground($theme){
157
- $foreground: map.get($theme, foreground);
158
- $foreground: map.get($foreground, foreground);
159
- @return $foreground;
160
- }
161
- @function getForegroundInverse($theme){
162
- $foreground: map.get($theme, foreground);
163
- $foreground-inverse: map.get($foreground, foreground-inverse);
164
- @return $foreground-inverse;
159
+ $is-dark: map.get($theme, is-dark);
160
+ @if $is-dark {
161
+ @return $color-base-blue-grey-100; // Cor clara para tema light
162
+ } @else {
163
+ @return $color-base-blue-grey-900; // Cor escura para tema dark
164
+ }
165
165
  }
166
+
166
167
  @function getForegroundAlpha($theme){
167
- $foreground: map.get($theme, foreground);
168
- $foreground-color: map.get($foreground, foreground-alpha);
169
- @return $foreground-color;
168
+ $is-dark: map.get($theme, is-dark);
169
+ @if $is-dark {
170
+ @return rgba($color-base-blue-grey-100, 0.2); // Cor clara para tema light
171
+ } @else {
172
+ @return rgba($color-base-blue-grey-900, 0.2); // Cor escura para tema dark
173
+ }
170
174
  }
175
+
176
+ @function getForegroundInverse($theme){
177
+ $is-dark: map.get($theme, is-dark);
178
+ @if $is-dark {
179
+ @return $color-base-blue-grey-900; // Cor clara para tema light
180
+ } @else {
181
+ @return $color-base-blue-grey-100; // Cor escura para tema dark
182
+ }
183
+ }
184
+
171
185
  @function getForegroundAlphaInverse($theme){
172
- $foreground: map.get($theme, foreground);
173
- $foreground-color: map.get($foreground, foreground-alpha-inverse);
174
- @return $foreground-color;
186
+ $is-dark: map.get($theme, is-dark);
187
+ @if $is-dark {
188
+ @return rgba($color-base-blue-grey-900, 0.2); // Cor clara para tema light
189
+ } @else {
190
+ @return rgba($color-base-blue-grey-100, 0.2); // Cor escura para tema dark
191
+ }
175
192
  }
176
193
 
177
194
 
package/components/matcha-cards.scss CHANGED
@@ -144,7 +144,7 @@
144
144
  }
145
145
  &[color="fg"]{
146
146
  background: getForeground($theme);
147
- color:getForegroundInverse($theme);
147
+ color: getForegroundInverse($theme);
148
148
  }
149
149
 
150
150
  //basic
package/components/matcha-modal.scss CHANGED
@@ -52,7 +52,7 @@
52
52
  left: 0;
53
53
  width: 100%;
54
54
  height: 100%;
55
- background: getBackground($theme);
55
+ background: getForeground($theme);
56
56
  backdrop-filter: blur(6px);
57
57
  mix-blend-mode: multiply;
58
58
  z-index: 998;
package/components/matcha-tooltip.scss CHANGED
@@ -83,25 +83,24 @@
83
83
  }
84
84
 
85
85
  @mixin matcha-tooltip-theme($theme) {
86
- $foreground: map-get($theme, foreground);
87
86
 
88
87
  .matcha-tooltip-content {
89
- background-color: map-get($foreground, foreground);
90
- color: map-get($foreground, foreground-inverse);
88
+ background-color: getForeground($theme);
89
+ color: getForegroundInverse($theme);
91
90
  &:not(.matcha-tooltip-content_below):not(.matcha-tooltip-content_left):not(.matcha-tooltip-content_right)::after {
92
- border-color: map-get($foreground, foreground) transparent transparent transparent;
91
+ border-color: getForeground($theme) transparent transparent transparent;
93
92
  }
94
93
  }
95
94
 
96
95
  .matcha-tooltip-content_below::before {
97
- border-color: transparent transparent map-get($foreground, foreground) transparent;
96
+ border-color: transparent transparent getForeground($theme) transparent;
98
97
  }
99
98
 
100
99
  .matcha-tooltip-content_left::after {
101
- border-color: transparent transparent transparent map-get($foreground, foreground);
100
+ border-color: transparent transparent transparent getForeground($theme);
102
101
  }
103
102
 
104
103
  .matcha-tooltip-content_right::after {
105
- border-color: transparent map-get($foreground, foreground) transparent transparent;
104
+ border-color: transparent getForeground($theme) transparent transparent;
106
105
  }
107
106
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "matcha-theme",
3
- "version": "19.93.0",
3
+ "version": "19.94.0",
4
4
  "description": "Themes for matcha-design-system",
5
5
  "main": "main.scss",
6
6
  "scripts": {