@entur/layout 2.2.3 → 2.2.4

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 (2) hide show
  1. package/dist/styles.css +308 -171
  2. package/package.json +6 -6
package/dist/styles.css CHANGED
@@ -1,5 +1,26 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
+ .eds-base-card {
4
+ display: flex;
5
+ box-shadow: 0 0.0625rem 0.1875rem 0 rgba(0, 0, 0, 0.12);
6
+ background-color: var(--components-layout-card-standard-fill-default);
7
+ border: 0.0625rem solid var(--components-layout-card-standard-border-default);
8
+ color: var(--components-layout-card-standard-text);
9
+ border-radius: 0.25rem;
10
+ align-items: center;
11
+ -webkit-appearance: none;
12
+ -moz-appearance: none;
13
+ appearance: none;
14
+ text-decoration: none;
15
+ }
16
+ .eds-contrast .eds-base-card {
17
+ background-color: var(--components-layout-card-contrast-fill-default);
18
+ border-color: var(--components-layout-card-contrast-border-default);
19
+ box-shadow: 0 0.0625rem 0.1875rem 0 rgb(57, 61, 121);
20
+ color: var(--components-layout-card-contrast-text);
21
+ }
22
+ /* DO NOT CHANGE!*/
23
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
24
  .eds-navigation-card {
4
25
  display: flex;
5
26
  flex-direction: column;
@@ -111,27 +132,6 @@
111
132
  }
112
133
  /* DO NOT CHANGE!*/
113
134
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
114
- .eds-base-card {
115
- display: flex;
116
- box-shadow: 0 0.0625rem 0.1875rem 0 rgba(0, 0, 0, 0.12);
117
- background-color: var(--components-layout-card-standard-fill-default);
118
- border: 0.0625rem solid var(--components-layout-card-standard-border-default);
119
- color: var(--components-layout-card-standard-text);
120
- border-radius: 0.25rem;
121
- align-items: center;
122
- -webkit-appearance: none;
123
- -moz-appearance: none;
124
- appearance: none;
125
- text-decoration: none;
126
- }
127
- .eds-contrast .eds-base-card {
128
- background-color: var(--components-layout-card-contrast-fill-default);
129
- border-color: var(--components-layout-card-contrast-border-default);
130
- box-shadow: 0 0.0625rem 0.1875rem 0 rgb(57, 61, 121);
131
- color: var(--components-layout-card-contrast-text);
132
- }
133
- /* DO NOT CHANGE!*/
134
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
135
135
  .eds-media-card {
136
136
  flex-direction: column;
137
137
  overflow: hidden;
@@ -404,163 +404,300 @@
404
404
  }
405
405
  /* DO NOT CHANGE!*/
