@dynamic-framework/ui-react 1.21.0 → 1.22.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.
- package/dist/css/dynamic-ui-non-root.css +136 -23
- package/dist/css/dynamic-ui-non-root.min.css +2 -2
- package/dist/css/dynamic-ui-root.css +91 -63
- package/dist/css/dynamic-ui-root.min.css +2 -2
- package/dist/css/dynamic-ui.css +226 -85
- package/dist/css/dynamic-ui.min.css +2 -2
- package/package.json +10 -3
- package/src/style/abstracts/_utilities.scss +1 -1
- package/src/style/abstracts/variables/_colors.scss +110 -65
- package/src/style/components/_d-tabs.scss +11 -7
- package/src/style/root/_root.scss +2 -2
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"sideEffects": [
|
|
4
4
|
"*.css"
|
|
5
5
|
],
|
|
6
|
-
"version": "1.
|
|
6
|
+
"version": "1.22.0",
|
|
7
7
|
"description": "React Dynamic Framework",
|
|
8
8
|
"license": "https://github.com/dynamic-framework/dynamic-ui/blob/master/libraries/dynamic-ui-react/LICENSE.md",
|
|
9
9
|
"repository": {
|
|
@@ -134,6 +134,7 @@
|
|
|
134
134
|
"react": "^18.2.0",
|
|
135
135
|
"react-dom": "^18.2.0",
|
|
136
136
|
"react-i18next": "^13.3.1",
|
|
137
|
+
"recharts": "^2.12.7",
|
|
137
138
|
"rimraf": "^5.0.5",
|
|
138
139
|
"rollup": "^4.1.4",
|
|
139
140
|
"sass": "^1.69.4",
|
|
@@ -147,7 +148,13 @@
|
|
|
147
148
|
"peerDependencies": {
|
|
148
149
|
"react": "^18.2.0",
|
|
149
150
|
"react-dom": "^18.2.0",
|
|
150
|
-
"react-i18next": "^13.3.1"
|
|
151
|
+
"react-i18next": "^13.3.1",
|
|
152
|
+
"recharts": "^2.12.7"
|
|
153
|
+
},
|
|
154
|
+
"peerDependenciesMeta": {
|
|
155
|
+
"recharts": {
|
|
156
|
+
"optional": true
|
|
157
|
+
}
|
|
151
158
|
},
|
|
152
|
-
"gitHead": "
|
|
159
|
+
"gitHead": "fff9359c0bbac31afab8446c503843b93abaecc1"
|
|
153
160
|
}
|
|
@@ -29,7 +29,7 @@ $utilities: map-merge(
|
|
|
29
29
|
(
|
|
30
30
|
values: map-merge(
|
|
31
31
|
map-get(map-get($utilities, "background-color"), "values"),
|
|
32
|
-
map-loop(map-merge-multiple($theme-colors-palletes, $palette-grays, $bg-
|
|
32
|
+
map-loop(map-merge-multiple($theme-colors-palletes, $palette-grays, $bg-surface-colors), rgba-css-var, "$key", "bg"),
|
|
33
33
|
)
|
|
34
34
|
)
|
|
35
35
|
),
|
|
@@ -2,21 +2,23 @@
|
|
|
2
2
|
|
|
3
3
|
// scss-docs-start gray-color-variables
|
|
4
4
|
$white: #fff !default;
|
|
5
|
-
$gray-
|
|
6
|
-
$gray-
|
|
7
|
-
$gray-
|
|
8
|
-
$gray-
|
|
9
|
-
$gray-
|
|
10
|
-
$gray-
|
|
11
|
-
$gray-
|
|
12
|
-
$gray-
|
|
13
|
-
$gray-
|
|
5
|
+
$gray-50: #fcfcfd !default;
|
|
6
|
+
$gray-100: #f8f9fa !default;
|
|
7
|
+
$gray-200: #e9ecef !default;
|
|
8
|
+
$gray-300: #dee2e6 !default;
|
|
9
|
+
$gray-400: #ced4da !default;
|
|
10
|
+
$gray-500: #adb5bd !default;
|
|
11
|
+
$gray-600: #6c757d !default;
|
|
12
|
+
$gray-700: #495057 !default;
|
|
13
|
+
$gray-800: #343a40 !default;
|
|
14
|
+
$gray-900: #212529 !default;
|
|
14
15
|
$black: #000 !default;
|
|
15
16
|
// scss-docs-end gray-color-variables
|
|
16
17
|
|
|
17
18
|
// fusv-disable
|
|
18
19
|
// scss-docs-start gray-colors-map
|
|
19
20
|
$grays: (
|
|
21
|
+
"50": $gray-50,
|
|
20
22
|
"100": $gray-100,
|
|
21
23
|
"200": $gray-200,
|
|
22
24
|
"300": $gray-300,
|
|
@@ -31,14 +33,14 @@ $grays: (
|
|
|
31
33
|
// fusv-enable
|
|
32
34
|
|
|
33
35
|
// scss-docs-start color-variables
|
|
34
|
-
$blue: #
|
|
35
|
-
$indigo: #
|
|
36
|
-
$purple: #
|
|
37
|
-
$pink: #
|
|
38
|
-
$red: #
|
|
39
|
-
$orange: #
|
|
40
|
-
$yellow: #
|
|
41
|
-
$green: #
|
|
36
|
+
$blue: #0d6efd !default;
|
|
37
|
+
$indigo: #6610f2 !default;
|
|
38
|
+
$purple: #4848b7 !default;
|
|
39
|
+
$pink: #d81b60 !default;
|
|
40
|
+
$red: #dc3545 !default;
|
|
41
|
+
$orange: #fd7e14 !default;
|
|
42
|
+
$yellow: #ffc107 !default;
|
|
43
|
+
$green: #198754 !default;
|
|
42
44
|
$teal: #20c997 !default;
|
|
43
45
|
$cyan: #0dcaf0 !default;
|
|
44
46
|
// scss-docs-end color-variables
|
|
@@ -62,19 +64,6 @@ $colors: (
|
|
|
62
64
|
) !default;
|
|
63
65
|
// scss-docs-end colors-map
|
|
64
66
|
|
|
65
|
-
// custom
|
|
66
|
-
// TODO: check this.
|
|
67
|
-
$bg-gray-soft: #fafafa !default;
|
|
68
|
-
$bg-primary-soft: #fff9fa !default;
|
|
69
|
-
$bg-secondary-soft: #fbfaff !default;
|
|
70
|
-
|
|
71
|
-
$bg-soft-colors: (
|
|
72
|
-
"gray-soft": $bg-gray-soft,
|
|
73
|
-
"primary-soft": $bg-primary-soft,
|
|
74
|
-
"secondary-soft": $bg-secondary-soft,
|
|
75
|
-
) !default;
|
|
76
|
-
// end custom
|
|
77
|
-
|
|
78
67
|
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
|
|
79
68
|
// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
|
|
80
69
|
$min-contrast-ratio: 4.5 !default;
|
|
@@ -84,6 +73,7 @@ $color-contrast-dark: $gray-700 !default;
|
|
|
84
73
|
$color-contrast-light: $white !default;
|
|
85
74
|
|
|
86
75
|
// fusv-disable
|
|
76
|
+
$blue-50: tint-color($blue, 90%) !default;
|
|
87
77
|
$blue-100: tint-color($blue, 80%) !default;
|
|
88
78
|
$blue-200: tint-color($blue, 60%) !default;
|
|
89
79
|
$blue-300: tint-color($blue, 40%) !default;
|
|
@@ -94,6 +84,7 @@ $blue-700: shade-color($blue, 40%) !default;
|
|
|
94
84
|
$blue-800: shade-color($blue, 60%) !default;
|
|
95
85
|
$blue-900: shade-color($blue, 80%) !default;
|
|
96
86
|
|
|
87
|
+
$indigo-50: tint-color($indigo, 90%) !default;
|
|
97
88
|
$indigo-100: tint-color($indigo, 80%) !default;
|
|
98
89
|
$indigo-200: tint-color($indigo, 60%) !default;
|
|
99
90
|
$indigo-300: tint-color($indigo, 40%) !default;
|
|
@@ -104,6 +95,7 @@ $indigo-700: shade-color($indigo, 40%) !default;
|
|
|
104
95
|
$indigo-800: shade-color($indigo, 60%) !default;
|
|
105
96
|
$indigo-900: shade-color($indigo, 80%) !default;
|
|
106
97
|
|
|
98
|
+
$purple-50: tint-color($purple, 90%) !default;
|
|
107
99
|
$purple-100: tint-color($purple, 80%) !default;
|
|
108
100
|
$purple-200: tint-color($purple, 60%) !default;
|
|
109
101
|
$purple-300: tint-color($purple, 40%) !default;
|
|
@@ -114,6 +106,7 @@ $purple-700: shade-color($purple, 40%) !default;
|
|
|
114
106
|
$purple-800: shade-color($purple, 60%) !default;
|
|
115
107
|
$purple-900: shade-color($purple, 80%) !default;
|
|
116
108
|
|
|
109
|
+
$pink-50: tint-color($pink, 90%) !default;
|
|
117
110
|
$pink-100: tint-color($pink, 80%) !default;
|
|
118
111
|
$pink-200: tint-color($pink, 60%) !default;
|
|
119
112
|
$pink-300: tint-color($pink, 40%) !default;
|
|
@@ -124,6 +117,7 @@ $pink-700: shade-color($pink, 40%) !default;
|
|
|
124
117
|
$pink-800: shade-color($pink, 60%) !default;
|
|
125
118
|
$pink-900: shade-color($pink, 80%) !default;
|
|
126
119
|
|
|
120
|
+
$red-50: tint-color($red, 90%) !default;
|
|
127
121
|
$red-100: tint-color($red, 80%) !default;
|
|
128
122
|
$red-200: tint-color($red, 60%) !default;
|
|
129
123
|
$red-300: tint-color($red, 40%) !default;
|
|
@@ -134,6 +128,7 @@ $red-700: shade-color($red, 40%) !default;
|
|
|
134
128
|
$red-800: shade-color($red, 60%) !default;
|
|
135
129
|
$red-900: shade-color($red, 80%) !default;
|
|
136
130
|
|
|
131
|
+
$orange-50: tint-color($orange, 90%) !default;
|
|
137
132
|
$orange-100: tint-color($orange, 80%) !default;
|
|
138
133
|
$orange-200: tint-color($orange, 60%) !default;
|
|
139
134
|
$orange-300: tint-color($orange, 40%) !default;
|
|
@@ -144,6 +139,7 @@ $orange-700: shade-color($orange, 40%) !default;
|
|
|
144
139
|
$orange-800: shade-color($orange, 60%) !default;
|
|
145
140
|
$orange-900: shade-color($orange, 80%) !default;
|
|
146
141
|
|
|
142
|
+
$yellow-50: tint-color($yellow, 90%) !default;
|
|
147
143
|
$yellow-100: tint-color($yellow, 80%) !default;
|
|
148
144
|
$yellow-200: tint-color($yellow, 60%) !default;
|
|
149
145
|
$yellow-300: tint-color($yellow, 40%) !default;
|
|
@@ -154,6 +150,7 @@ $yellow-700: shade-color($yellow, 40%) !default;
|
|
|
154
150
|
$yellow-800: shade-color($yellow, 60%) !default;
|
|
155
151
|
$yellow-900: shade-color($yellow, 80%) !default;
|
|
156
152
|
|
|
153
|
+
$green-50: tint-color($green, 90%) !default;
|
|
157
154
|
$green-100: tint-color($green, 80%) !default;
|
|
158
155
|
$green-200: tint-color($green, 60%) !default;
|
|
159
156
|
$green-300: tint-color($green, 40%) !default;
|
|
@@ -164,6 +161,7 @@ $green-700: shade-color($green, 40%) !default;
|
|
|
164
161
|
$green-800: shade-color($green, 60%) !default;
|
|
165
162
|
$green-900: shade-color($green, 80%) !default;
|
|
166
163
|
|
|
164
|
+
$teal-50: tint-color($teal, 90%) !default;
|
|
167
165
|
$teal-100: tint-color($teal, 80%) !default;
|
|
168
166
|
$teal-200: tint-color($teal, 60%) !default;
|
|
169
167
|
$teal-300: tint-color($teal, 40%) !default;
|
|
@@ -174,6 +172,7 @@ $teal-700: shade-color($teal, 40%) !default;
|
|
|
174
172
|
$teal-800: shade-color($teal, 60%) !default;
|
|
175
173
|
$teal-900: shade-color($teal, 80%) !default;
|
|
176
174
|
|
|
175
|
+
$cyan-50: tint-color($cyan, 90%) !default;
|
|
177
176
|
$cyan-100: tint-color($cyan, 80%) !default;
|
|
178
177
|
$cyan-200: tint-color($cyan, 60%) !default;
|
|
179
178
|
$cyan-300: tint-color($cyan, 40%) !default;
|
|
@@ -185,6 +184,7 @@ $cyan-800: shade-color($cyan, 60%) !default;
|
|
|
185
184
|
$cyan-900: shade-color($cyan, 80%) !default;
|
|
186
185
|
|
|
187
186
|
$blues: (
|
|
187
|
+
"blue-50": $blue-50,
|
|
188
188
|
"blue-100": $blue-100,
|
|
189
189
|
"blue-200": $blue-200,
|
|
190
190
|
"blue-300": $blue-300,
|
|
@@ -197,6 +197,7 @@ $blues: (
|
|
|
197
197
|
) !default;
|
|
198
198
|
|
|
199
199
|
$indigos: (
|
|
200
|
+
"indigo-50": $indigo-50,
|
|
200
201
|
"indigo-100": $indigo-100,
|
|
201
202
|
"indigo-200": $indigo-200,
|
|
202
203
|
"indigo-300": $indigo-300,
|
|
@@ -209,6 +210,7 @@ $indigos: (
|
|
|
209
210
|
) !default;
|
|
210
211
|
|
|
211
212
|
$purples: (
|
|
213
|
+
"purple-50": $purple-50,
|
|
212
214
|
"purple-100": $purple-100,
|
|
213
215
|
"purple-200": $purple-200,
|
|
214
216
|
"purple-300": $purple-300,
|
|
@@ -221,6 +223,7 @@ $purples: (
|
|
|
221
223
|
) !default;
|
|
222
224
|
|
|
223
225
|
$pinks: (
|
|
226
|
+
"pink-50": $pink-50,
|
|
224
227
|
"pink-100": $pink-100,
|
|
225
228
|
"pink-200": $pink-200,
|
|
226
229
|
"pink-300": $pink-300,
|
|
@@ -233,6 +236,7 @@ $pinks: (
|
|
|
233
236
|
) !default;
|
|
234
237
|
|
|
235
238
|
$reds: (
|
|
239
|
+
"red-50": $red-50,
|
|
236
240
|
"red-100": $red-100,
|
|
237
241
|
"red-200": $red-200,
|
|
238
242
|
"red-300": $red-300,
|
|
@@ -245,6 +249,7 @@ $reds: (
|
|
|
245
249
|
) !default;
|
|
246
250
|
|
|
247
251
|
$oranges: (
|
|
252
|
+
"orange-50": $orange-50,
|
|
248
253
|
"orange-100": $orange-100,
|
|
249
254
|
"orange-200": $orange-200,
|
|
250
255
|
"orange-300": $orange-300,
|
|
@@ -257,6 +262,7 @@ $oranges: (
|
|
|
257
262
|
) !default;
|
|
258
263
|
|
|
259
264
|
$yellows: (
|
|
265
|
+
"yellow-50": $yellow-50,
|
|
260
266
|
"yellow-100": $yellow-100,
|
|
261
267
|
"yellow-200": $yellow-200,
|
|
262
268
|
"yellow-300": $yellow-300,
|
|
@@ -269,6 +275,7 @@ $yellows: (
|
|
|
269
275
|
) !default;
|
|
270
276
|
|
|
271
277
|
$greens: (
|
|
278
|
+
"green-50": $green-50,
|
|
272
279
|
"green-100": $green-100,
|
|
273
280
|
"green-200": $green-200,
|
|
274
281
|
"green-300": $green-300,
|
|
@@ -281,6 +288,7 @@ $greens: (
|
|
|
281
288
|
) !default;
|
|
282
289
|
|
|
283
290
|
$teals: (
|
|
291
|
+
"teal-50": $teal-50,
|
|
284
292
|
"teal-100": $teal-100,
|
|
285
293
|
"teal-200": $teal-200,
|
|
286
294
|
"teal-300": $teal-300,
|
|
@@ -293,6 +301,7 @@ $teals: (
|
|
|
293
301
|
) !default;
|
|
294
302
|
|
|
295
303
|
$cyans: (
|
|
304
|
+
"cyan-50": $cyan-50,
|
|
296
305
|
"cyan-100": $cyan-100,
|
|
297
306
|
"cyan-200": $cyan-200,
|
|
298
307
|
"cyan-300": $cyan-300,
|
|
@@ -308,24 +317,24 @@ $cyans: (
|
|
|
308
317
|
// custom
|
|
309
318
|
// theme <- colors mapping.
|
|
310
319
|
$theme-colors-mapping: (
|
|
311
|
-
"primary": "
|
|
312
|
-
"secondary": "
|
|
320
|
+
"primary": "pink",
|
|
321
|
+
"secondary": "purple",
|
|
313
322
|
"success": "green",
|
|
314
323
|
"info": "blue",
|
|
315
324
|
"warning": "yellow",
|
|
316
|
-
"danger": "
|
|
325
|
+
"danger": "red",
|
|
317
326
|
"light": "gray-100",
|
|
318
327
|
"dark": "gray-900"
|
|
319
328
|
) !default;
|
|
320
329
|
// end custom
|
|
321
330
|
|
|
322
331
|
// scss-docs-start theme-color-variables
|
|
323
|
-
$primary: $
|
|
324
|
-
$secondary: $
|
|
332
|
+
$primary: $pink !default;
|
|
333
|
+
$secondary: $purple !default;
|
|
325
334
|
$success: $green !default;
|
|
326
335
|
$info: $blue !default;
|
|
327
336
|
$warning: $yellow !default;
|
|
328
|
-
$danger: $
|
|
337
|
+
$danger: $red !default;
|
|
329
338
|
$light: $gray-100 !default;
|
|
330
339
|
$dark: $gray-900 !default;
|
|
331
340
|
// scss-docs-end theme-color-variables
|
|
@@ -384,26 +393,29 @@ $light-border-subtle: var(--#{$prefix}gray-100) !default;
|
|
|
384
393
|
$dark-border-subtle: var(--#{$prefix}gray-400) !default;
|
|
385
394
|
// scss-docs-end theme-border-subtle-variables
|
|
386
395
|
|
|
387
|
-
$primary-
|
|
388
|
-
$primary-
|
|
389
|
-
$primary-
|
|
390
|
-
$primary-
|
|
391
|
-
$primary-
|
|
392
|
-
$primary-
|
|
393
|
-
$primary-
|
|
394
|
-
$primary-
|
|
395
|
-
$primary-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
$secondary-
|
|
399
|
-
$secondary-
|
|
400
|
-
$secondary-
|
|
401
|
-
$secondary-
|
|
402
|
-
$secondary-
|
|
403
|
-
$secondary-
|
|
404
|
-
$secondary-
|
|
405
|
-
$secondary-
|
|
406
|
-
|
|
396
|
+
$primary-50: $pink-50 !default;
|
|
397
|
+
$primary-100: $pink-100 !default;
|
|
398
|
+
$primary-200: $pink-200 !default;
|
|
399
|
+
$primary-300: $pink-300 !default;
|
|
400
|
+
$primary-400: $pink-400 !default;
|
|
401
|
+
$primary-500: $pink-500 !default;
|
|
402
|
+
$primary-600: $pink-600 !default;
|
|
403
|
+
$primary-700: $pink-700 !default;
|
|
404
|
+
$primary-800: $pink-800 !default;
|
|
405
|
+
$primary-900: $pink-900 !default;
|
|
406
|
+
|
|
407
|
+
$secondary-50: $purple-50 !default;
|
|
408
|
+
$secondary-100: $purple-100 !default;
|
|
409
|
+
$secondary-200: $purple-200 !default;
|
|
410
|
+
$secondary-300: $purple-300 !default;
|
|
411
|
+
$secondary-400: $purple-400 !default;
|
|
412
|
+
$secondary-500: $purple-500 !default;
|
|
413
|
+
$secondary-600: $purple-600 !default;
|
|
414
|
+
$secondary-700: $purple-700 !default;
|
|
415
|
+
$secondary-800: $purple-800 !default;
|
|
416
|
+
$secondary-900: $purple-900 !default;
|
|
417
|
+
|
|
418
|
+
$success-50: $green-50 !default;
|
|
407
419
|
$success-100: $green-100 !default;
|
|
408
420
|
$success-200: $green-200 !default;
|
|
409
421
|
$success-300: $green-300 !default;
|
|
@@ -414,6 +426,7 @@ $success-700: $green-700 !default;
|
|
|
414
426
|
$success-800: $green-800 !default;
|
|
415
427
|
$success-900: $green-900 !default;
|
|
416
428
|
|
|
429
|
+
$info-50: $blue-50 !default;
|
|
417
430
|
$info-100: $blue-100 !default;
|
|
418
431
|
$info-200: $blue-200 !default;
|
|
419
432
|
$info-300: $blue-300 !default;
|
|
@@ -424,6 +437,7 @@ $info-700: $blue-700 !default;
|
|
|
424
437
|
$info-800: $blue-800 !default;
|
|
425
438
|
$info-900: $blue-900 !default;
|
|
426
439
|
|
|
440
|
+
$warning-50: $yellow-50 !default;
|
|
427
441
|
$warning-100: $yellow-100 !default;
|
|
428
442
|
$warning-200: $yellow-200 !default;
|
|
429
443
|
$warning-300: $yellow-300 !default;
|
|
@@ -434,17 +448,43 @@ $warning-700: $yellow-700 !default;
|
|
|
434
448
|
$warning-800: $yellow-800 !default;
|
|
435
449
|
$warning-900: $yellow-900 !default;
|
|
436
450
|
|
|
437
|
-
$danger-
|
|
438
|
-
$danger-
|
|
439
|
-
$danger-
|
|
440
|
-
$danger-
|
|
441
|
-
$danger-
|
|
442
|
-
$danger-
|
|
443
|
-
$danger-
|
|
444
|
-
$danger-
|
|
445
|
-
$danger-
|
|
451
|
+
$danger-50: $red-50 !default;
|
|
452
|
+
$danger-100: $red-100 !default;
|
|
453
|
+
$danger-200: $red-200 !default;
|
|
454
|
+
$danger-300: $red-300 !default;
|
|
455
|
+
$danger-400: $red-400 !default;
|
|
456
|
+
$danger-500: $red-500 !default;
|
|
457
|
+
$danger-600: $red-600 !default;
|
|
458
|
+
$danger-700: $red-700 !default;
|
|
459
|
+
$danger-800: $red-800 !default;
|
|
460
|
+
$danger-900: $red-900 !default;
|
|
461
|
+
|
|
462
|
+
// custom
|
|
463
|
+
// TODO: check this.
|
|
464
|
+
$bg-surface-gray: $gray-50 !default;
|
|
465
|
+
$bg-surface-primary: $primary-50 !default;
|
|
466
|
+
$bg-surface-secondary: $secondary-50 !default;
|
|
467
|
+
$bg-surface-success: $success-50 !default;
|
|
468
|
+
$bg-surface-info: $info-50 !default;
|
|
469
|
+
$bg-surface-warning: $warning-50 !default;
|
|
470
|
+
$bg-surface-danger: $danger-50 !default;
|
|
471
|
+
|
|
472
|
+
$bg-surface-colors: (
|
|
473
|
+
"gray-soft": $bg-surface-gray, // DEPRECATED
|
|
474
|
+
"primary-soft": $bg-surface-primary, // DEPRECATED
|
|
475
|
+
"secondary-soft": $bg-surface-secondary, // DEPRECATED
|
|
476
|
+
"surface-gray": $bg-surface-gray,
|
|
477
|
+
"surface-primary": $bg-surface-primary,
|
|
478
|
+
"surface-secondary": $bg-surface-secondary,
|
|
479
|
+
"surface-success": $bg-surface-success,
|
|
480
|
+
"surface-info": $bg-surface-info,
|
|
481
|
+
"surface-warning": $bg-surface-warning,
|
|
482
|
+
"surface-danger": $bg-surface-danger,
|
|
483
|
+
) !default;
|
|
484
|
+
// end custom
|
|
446
485
|
|
|
447
486
|
$theme-colors-palletes: (
|
|
487
|
+
"primary-50": $primary-50,
|
|
448
488
|
"primary-100": $primary-100,
|
|
449
489
|
"primary-200": $primary-200,
|
|
450
490
|
"primary-300": $primary-300,
|
|
@@ -454,6 +494,7 @@ $theme-colors-palletes: (
|
|
|
454
494
|
"primary-700": $primary-700,
|
|
455
495
|
"primary-800": $primary-800,
|
|
456
496
|
"primary-900": $primary-900,
|
|
497
|
+
"secondary-50": $secondary-50,
|
|
457
498
|
"secondary-100": $secondary-100,
|
|
458
499
|
"secondary-200": $secondary-200,
|
|
459
500
|
"secondary-300": $secondary-300,
|
|
@@ -463,6 +504,7 @@ $theme-colors-palletes: (
|
|
|
463
504
|
"secondary-700": $secondary-700,
|
|
464
505
|
"secondary-800": $secondary-800,
|
|
465
506
|
"secondary-900": $secondary-900,
|
|
507
|
+
"success-50": $success-50,
|
|
466
508
|
"success-100": $success-100,
|
|
467
509
|
"success-200": $success-200,
|
|
468
510
|
"success-300": $success-300,
|
|
@@ -472,6 +514,7 @@ $theme-colors-palletes: (
|
|
|
472
514
|
"success-700": $success-700,
|
|
473
515
|
"success-800": $success-800,
|
|
474
516
|
"success-900": $success-900,
|
|
517
|
+
"info-50": $info-50,
|
|
475
518
|
"info-100": $info-100,
|
|
476
519
|
"info-200": $info-200,
|
|
477
520
|
"info-300": $info-300,
|
|
@@ -481,6 +524,7 @@ $theme-colors-palletes: (
|
|
|
481
524
|
"info-700": $info-700,
|
|
482
525
|
"info-800": $info-800,
|
|
483
526
|
"info-900": $info-900,
|
|
527
|
+
"warning-50": $warning-50,
|
|
484
528
|
"warning-100": $warning-100,
|
|
485
529
|
"warning-200": $warning-200,
|
|
486
530
|
"warning-300": $warning-300,
|
|
@@ -490,6 +534,7 @@ $theme-colors-palletes: (
|
|
|
490
534
|
"warning-700": $warning-700,
|
|
491
535
|
"warning-800": $warning-800,
|
|
492
536
|
"warning-900": $warning-900,
|
|
537
|
+
"danger-50": $danger-50,
|
|
493
538
|
"danger-100": $danger-100,
|
|
494
539
|
"danger-200": $danger-200,
|
|
495
540
|
"danger-300": $danger-300,
|
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
.nav-pills,
|
|
2
|
+
.nav-tabs,
|
|
2
3
|
.nav-underline {
|
|
3
|
-
--#{$prefix}tabs-nav-gap: #{$nav-nav-gap};
|
|
4
|
-
--#{$prefix}tabs-nav-padding-x: #{$nav-nav-padding-x};
|
|
5
|
-
--#{$prefix}tabs-nav-padding-y: #{$nav-nav-padding-y};
|
|
4
|
+
--#{$prefix}nav-tabs-nav-gap: #{$nav-nav-gap};
|
|
5
|
+
--#{$prefix}nav-tabs-nav-padding-x: #{$nav-nav-padding-x};
|
|
6
|
+
--#{$prefix}nav-tabs-nav-padding-y: #{$nav-nav-padding-y};
|
|
7
|
+
--#{$prefix}nav-tabs-link-border-active-font-weight: #{$nav-link-border-active-font-weight};
|
|
8
|
+
}
|
|
6
9
|
|
|
7
|
-
|
|
8
|
-
|
|
10
|
+
.nav-pills,
|
|
11
|
+
.nav-underline {
|
|
12
|
+
gap: var(--#{$prefix}nav-tabs-nav-gap);
|
|
13
|
+
padding: var(--#{$prefix}nav-tabs-nav-padding-y) var(--#{$prefix}nav-tabs-nav-padding-x);
|
|
9
14
|
|
|
10
15
|
&.flex-column {
|
|
11
16
|
flex: 1 0 auto;
|
|
@@ -17,10 +22,9 @@
|
|
|
17
22
|
}
|
|
18
23
|
|
|
19
24
|
.nav-tabs {
|
|
20
|
-
--#{$prefix}tabs-link-border-active-font-weight: #{$nav-link-border-active-font-weight};
|
|
21
25
|
.nav-link {
|
|
22
26
|
&.active {
|
|
23
|
-
font-weight: var(--#{$prefix}tabs-link-border-active-font-weight);
|
|
27
|
+
font-weight: var(--#{$prefix}nav-tabs-link-border-active-font-weight);
|
|
24
28
|
border-bottom-color: transparent;
|
|
25
29
|
}
|
|
26
30
|
&:not(.active):is(:hover, :focus) {
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
// end custom
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
@each $color, $value in $bg-
|
|
21
|
+
@each $color, $value in $bg-surface-colors {
|
|
22
22
|
--#{$prefix}#{$color}-rgb: #{to-rgb($value)};
|
|
23
23
|
}
|
|
24
24
|
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
--#{$prefix}gray-#{$color}: rgb(var(--#{$prefix}gray-#{$color}-rgb));
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
@each $color, $value in $bg-
|
|
45
|
+
@each $color, $value in $bg-surface-colors {
|
|
46
46
|
--#{$prefix}#{$color}: rgb(var(--#{$prefix}#{$color}-rgb));
|
|
47
47
|
}
|
|
48
48
|
// end custom
|