@yakad/ui 1.2.50-beta → 1.2.52-beta

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 (3) hide show
  1. package/inputField/inputField.module.css +8 -8
  2. package/package.json +1 -1
  3. package/theme/theme.module.css +13 -0
package/inputField/inputField.module.css CHANGED
@@ -11,7 +11,7 @@
11
11
  border-image: initial;
12
12
  width: 100%;
13
13
  height: inherit;
14
- color: rgb(227 226 230 / 0.87);
14
+ color: rgb(var(--onSurfaceRGBColor, 26 28 30) / 0.87);
15
15
  box-shadow: none;
16
16
  font-family: inherit;
17
17
  font-size: inherit;
@@ -44,10 +44,10 @@
44
44
  border-right: none;
45
45
  border-left: none;
46
46
  border-top: 2.7rem solid transparent;
47
- border-bottom: solid 0.1rem rgb(227 226 230 / 0.6);
47
+ border-bottom: solid 0.1rem rgb(var(--onSurfaceRGBColor, 26 28 30) / 0.6);
48
48
  border-radius: 0.4rem 0.4rem 0rem 0rem;
49
49
  padding: 0rem 1.2rem 1rem;
50
- background-color: rgb(227 226 230/ 0.04);
50
+ background-color: rgb(var(--onSurfaceRGBColor, 26 28 30)/ 0.04);
51
51
  transition: border-bottom 0.2s ease 0s, background-color 0.2s ease 0s;
52
52
  }
53
53
  .input:focus {
@@ -73,7 +73,7 @@
73
73
  }
74
74
 
75
75
  .input.outlined:not(:focus):placeholder-shown {
76
- border-top-color: rgb(227 226 230 / 0.6);
76
+ border-top-color: rgb(var(--onSurfaceRGBColor, 26 28 30)/ 0.6);
77
77
  }
78
78
  .input.outlined:not(:focus):placeholder-shown + .span {
79
79
  font-size: inherit;
@@ -85,7 +85,7 @@
85
85
  }