406
406
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
407
- @import '~@entur/tokens/dist/semantic.css';
408
- @import '~@entur/tokens/dist/base.css';
407
+ /* DO NOT CHANGE!*/
408
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
409
+ /* DO NOT CHANGE!*/
410
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
411
+ /* DO NOT CHANGE!*/
412
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
413
+ [data-color-mode=light],
414
+ :root {
415
+ --components-layout-badge-information-contrast-border: rgba(255, 255, 255, 0);
416
+ --components-layout-badge-information-contrast-bullet: #64b3e7;
417
+ --components-layout-badge-information-contrast-fill: #64b3e7;
418
+ --components-layout-badge-information-contrast-text: #181c56;
419
+ --components-layout-badge-information-contrast-text-bullet: #ffffff;
420
+ --components-layout-badge-information-standard-border: #067eb2;
421
+ --components-layout-badge-information-standard-bullet: #067eb2;
422
+ --components-layout-badge-information-standard-fill: #e1eff8;
423
+ --components-layout-badge-information-standard-text: #181c56;
424
+ --components-layout-badge-information-standard-text-bullet: #181c56;
425
+ --components-layout-badge-negative-contrast-border: rgba(255, 255, 255, 0);
426
+ --components-layout-badge-negative-contrast-bullet: #ff5959;
427
+ --components-layout-badge-negative-contrast-fill: #ff9494;
428
+ --components-layout-badge-negative-contrast-text: #181c56;
429
+ --components-layout-badge-negative-contrast-text-bullet: #ffffff;
430
+ --components-layout-badge-negative-standard-border: #d31b1b;
431
+ --components-layout-badge-negative-standard-bullet: #d31b1b;
432
+ --components-layout-badge-negative-standard-fill: #ffcece;
433
+ --components-layout-badge-negative-standard-text: #181c56;
434
+ --components-layout-badge-negative-standard-text-bullet: #181c56;
435
+ --components-layout-badge-neutral-contrast-border: rgba(255, 255, 255, 0);
436
+ --components-layout-badge-neutral-contrast-bullet: #c7cdeb;
437
+ --components-layout-badge-neutral-contrast-fill: #54568c;
438
+ --components-layout-badge-neutral-contrast-text: #ffffff;
439
+ --components-layout-badge-neutral-contrast-text-bullet: #ffffff;
440
+ --components-layout-badge-neutral-standard-border: #949699;
441
+ --components-layout-badge-neutral-standard-bullet: #81828f;
442
+ --components-layout-badge-neutral-standard-fill: #f6f6f9;
443
+ --components-layout-badge-neutral-standard-text: #181c56;
444
+ --components-layout-badge-neutral-standard-text-bullet: #181c56;
445
+ --components-layout-badge-primary-contrast-bullet: #aeb7e2;
446
+ --components-layout-badge-primary-contrast-fill: #aeb7e2;
447
+ --components-layout-badge-primary-contrast-text: #181c56;
448
+ --components-layout-badge-primary-contrast-text-bullet: #ffffff;
449
+ --components-layout-badge-primary-standard-bullet: #181c56;
450
+ --components-layout-badge-primary-standard-fill: #181c56;
451
+ --components-layout-badge-primary-standard-text: #ffffff;
452
+ --components-layout-badge-primary-standard-text-bullet: #181c56;
453
+ --components-layout-badge-success-contrast-border: rgba(255, 255, 255, 0);
454
+ --components-layout-badge-success-contrast-bullet: #5ac39a;
455
+ --components-layout-badge-success-contrast-fill: #5ac39a;
456
+ --components-layout-badge-success-contrast-text: #181c56;
457
+ --components-layout-badge-success-contrast-text-bullet: #ffffff;
458
+ --components-layout-badge-success-standard-border: #1a8e60;
459
+ --components-layout-badge-success-standard-bullet: #1a8e60;
460
+ --components-layout-badge-success-standard-fill: #d0f1e3;
461
+ --components-layout-badge-success-standard-text: #181c56;
462
+ --components-layout-badge-success-standard-text-bullet: #181c56;
463
+ --components-layout-badge-warning-contrast-border: rgba(255, 255, 255, 0);
464
+ --components-layout-badge-warning-contrast-bullet: #ffe082;
465
+ --components-layout-badge-warning-contrast-fill: #ffe082;
466
+ --components-layout-badge-warning-contrast-text: #181c56;
467
+ --components-layout-badge-warning-contrast-text-bullet: #ffffff;
468
+ --components-layout-badge-warning-standard-border: #e9b10c;
469
+ --components-layout-badge-warning-standard-bullet: #ffca28;
470
+ --components-layout-badge-warning-standard-fill: #fff4cd;
471
+ --components-layout-badge-warning-standard-text: #181c56;
472
+ --components-layout-badge-warning-standard-text-bullet: #181c56;
473
+ --components-layout-card-contrast-border-default: rgba(255, 255, 255, 0);
474
+ --components-layout-card-contrast-border-active: #aeb7e2;
475
+ --components-layout-card-contrast-divide: #ff5959;
476
+ --components-layout-card-contrast-fill-default: #393d79;
477
+ --components-layout-card-contrast-fill-hoveractive: #54568c;
478
+ --components-layout-card-contrast-icon: #ffffff;
479
+ --components-layout-card-contrast-subjecttext: #d9dae8;
480
+ --components-layout-card-contrast-text: #ffffff;
481
+ --components-layout-card-standard-border-default: #e3e6e8;
482
+ --components-layout-card-standard-border-active: #181c56;
483
+ --components-layout-card-standard-divide: #ff5959;
484
+ --components-layout-card-standard-fill-default: #ffffff;
485
+ --components-layout-card-standard-fill-hoveractive: #f6f6f9;
486
+ --components-layout-card-standard-icon: #181c56;
487
+ --components-layout-card-standard-subjecttext: #626493;
488
+ --components-layout-card-standard-text: #181c56;
489
+ }
490
+
491
+ [data-color-mode=dark] {
492
+ --components-layout-badge-information-contrast-border: rgba(255, 255, 255, 0);
493
+ --components-layout-badge-information-contrast-bullet: #acd7f1;
494
+ --components-layout-badge-information-contrast-fill: #acd7f1;
495
+ --components-layout-badge-information-contrast-text: #08091c;
496
+ --components-layout-badge-information-contrast-text-bullet: #e5e5e9;
497
+ --components-layout-badge-information-standard-border: rgba(255, 255, 255, 0);
498
+ --components-layout-badge-information-standard-bullet: #acd7f1;
499
+ --components-layout-badge-information-standard-fill: #acd7f1;
500
+ --components-layout-badge-information-standard-text: #08091c;
501
+ --components-layout-badge-information-standard-text-bullet: #e5e5e9;
502
+ --components-layout-badge-negative-contrast-border: rgba(255, 255, 255, 0);
503
+ --components-layout-badge-negative-contrast-bullet: #ff9494;
504
+ --components-layout-badge-negative-contrast-fill: #ffcece;
505
+ --components-layout-badge-negative-contrast-text: #08091c;
506
+ --components-layout-badge-negative-contrast-text-bullet: #e5e5e9;
507
+ --components-layout-badge-negative-standard-border: rgba(255, 255, 255, 0);
508
+ --components-layout-badge-negative-standard-bullet: #ff9494;
509
+ --components-layout-badge-negative-standard-fill: #ffcece;
510
+ --components-layout-badge-negative-standard-text: #08091c;
511
+ --components-layout-badge-negative-standard-text-bullet: #e5e5e9;
512
+ --components-layout-badge-neutral-contrast-border: rgba(255, 255, 255, 0);
513
+ --components-layout-badge-neutral-contrast-bullet: #e5e5e9;
514
+ --components-layout-badge-neutral-contrast-fill: rgba(229, 229, 233, 0.3490196078);
515
+ --components-layout-badge-neutral-contrast-text: #e5e5e9;
516
+ --components-layout-badge-neutral-contrast-text-bullet: #e5e5e9;
517
+ --components-layout-badge-neutral-standard-border: rgba(255, 255, 255, 0);
518
+ --components-layout-badge-neutral-standard-bullet: #e5e5e9;
519
+ --components-layout-badge-neutral-standard-fill: rgba(229, 229, 233, 0.3490196078);
520
+ --components-layout-badge-neutral-standard-text: #e5e5e9;
521
+ --components-layout-badge-neutral-standard-text-bullet: #e5e5e9;
522
+ --components-layout-badge-primary-contrast-bullet: #aeb7e2;
523
+ --components-layout-badge-primary-contrast-fill: #aeb7e2;
524
+ --components-layout-badge-primary-contrast-text: #08091c;
525
+ --components-layout-badge-primary-contrast-text-bullet: #e5e5e9;
526
+ --components-layout-badge-primary-standard-bullet: #aeb7e2;
527
+ --components-layout-badge-primary-standard-fill: #aeb7e2;
528
+ --components-layout-badge-primary-standard-text: #08091c;
529
+ --components-layout-badge-primary-standard-text-bullet: #e5e5e9;
530
+ --components-layout-badge-success-contrast-border: rgba(255, 255, 255, 0);
531
+ --components-layout-badge-success-contrast-bullet: #9cd9c2;
532
+ --components-layout-badge-success-contrast-fill: #9cd9c2;
533
+ --components-layout-badge-success-contrast-text: #08091c;
534
+ --components-layout-badge-success-contrast-text-bullet: #e5e5e9;
535
+ --components-layout-badge-success-standard-border: rgba(255, 255, 255, 0);
536
+ --components-layout-badge-success-standard-bullet: #9cd9c2;
537
+ --components-layout-badge-success-standard-fill: #9cd9c2;
538
+ --components-layout-badge-success-standard-text: #08091c;
539
+ --components-layout-badge-success-standard-text-bullet: #e5e5e9;
540
+ --components-layout-badge-warning-contrast-border: rgba(255, 255, 255, 0);
541
+ --components-layout-badge-warning-contrast-bullet: #ffeeb3;
542
+ --components-layout-badge-warning-contrast-fill: #ffeeb3;
543
+ --components-layout-badge-warning-contrast-text: #08091c;
544
+ --components-layout-badge-warning-contrast-text-bullet: #e5e5e9;
545
+ --components-layout-badge-warning-standard-border: rgba(255, 255, 255, 0);
546
+ --components-layout-badge-warning-standard-bullet: #ffeeb3;
547
+ --components-layout-badge-warning-standard-fill: #ffeeb3;
548
+ --components-layout-badge-warning-standard-text: #08091c;
549
+ --components-layout-badge-warning-standard-text-bullet: #e5e5e9;
550
+ --components-layout-card-contrast-border-default: rgba(255, 255, 255, 0);
551
+ --components-layout-card-contrast-border-active: #b3b4bd;
552
+ --components-layout-card-contrast-divide: #ff9494;
553
+ --components-layout-card-contrast-fill-default: rgba(229, 229, 233, 0.1490196078);
554
+ --components-layout-card-contrast-fill-hoveractive: #393a49;
555
+ --components-layout-card-contrast-icon: #e5e5e9;
556
+ --components-layout-card-contrast-subjecttext: #b3b4bd;
557
+ --components-layout-card-contrast-text: #e5e5e9;
558
+ --components-layout-card-standard-border-default: rgba(255, 255, 255, 0);
559
+ --components-layout-card-standard-border-active: #b3b4bd;
560
+ --components-layout-card-standard-divide: #ff9494;
561
+ --components-layout-card-standard-fill-default: rgba(229, 229, 233, 0.1490196078);
562
+ --components-layout-card-standard-fill-hoveractive: #393a49;
563
+ --components-layout-card-standard-icon: #e5e5e9;
564
+ --components-layout-card-standard-subjecttext: #b3b4bd;
565
+ --components-layout-card-standard-text: #e5e5e9;
566
+ }
567
+
568
+ /* DO NOT CHANGE!*/
569
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
409
570
  /* DO NOT CHANGE!*/
