@muibook/components 6.0.0 → 6.1.1
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.
|
@@ -204,9 +204,6 @@
|
|
|
204
204
|
/* 2. LIGHT MODE */
|
|
205
205
|
/* ==================================================================================================== */
|
|
206
206
|
html[data-theme="light"] {
|
|
207
|
-
/* ================================================================================================== */
|
|
208
|
-
/* Semantic */
|
|
209
|
-
/* ================================================================================================== */
|
|
210
207
|
/* Form */
|
|
211
208
|
--form-default-text-color: var(--grey-500);
|
|
212
209
|
--form-success-text-color: var(--green-700);
|
|
@@ -254,7 +251,6 @@ html[data-theme="light"] {
|
|
|
254
251
|
--feedback-info-action-background: var(--blue-200);
|
|
255
252
|
--feedback-warning-action-background: var(--orange-200);
|
|
256
253
|
--feedback-attention-action-background: var(--red-200);
|
|
257
|
-
|
|
258
254
|
/* Action - Primary (Button & Link) */
|
|
259
255
|
--action-primary-border-color: var(--black-opacity-0);
|
|
260
256
|
--action-primary-border-color-hover: var(--black-opacity-0);
|
|
@@ -307,9 +303,7 @@ html[data-theme="light"] {
|
|
|
307
303
|
--action-attention-text-color-hover: var(--white);
|
|
308
304
|
--action-attention-text-color-focus: var(--white);
|
|
309
305
|
--action-attention-text-color-disabled: var(--red-300);
|
|
310
|
-
/*
|
|
311
|
-
/* Contextual */
|
|
312
|
-
/* ================================================================================================== */
|
|
306
|
+
/* Surface */
|
|
313
307
|
--surface: var(--grey-200);
|
|
314
308
|
--surface-elevated-alpha: var(--white-opacity-50);
|
|
315
309
|
--surface-elevated-100: var(--white);
|
|
@@ -317,16 +311,16 @@ html[data-theme="light"] {
|
|
|
317
311
|
--surface-recessed-alpha: var(--black-opacity-10);
|
|
318
312
|
--surface-recessed-100: var(--grey-300);
|
|
319
313
|
--surface-recessed-200: var(--grey-400);
|
|
320
|
-
|
|
314
|
+
/* Stroke */
|
|
321
315
|
--outline-color: var(--blue-500);
|
|
322
316
|
--border-color: var(--black-opacity-20);
|
|
323
|
-
|
|
317
|
+
/* Text */
|
|
324
318
|
--text-color: var(--grey-900);
|
|
325
319
|
--text-color-success: var(--green-600);
|
|
326
320
|
--text-color-warning: var(--orange-600);
|
|
327
321
|
--text-color-error: var(--red-600);
|
|
328
322
|
--text-color-optional: var(--grey-600);
|
|
329
|
-
|
|
323
|
+
/* Overlay */
|
|
330
324
|
--backdrop-overlay: var(--black-opacity-70);
|
|
331
325
|
/* ================================================================================================== */
|
|
332
326
|
/* Components */
|
|
@@ -433,9 +427,6 @@ html[data-theme="light"] {
|
|
|
433
427
|
/* 3. DARK MODE */
|
|
434
428
|
/* ==================================================================================================== */
|
|
435
429
|
html[data-theme="dark"] {
|
|
436
|
-
/* ================================================================================================== */
|
|
437
|
-
/* Semantic */
|
|
438
|
-
/* ================================================================================================== */
|
|
439
430
|
/* Form */
|
|
440
431
|
--form-default-text-color: var(--grey-500);
|
|
441
432
|
--form-success-text-color: var(--green-400);
|
|
@@ -535,9 +526,7 @@ html[data-theme="dark"] {
|
|
|
535
526
|
--action-attention-text-color-hover: var(--white);
|
|
536
527
|
--action-attention-text-color-focus: var(--white);
|
|
537
528
|
--action-attention-text-color-disabled: var(--red-300);
|
|
538
|
-
/*
|
|
539
|
-
/* Contextual */
|
|
540
|
-
/* ================================================================================================== */
|
|
529
|
+
/* Surface */
|
|
541
530
|
--surface: var(--grey-1000);
|
|
542
531
|
--surface-elevated-alpha: var(--white-opacity-10);
|
|
543
532
|
--surface-elevated-100: var(--grey-800);
|
|
@@ -545,16 +534,16 @@ html[data-theme="dark"] {
|
|
|
545
534
|
--surface-recessed-alpha: var(--black-opacity-30);
|
|
546
535
|
--surface-recessed-100: var(--grey-1000);
|
|
547
536
|
--surface-recessed-200: var(--grey-1100);
|
|
548
|
-
|
|
537
|
+
/* Stroke */
|
|
549
538
|
--outline-color: var(--blue-300);
|
|
550
539
|
--border-color: var(--white-opacity-20);
|
|
551
|
-
|
|
540
|
+
/* Text */
|
|
552
541
|
--text-color: var(--grey-200);
|
|
553
542
|
--text-color-success: var(--green-400);
|
|
554
543
|
--text-color-warning: var(--orange-400);
|
|
555
544
|
--text-color-error: var(--red-400);
|
|
556
545
|
--text-color-optional: var(--grey-300);
|
|
557
|
-
|
|
546
|
+
/* Overlay */
|
|
558
547
|
--backdrop-overlay: var(--black-opacity-70);
|
|
559
548
|
/* ================================================================================================== */
|
|
560
549
|
/* Components */
|
|
@@ -658,9 +647,6 @@ html[data-theme="dark"] {
|
|
|
658
647
|
/* 4. SET THE FOUNDATION */
|
|
659
648
|
/* ==================================================================================================== */
|
|
660
649
|
:where(html) {
|
|
661
|
-
/* ================================================================================================== */
|
|
662
|
-
/* Semantic */
|
|
663
|
-
/* ================================================================================================== */
|
|
664
650
|
/* Feedback - Border (Alerts & Messages) */
|
|
665
651
|
--feedback-neutral-border: var(--stroke-size-200) var(--stroke-solid) var(--feedback-neutral-border-color);
|
|
666
652
|
--feedback-positive-border: var(--stroke-size-200) var(--stroke-solid) var(--feedback-positive-border-color);
|
|
@@ -696,9 +682,6 @@ html[data-theme="dark"] {
|
|
|
696
682
|
--action-font-size: var(--text-font-size);
|
|
697
683
|
--action-line-height: var(--text-line-height);
|
|
698
684
|
--action-font-weight: var(--font-weight-medium);
|
|
699
|
-
/* ================================================================================================== */
|
|
700
|
-
/* Contextual */
|
|
701
|
-
/* ================================================================================================== */
|
|
702
685
|
/* Text */
|
|
703
686
|
--text-line-height-xs: var(--line-height-25);
|
|
704
687
|
--text-line-height-s: var(--line-height-50);
|