86
86
  .input + .span {
87
87
  position: absolute;
88
- color: rgb(227 226 230 / 0.6);
88
+ color: rgb(var(--onSurfaceRGBColor, 26 28 30) / 0.6);
89
89
  font-size: 75%;
90
90
  transition: color 0.2s ease 0s, font-size 0.2s ease 0s,
91
91
  line-height 0.2s ease 0s;
@@ -94,7 +94,7 @@
94
94
  top: 0rem;
95
95
  left: 0rem;
96
96
  display: flex;
97
- border-color: rgb(227 226 230/ 0.6);
97
+ border-color: rgb(var(--onSurfaceRGBColor, 26 28 30)/ 0.6);
98
98
  width: 100%;
99
99
  max-height: 100%;
100
100
  line-height: 1.5rem;
@@ -121,7 +121,7 @@
121
121
  margin-top: 0.6rem;
122
122
  border-top-width: 0.1rem;
123
123
  border-top-style: solid;
124
- border-top-color: rgb(227 226 230 / 0.6);
124
+ border-top-color: rgb(var(--onSurfaceRGBColor, 26 28 30) / 0.6);
125
125
  min-width: 1rem;
126
126
  height: 0.8rem;
127
127
  pointer-events: none;
@@ -145,7 +145,7 @@
145
145
  margin-top: 0.6rem;
146
146
  border-top-width: 0.1rem;
147
147
  border-top-style: solid;
148
- border-top-color: rgb(227 226 230 / 0.6);
148
+ border-top-color: rgb(var(--onSurfaceRGBColor, 26 28 30)/ 0.6);
149
149
  min-width: 1rem;
150
150
  height: 0.8rem;
151
151
  pointer-events: none;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yakad/ui",
3
- "version": "1.2.50-beta",
3
+ "version": "1.2.52-beta",
4
4
  "description": "",
5
5
  "main": "./src/index.js",
6
6
  "scripts": {
package/theme/theme.module.css CHANGED
@@ -25,6 +25,7 @@
25
25
  --LightSurfaceContainerHightColor: #ece6f0;
26
26
  --LightSurfaceContainerHighestColor: #e6e0e9;
27
27
  --LightOnSurfaceColor: #1c1b1f;
28
+ --LightOnSurfaceRGBColor:26 28 30;
28
29
  --LightOnSurfaceVariantColor: #49454e;
29
30
  --LightOutlineColor: #79747e;
30
31
  --LightOutlineVariantColor: #c4c7c5;
@@ -54,6 +55,7 @@
54
55
  --DarkSurfaceContainerHightColor: #2b2930;
55
56
  --DarkSurfaceContainerHighestColor: #36343b;
56
57
  --DarkOnSurfaceColor: #e6e1e5;
58
+ --DarkOnSurfaceRGBColor:227 226 230;
57
59
  --DarkOnSurfaceVariantColor: #cac4d0;
58
60
  --DarkOutlineColor: #938f99;
59
61
  --DarkOutlineVariantColor: #444746;
@@ -84,6 +86,7 @@
84
86
  --LightSurfaceContainerHightColor: #ece6f0;
85
87
  --LightSurfaceContainerHighestColor: #e6e0e9;
86
88
  --LightOnSurfaceColor: #1c1b1f;
89
+ --LightOnSurfaceRGBColor:26 28 30;
87
90
  --LightOnSurfaceVariantColor: #49454e;
88
91
  --LightOutlineColor: #79747e;
89
92
  --LightOutlineVariantColor: #c4c7c5;
@@ -113,6 +116,7 @@
113
116
  --DarkSurfaceContainerHightColor: #2b2930;
114
117
  --DarkSurfaceContainerHighestColor: #36343b;
115
118
  --DarkOnSurfaceColor: #e6e1e5;
119
+ --DarkOnSurfaceRGBColor:227 226 230;
116
120
  --DarkOnSurfaceVariantColor: #cac4d0;
117
121
  --DarkOutlineColor: #938f99;
118
122
  --DarkOutlineVariantColor: #444746;
@@ -144,6 +148,7 @@
144
148
  --LightSurfaceContainerHightColor: #ece6f0;
145
149
  --LightSurfaceContainerHighestColor: #e6e0e9;
146
150
  --LightOnSurfaceColor: #1c1b1f;
151
+ --LightOnSurfaceRGBColor:26 28 30;
147
152
  --LightOnSurfaceVariantColor: #49454e;
148
153
  --LightOutlineColor: #79747e;
149
154
  --LightOutlineVariantColor: #c4c7c5;
@@ -173,6 +178,7 @@
173
178
  --DarkSurfaceContainerHightColor: #2b2930;
174
179
  --DarkSurfaceContainerHighestColor: #36343b;
175
180
  --DarkOnSurfaceColor: #e6e1e5;
181
+ --DarkOnSurfaceRGBColor:227 226 230;
176
182
  --DarkOnSurfaceVariantColor: #cac4d0;
177
183
  --DarkOutlineColor: #938f99;
178
184
  --DarkOutlineVariantColor: #444746;
@@ -204,6 +210,7 @@
204
210
  --LightSurfaceContainerHightColor: #ece6f0;
205
211
  --LightSurfaceContainerHighestColor: #e6e0e9;
206
212
  --LightOnSurfaceColor: #1c1b1f;
213
+ --LightOnSurfaceRGBColor:26 28 30;
207
214
  --LightOnSurfaceVariantColor: #49454e;
208
215
  --LightOutlineColor: #79747e;
209
216
  --LightOutlineVariantColor: #c4c7c5;
@@ -233,6 +240,7 @@
233
240
  --DarkSurfaceContainerHightColor: #2b2930;
234
241
  --DarkSurfaceContainerHighestColor: #36343b;
235
242
  --DarkOnSurfaceColor: #e6e1e5;
243
+ --DarkOnSurfaceRGBColor:227 226 230;
236
244
  --DarkOnSurfaceVariantColor: #cac4d0;
237
245
  --DarkOutlineColor: #938f99;
238
246
  --DarkOutlineVariantColor: #444746;
@@ -266,6 +274,7 @@
266
274
  --LightSurfaceContainerHightColor: #ece6f0;
267
275
  --LightSurfaceContainerHighestColor: #e6e0e9;
268
276
  --LightOnSurfaceColor: #1c1b1f;
277
+ --LightOnSurfaceRGBColor:26 28 30;
269
278
  --LightOnSurfaceVariantColor: #49454e;
270
279
  --LightOutlineColor: #79747e;
271
280
  --LightOutlineVariantColor: #c4c7c5;
@@ -297,6 +306,7 @@
297
306
  --DarkSurfaceContainerHightColor: #2b2930;
298
307
  --DarkSurfaceContainerHighestColor: #36343b;
299
308
  --DarkOnSurfaceColor: #e6e1e5;
309
+ --DarkOnSurfaceRGBColor:227 226 230;
300
310
  --DarkOnSurfaceVariantColor: #cac4d0;
301
311
  --DarkOutlineColor: #938f99;
302
312
  --DarkOutlineVariantColor: #444746;
@@ -328,6 +338,7 @@
328
338
  --surfaceContainerHightColor: var(--LightSurfaceContainerHightColor);
329
339
  --surfaceContainerHighestColor: var(--LightSurfaceContainerHighestColor);
330
340
  --onSurfaceColor: var(--LightOnSurfaceColor);
341
+ --onSurfaceRGBColor:var(--LightOnSurfaceRGBColor);
331
342
  --onSurfaceVariantColor: var(--LightOnSurfaceVariantColor);
332
343
  --outlineColor: var(--LightOutlineColor);
333
344
  --outlineVariantColor: var(--LightOutlineVariantColor);
@@ -357,6 +368,7 @@
357
368
  --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
358
369
  --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
359
370
  --onSurfaceColor: var(--DarkOnSurfaceColor);
371
+ --onSurfaceRGBColor:var(--DarkOnSurfaceRGBColor);
360
372
  --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
361
373
  --outlineColor: var(--DarkOutlineColor);
362
374
  --outlineVariantColor: var(--DarkOutlineVariantColor);
@@ -387,6 +399,7 @@
387
399
  --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
388
400
  --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
389
401
  --onSurfaceColor: var(--DarkOnSurfaceColor);
402
+ --onSurfaceRGBColor:var(--DarkOnSurfaceRGBColor);
390
403
  --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
391
404
  --outlineColor: var(--DarkOutlineColor);
392
405
  --outlineVariantColor: var(--DarkOutlineVariantColor);