410
571
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
411
572
  [data-color-mode=light],
412
573
  :root {
413
- --components-layout-badge-information-contrast-border: var(--stroke-colorless);
414
- --components-layout-badge-information-contrast-bullet: var(--fill-information-contrast);
415
- --components-layout-badge-information-contrast-fill: var(--fill-information-contrast);
416
- --components-layout-badge-information-contrast-text: var(--text-accent);
417
- --components-layout-badge-information-contrast-text-bullet: var(--text-light);
418
- --components-layout-badge-information-standard-border: var(--stroke-information);
419
- --components-layout-badge-information-standard-bullet: var(--fill-information-deep);
420
- --components-layout-badge-information-standard-fill: var(--fill-information-muted);
421
- --components-layout-badge-information-standard-text: var(--text-accent);
422
- --components-layout-badge-information-standard-text-bullet: var(--text-accent);
423
- --components-layout-badge-negative-contrast-border: var(--stroke-colorless);
424
- --components-layout-badge-negative-contrast-bullet: var(--fill-negative-contrast);
425
- --components-layout-badge-negative-contrast-fill: var(--fill-negative-tint);
426
- --components-layout-badge-negative-contrast-text: var(--text-accent);
427
- --components-layout-badge-negative-contrast-text-bullet: var(--text-light);
428
- --components-layout-badge-negative-standard-border: var(--stroke-negative);
429
- --components-layout-badge-negative-standard-bullet: var(--fill-negative-deep);
430
- --components-layout-badge-negative-standard-fill: var(--fill-negative-muted);
431
- --components-layout-badge-negative-standard-text: var(--text-accent);
432
- --components-layout-badge-negative-standard-text-bullet: var(--text-accent);
433
- --components-layout-badge-neutral-contrast-border: var(--stroke-colorless);
434
- --components-layout-badge-neutral-contrast-bullet: var(--fill-primary-hover-contrast);
435
- --components-layout-badge-neutral-contrast-fill: var(--fill-selected-hover-contrast);
436
- --components-layout-badge-neutral-contrast-text: var(--text-light);
437
- --components-layout-badge-neutral-contrast-text-bullet: var(--text-light);
438
- --components-layout-badge-neutral-standard-border: var(--stroke-neutralalt);
439
- --components-layout-badge-neutral-standard-bullet: var(--fill-selected-default-darkalt);
440
- --components-layout-badge-neutral-standard-fill: var(--fill-selected-default-light);
441
- --components-layout-badge-neutral-standard-text: var(--text-accent);
442
- --components-layout-badge-neutral-standard-text-bullet: var(--text-accent);
443
- --components-layout-badge-primary-contrast-bullet: var(--fill-primary-default-contrast);
444
- --components-layout-badge-primary-contrast-fill: var(--fill-primary-default-contrast);
445
- --components-layout-badge-primary-contrast-text: var(--text-accent);
446
- --components-layout-badge-primary-contrast-text-bullet: var(--text-light);
447
- --components-layout-badge-primary-standard-bullet: var(--fill-primary-default-light);
448
- --components-layout-badge-primary-standard-fill: var(--fill-primary-default-light);
449
- --components-layout-badge-primary-standard-text: var(--text-light);
450
- --components-layout-badge-primary-standard-text-bullet: var(--text-accent);
451
- --components-layout-badge-success-contrast-border: var(--stroke-colorless);
452
- --components-layout-badge-success-contrast-bullet: var(--fill-success-contrast);
453
- --components-layout-badge-success-contrast-fill: var(--fill-success-contrast);
454
- --components-layout-badge-success-contrast-text: var(--text-accent);
455
- --components-layout-badge-success-contrast-text-bullet: var(--text-light);
456
- --components-layout-badge-success-standard-border: var(--stroke-success);
457
- --components-layout-badge-success-standard-bullet: var(--fill-success-deep);
458
- --components-layout-badge-success-standard-fill: var(--fill-success-muted);
459
- --components-layout-badge-success-standard-text: var(--text-accent);
460
- --components-layout-badge-success-standard-text-bullet: var(--text-accent);
461
- --components-layout-badge-warning-contrast-border: var(--stroke-colorless);
462
- --components-layout-badge-warning-contrast-bullet: var(--fill-warning-contrast);
463
- --components-layout-badge-warning-contrast-fill: var(--fill-warning-contrast);
464
- --components-layout-badge-warning-contrast-text: var(--text-accent);
465
- --components-layout-badge-warning-contrast-text-bullet: var(--text-light);
466
- --components-layout-badge-warning-standard-border: var(--stroke-warning);
467
- --components-layout-badge-warning-standard-bullet: var(--fill-warning-deep);
468
- --components-layout-badge-warning-standard-fill: var(--fill-warning-muted);
469
- --components-layout-badge-warning-standard-text: var(--text-accent);
470
- --components-layout-badge-warning-standard-text-bullet: var(--text-accent);
471
- --components-layout-card-contrast-border-default: var(--stroke-colorless);
472
- --components-layout-card-contrast-border-active: var(--stroke-contrast);
473
- --components-layout-card-contrast-divide: var(--stroke-highlight);
474
- --components-layout-card-contrast-fill-default: var(--fill-selected-default-contrast);
475
- --components-layout-card-contrast-fill-hoveractive: var(--fill-selected-hover-contrast);
476
- --components-layout-card-contrast-icon: var(--shape-light);
477
- --components-layout-card-contrast-subjecttext: var(--text-subduedalt);
478
- --components-layout-card-contrast-text: var(--text-light);
479
- --components-layout-card-standard-border-default: var(--stroke-neutral);
480
- --components-layout-card-standard-border-active: var(--stroke-accent);
481
- --components-layout-card-standard-divide: var(--stroke-highlight);
482
- --components-layout-card-standard-fill-default: var(--fill-background-standard-light);
483
- --components-layout-card-standard-fill-hoveractive: var(--fill-background-tint-light);
484
- --components-layout-card-standard-icon: var(--shape-accent);
485
- --components-layout-card-standard-subjecttext: var(--text-subdued);
486
- --components-layout-card-standard-text: var(--text-accent);
574
+ --basecolors-frame-contrast: #181c56;
575
+ --basecolors-frame-contrastalt: #393d79;
576
+ --basecolors-frame-default: #ffffff;
577
+ --basecolors-frame-elevated: #ffffff;
578
+ --basecolors-frame-elevatedalt: #f6f6f9;
579
+ --basecolors-frame-subdued: #d9dae8;
580
+ --basecolors-frame-tint: #f6f6f9;
581
+ --basecolors-shape-accent: #181c56;
582
+ --basecolors-shape-bicycle-contrast: #00db9b;
583
+ --basecolors-shape-bicycle-default: #388f76;
584
+ --basecolors-shape-bus-contrast: #ff6392;
585
+ --basecolors-shape-bus-default: #c5044e;
586
+ --basecolors-shape-cableway-contrast: #b482fb;
587
+ --basecolors-shape-cableway-default: #78469a;
588
+ --basecolors-shape-disabled: #6e6f73;
589
+ --basecolors-shape-disabledalt: #b6b8ba;
590
+ --basecolors-shape-ferry-contrast: #6fdfff;
591
+ --basecolors-shape-ferry-default: #0c6693;
592
+ --basecolors-shape-funicular-contrast: #b482fb;
593
+ --basecolors-shape-funicular-default: #78469a;
594
+ --basecolors-shape-helicopter-contrast: #fbafea;
595
+ --basecolors-shape-helicopter-default: #800664;
596
+ --basecolors-shape-highlight: #ff5959;
597
+ --basecolors-shape-light: #ffffff;
598
+ --basecolors-shape-mask: #ffffff;
599
+ --basecolors-shape-maskalt: #ffffff;
600
+ --basecolors-shape-metro-contrast: #f08901;
601
+ --basecolors-shape-metro-default: #bf5826;
602
+ --basecolors-shape-mobility-contrast: #00db9b;
603
+ --basecolors-shape-mobility-default: #388f76;
604
+ --basecolors-shape-plane-contrast: #fbafea;
605
+ --basecolors-shape-plane-default: #800664;
606
+ --basecolors-shape-subdued: #626493;
607
+ --basecolors-shape-subduedalt: #d9dae8;
608
+ --basecolors-shape-taxi-contrast: #ffe082;
609
+ --basecolors-shape-taxi-default: #3d3e40;
610
+ --basecolors-shape-train-contrast: #42a5f5;
611
+ --basecolors-shape-train-default: #00367f;
612
+ --basecolors-shape-tram-contrast: #b482fb;
613
+ --basecolors-shape-tram-default: #78469a;
614
+ --basecolors-shape-walk-contrast: #8284ab;
615
+ --basecolors-shape-walk-default: #8d8e9c;
616
+ --basecolors-shape-airportlinkbus-contrast: #fbafea;
617
+ --basecolors-shape-airportlinkbus-default: #800664;
618
+ --basecolors-shape-airportlinkrail-contrast: #fbafea;
619
+ --basecolors-shape-airportlinkrail-default: #800664;
620
+ --basecolors-stroke-contrast: #aeb7e2;
621
+ --basecolors-stroke-default: #181c56;
622
+ --basecolors-stroke-disabled: #949699;
623
+ --basecolors-stroke-focus-contrast: #aeb7e2;
624
+ --basecolors-stroke-focus-standard: #181c56;
625
+ --basecolors-stroke-highlight: #ff5959;
626
+ --basecolors-stroke-light: #ffffff;
627
+ --basecolors-stroke-subdued: #8284ab;
628
+ --basecolors-stroke-subduedalt: #e3e6e8;
629
+ --basecolors-text-accent: #181c56;
630
+ --basecolors-text-disabled: #6e6f73;
631
+ --basecolors-text-disabledalt: #b6b8ba;
632
+ --basecolors-text-highlight: #ff5959;
633
+ --basecolors-text-light: #ffffff;
634
+ --basecolors-text-subdued: #626493;
635
+ --basecolors-text-subduedalt: #d9dae8;
487
636
  }
488
637
 
489
638
  [data-color-mode=dark] {
490
- --components-layout-badge-information-contrast-border: var(--stroke-colorless);
491
- --components-layout-badge-information-contrast-bullet: var(--fill-information-tint);
492
- --components-layout-badge-information-contrast-fill: var(--fill-information-tint);
493
- --components-layout-badge-information-contrast-text: var(--text-dark);
494
- --components-layout-badge-information-contrast-text-bullet: var(--text-lightalt);
495
- --components-layout-badge-information-standard-border: var(--stroke-colorless);
496
- --components-layout-badge-information-standard-bullet: var(--fill-information-tint);
497
- --components-layout-badge-information-standard-fill: var(--fill-information-tint);
498
- --components-layout-badge-information-standard-text: var(--text-dark);
499
- --components-layout-badge-information-standard-text-bullet: var(--text-lightalt);
500
- --components-layout-badge-negative-contrast-border: var(--stroke-colorless);
501
- --components-layout-badge-negative-contrast-bullet: var(--fill-negative-tint);
502
- --components-layout-badge-negative-contrast-fill: var(--fill-negative-muted);
503
- --components-layout-badge-negative-contrast-text: var(--text-dark);
504
- --components-layout-badge-negative-contrast-text-bullet: var(--text-lightalt);
505
- --components-layout-badge-negative-standard-border: var(--stroke-colorless);
506
- --components-layout-badge-negative-standard-bullet: var(--fill-negative-tint);
507
- --components-layout-badge-negative-standard-fill: var(--fill-negative-muted);
508
- --components-layout-badge-negative-standard-text: var(--text-dark);
509
- --components-layout-badge-negative-standard-text-bullet: var(--text-lightalt);
510
- --components-layout-badge-neutral-contrast-border: var(--stroke-colorless);
511
- --components-layout-badge-neutral-contrast-bullet: var(--fill-selected-default-dark);
512
- --components-layout-badge-neutral-contrast-fill: var(--fill-selected-hover-dark);
513
- --components-layout-badge-neutral-contrast-text: var(--text-lightalt);
514
- --components-layout-badge-neutral-contrast-text-bullet: var(--text-lightalt);
515
- --components-layout-badge-neutral-standard-border: var(--stroke-colorless);
516
- --components-layout-badge-neutral-standard-bullet: var(--fill-selected-default-dark);
517
- --components-layout-badge-neutral-standard-fill: var(--fill-selected-hover-dark);
518
- --components-layout-badge-neutral-standard-text: var(--text-lightalt);
519
- --components-layout-badge-neutral-standard-text-bullet: var(--text-lightalt);
520
- --components-layout-badge-primary-contrast-bullet: var(--fill-primary-default-contrast);
521
- --components-layout-badge-primary-contrast-fill: var(--fill-primary-default-contrast);
522
- --components-layout-badge-primary-contrast-text: var(--text-dark);
523
- --components-layout-badge-primary-contrast-text-bullet: var(--text-lightalt);
524
- --components-layout-badge-primary-standard-bullet: var(--fill-primary-default-contrast);
525
- --components-layout-badge-primary-standard-fill: var(--fill-primary-default-contrast);
526
- --components-layout-badge-primary-standard-text: var(--text-dark);
527
- --components-layout-badge-primary-standard-text-bullet: var(--text-lightalt);
528
- --components-layout-badge-success-contrast-border: var(--stroke-colorless);
529
- --components-layout-badge-success-contrast-bullet: var(--fill-success-tint);
530
- --components-layout-badge-success-contrast-fill: var(--fill-success-tint);
531
- --components-layout-badge-success-contrast-text: var(--text-dark);
532
- --components-layout-badge-success-contrast-text-bullet: var(--text-lightalt);
533
- --components-layout-badge-success-standard-border: var(--stroke-colorless);
534
- --components-layout-badge-success-standard-bullet: var(--fill-success-tint);
535
- --components-layout-badge-success-standard-fill: var(--fill-success-tint);
536
- --components-layout-badge-success-standard-text: var(--text-dark);
537
- --components-layout-badge-success-standard-text-bullet: var(--text-lightalt);
538
- --components-layout-badge-warning-contrast-border: var(--stroke-colorless);
539
- --components-layout-badge-warning-contrast-bullet: var(--fill-warning-tint);
540
- --components-layout-badge-warning-contrast-fill: var(--fill-warning-tint);
541
- --components-layout-badge-warning-contrast-text: var(--text-dark);
542
- --components-layout-badge-warning-contrast-text-bullet: var(--text-lightalt);
543
- --components-layout-badge-warning-standard-border: var(--stroke-colorless);
544
- --components-layout-badge-warning-standard-bullet: var(--fill-warning-tint);
545
- --components-layout-badge-warning-standard-fill: var(--fill-warning-tint);
546
- --components-layout-badge-warning-standard-text: var(--text-dark);
547
- --components-layout-badge-warning-standard-text-bullet: var(--text-lightalt);
548
- --components-layout-card-contrast-border-default: var(--stroke-colorless);
549
- --components-layout-card-contrast-border-active: var(--stroke-dark);
550
- --components-layout-card-contrast-divide: var(--stroke-highlightalt);
551
- --components-layout-card-contrast-fill-default: var(--fill-background-overlay-transparent);
552
- --components-layout-card-contrast-fill-hoveractive: var(--fill-background-overlay-solid);
553
- --components-layout-card-contrast-icon: var(--shape-lightalt);
554
- --components-layout-card-contrast-subjecttext: var(--text-darkalt);
555
- --components-layout-card-contrast-text: var(--text-lightalt);
556
- --components-layout-card-standard-border-default: var(--stroke-colorless);
557
- --components-layout-card-standard-border-active: var(--stroke-dark);
558
- --components-layout-card-standard-divide: var(--stroke-highlightalt);
559
- --components-layout-card-standard-fill-default: var(--fill-background-overlay-transparent);
560
- --components-layout-card-standard-fill-hoveractive: var(--fill-background-overlay-solid);
561
- --components-layout-card-standard-icon: var(--shape-lightalt);
562
- --components-layout-card-standard-subjecttext: var(--text-darkalt);
563
- --components-layout-card-standard-text: var(--text-lightalt);
639
+ --basecolors-frame-contrast: #212233;
640
+ --basecolors-frame-contrastalt: #141527;
641
+ --basecolors-frame-default: #08091c;
642
+ --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
643
+ --basecolors-frame-elevatedalt: #464755;
644
+ --basecolors-frame-subdued: #2d2e3e;
645
+ --basecolors-frame-tint: #141527;
646
+ --basecolors-shape-accent: #e5e5e9;
647
+ --basecolors-shape-bicycle-contrast: #4db295;
648
+ --basecolors-shape-bicycle-default: #4db295;
649
+ --basecolors-shape-bus-contrast: #e87a9b;
650
+ --basecolors-shape-bus-default: #e87a9b;
651
+ --basecolors-shape-cableway-contrast: #b898e5;
652
+ --basecolors-shape-cableway-default: #b898e5;
653
+ --basecolors-shape-disabled: #b6b8ba;
654
+ --basecolors-shape-disabledalt: #b3b4bd;
655
+ --basecolors-shape-ferry-contrast: #8ccfe2;
656
+ --basecolors-shape-ferry-default: #8ccfe2;
657
+ --basecolors-shape-funicular-contrast: #b898e5;
658
+ --basecolors-shape-funicular-default: #b898e5;
659
+ --basecolors-shape-helicopter-contrast: #f2b8e5;
660
+ --basecolors-shape-helicopter-default: #f2b8e5;
661
+ --basecolors-shape-highlight: #ff9494;
662
+ --basecolors-shape-light: #e5e5e9;
663
+ --basecolors-shape-mask: #2d2e3e;
664
+ --basecolors-shape-maskalt: #393a49;
665
+ --basecolors-shape-metro-contrast: #dd973c;
666
+ --basecolors-shape-metro-default: #dd973c;
667
+ --basecolors-shape-mobility-contrast: #4db295;
668
+ --basecolors-shape-mobility-default: #4db295;
669
+ --basecolors-shape-plane-contrast: #f2b8e5;
670
+ --basecolors-shape-plane-default: #f2b8e5;
671
+ --basecolors-shape-subdued: #b3b4bd;
672
+ --basecolors-shape-subduedalt: #b3b4bd;
673
+ --basecolors-shape-taxi-contrast: #ffe082;
674
+ --basecolors-shape-taxi-default: #ffe082;
675
+ --basecolors-shape-train-contrast: #60a2d7;
676
+ --basecolors-shape-train-default: #60a2d7;
677
+ --basecolors-shape-tram-contrast: #b898e5;
678
+ --basecolors-shape-tram-default: #b898e5;
679
+ --basecolors-shape-walk-contrast: #8d8e9c;
680
+ --basecolors-shape-walk-default: #8d8e9c;
681
+ --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
682
+ --basecolors-shape-airportlinkbus-default: #f2b8e5;
683
+ --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
684
+ --basecolors-shape-airportlinkrail-default: #f2b8e5;
685
+ --basecolors-stroke-contrast: #aeb7e2;
686
+ --basecolors-stroke-default: #b3b4bd;
687
+ --basecolors-stroke-disabled: #e3e6e8;
688
+ --basecolors-stroke-focus-contrast: #aeb7e2;
689
+ --basecolors-stroke-focus-standard: #aeb7e2;
690
+ --basecolors-stroke-highlight: #ff9494;
691
+ --basecolors-stroke-light: #b3b4bd;
692
+ --basecolors-stroke-subdued: #81828f;
693
+ --basecolors-stroke-subduedalt: #81828f;
694
+ --basecolors-text-accent: #e5e5e9;
695
+ --basecolors-text-disabled: #b6b8ba;
696
+ --basecolors-text-disabledalt: #b6b8ba;
697
+ --basecolors-text-highlight: #ff9494;
698
+ --basecolors-text-light: #e5e5e9;
699
+ --basecolors-text-subdued: #b3b4bd;
700
+ --basecolors-text-subduedalt: #b3b4bd;
564
701
  }
565
702
 
566
703
  :root {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/layout",
3
- "version": "2.2.3",
3
+ "version": "2.2.4",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/layout.esm.js",
@@ -27,11 +27,11 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/icons": "^6.15.3",
31
- "@entur/tokens": "^3.13.2",
32
- "@entur/typography": "^1.8.27",
33
- "@entur/utils": "^0.10.0",
30
+ "@entur/icons": "^6.15.4",
31
+ "@entur/tokens": "^3.13.3",
32
+ "@entur/typography": "^1.8.28",
33
+ "@entur/utils": "^0.10.1",
34
34
  "classnames": "^2.3.1"
35
35
  },
36
- "gitHead": "427e66ba68d33b8d1839714a48517b52afd5c2db"
36
+ "gitHead": "89d5de6d31962e236a5c147e129bf915576166b4"
37
37
  }