@entur/menu 4.1.47 → 4.1.49

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 +123 -123
  2. package/package.json +9 -9
package/dist/styles.css CHANGED
@@ -50,6 +50,55 @@
50
50
  }
51
51
  /* DO NOT CHANGE!*/
52
52
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
53
+ .eds-top-navigation-item {
54
+ --show-active-line: 0;
55
+ display: inline-block;
56
+ cursor: pointer;
57
+ color: inherit;
58
+ text-decoration: none;
59
+ position: relative;
60
+ padding: 1rem;
61
+ min-width: 5rem;
62
+ width: -moz-fit-content;
63
+ width: fit-content;
64
+ text-align: center;
65
+ font-family: inherit;
66
+ font-size: 1rem;
67
+ font-weight: 600;
68
+ }
69
+ .eds-top-navigation-item::after {
70
+ content: "";
71
+ display: block;
72
+ bottom: 1rem;
73
+ height: 0.1875rem;
74
+ width: 0;
75
+ margin: 0 auto;
76
+ opacity: var(--show-active-line);
77
+ background: #ff5959;
78
+ transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
79
+ }
80
+ .eds-top-navigation-item:focus {
81
+ outline-offset: 0.125rem;
82
+ outline: none;
83
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
84
+ }
85
+ .eds-contrast .eds-top-navigation-item:focus {
86
+ box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
87
+ }
88
+ .eds-top-navigation-item:hover {
89
+ --show-active-line: 1;
90
+ }
91
+ .eds-top-navigation-item:hover::after {
92
+ width: 2rem;
93
+ }
94
+ .eds-top-navigation-item--active {
95
+ --show-active-line: 1;
96
+ }
97
+ .eds-top-navigation-item--active::after {
98
+ width: 2rem;
99
+ }
100
+ /* DO NOT CHANGE!*/
101
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
53
102
  .eds-pagination {
54
103
  align-items: center;
55
104
  display: flex;
@@ -430,52 +479,89 @@
430
479
  }
431
480
  /* DO NOT CHANGE!*/
432
481
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
433
- .eds-top-navigation-item {
434
- --show-active-line: 0;
435
- display: inline-block;
436
- cursor: pointer;
437
- color: inherit;
438
- text-decoration: none;
439
- position: relative;
440
- padding: 1rem;
441
- min-width: 5rem;
442
- width: -moz-fit-content;
443
- width: fit-content;
444
- text-align: center;
482
+ .eds-overflow-menu__item {
483
+ -webkit-appearance: none;
484
+ -moz-appearance: none;
485
+ appearance: none;
486
+ border: none;
487
+ font-size: 0.875rem;
445
488
  font-family: inherit;
446
- font-size: 1rem;
447
- font-weight: 600;
448
- }
449
- .eds-top-navigation-item::after {
450
- content: "";
489
+ color: var(--primary-text-color);
490
+ background: #f8f8f8;
451
491
  display: block;
452
- bottom: 1rem;
453
- height: 0.1875rem;
454
- width: 0;
455
- margin: 0 auto;
456
- opacity: var(--show-active-line);
457
- background: #ff5959;
458
- transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
492
+ height: 3rem;
493
+ cursor: pointer;
494
+ width: 100%;
495
+ line-height: 1.375rem;
496
+ text-align: left;
497
+ padding: 0.75rem 1rem;
498
+ opacity: 1;
459
499
  }
460
- .eds-top-navigation-item:focus {
461
- outline-offset: 0.125rem;
500
+ .eds-contrast .eds-overflow-menu__item {
501
+ color: #181c56;
502
+ }
503
+ .eds-overflow-menu__item.eds-overflow-menu__item--disabled {
504
+ background: #e9e9e9;
505
+ color: #949494;
506
+ }
507
+ .eds-contrast .eds-overflow-menu__item.eds-overflow-menu__item--disabled {
508
+ background: #e9e9e9;
509
+ color: #949494;
510
+ }
511
+ .eds-overflow-menu__item.eds-overflow-menu__item--disabled:hover {
512
+ cursor: not-allowed;
513
+ background: #e9e9e9;
514
+ color: #949494;
515
+ }
516
+ .eds-overflow-menu__item .eds-icon {
517
+ margin-right: 0.75rem;
518
+ }
519
+ .eds-overflow-menu__item:hover, .eds-overflow-menu__item:focus, .eds-overflow-menu__item[data-selected] {
520
+ background: #d1d4e3;
521
+ }
522
+ .eds-overflow-menu__item:focus {
462
523
  outline: none;
463
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
464
524
  }
465
- .eds-contrast .eds-top-navigation-item:focus {
466
- box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
525
+
526
+ .eds-overflow-menu__item + .eds-overflow-menu__item {
527
+ border-top: 0.0625rem solid #e9e9e9;
467
528
  }
468
- .eds-top-navigation-item:hover {
469
- --show-active-line: 1;
529
+
530
+ .eds-overflow-menu__menu-list[data-reach-menu-list] {
531
+ border: 0.0625rem solid #e9e9e9;
532
+ border-radius: 0.25rem;
533
+ box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
534
+ overflow: hidden;
470
535
  }
471
- .eds-top-navigation-item:hover::after {
472
- width: 2rem;
536
+ .eds-overflow-menu__menu-list[data-reach-menu-list]:focus {
537
+ outline: none;
473
538
  }
474
- .eds-top-navigation-item--active {
475
- --show-active-line: 1;
539
+ .eds-overflow-menu__menu-list[data-reach-menu-list].eds-contrast {
540
+ box-shadow: 0 0.0625rem 0.1875rem rgb(57, 61, 121);
476
541
  }
477
- .eds-top-navigation-item--active::after {
478
- width: 2rem;
542
+
543
+ .eds-overflow-menu__menu-list[data-reach-menu-list],
544
+ .eds-overflow-menu__menu-list[data-reach-menu-items] {
545
+ animation: slide-in 0.2s ease-in-out;
546
+ }
547
+
548
+ @keyframes slide-in {
549
+ 0% {
550
+ opacity: 0;
551
+ transform: translateY(0.5rem);
552
+ }
553
+ 100% {
554
+ opacity: 1;
555
+ transform: translateY(0);
556
+ }
557
+ }
558
+ [data-reach-menu-popover] {
559
+ position: absolute;
560
+ z-index: 30;
561
+ }
562
+ [data-reach-menu-popover] .eds-overflow-menu__menu-list--left {
563
+ position: relative;
564
+ right: calc(100% - 2rem);
479
565
  }
480
566
  /* DO NOT CHANGE!*/
481
567
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
@@ -596,89 +682,3 @@
596
682
  .eds-contrast .eds-stepper__item__square--has-been {
597
683
  background: #aeb7e2;
598
684
  }
599
- /* DO NOT CHANGE!*/
600
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
601
- .eds-overflow-menu__item {
602
- -webkit-appearance: none;
603
- -moz-appearance: none;
604
- appearance: none;
605
- border: none;
606
- font-size: 0.875rem;
607
- font-family: inherit;
608
- color: var(--primary-text-color);
609
- background: #f8f8f8;
610
- display: block;
611
- height: 3rem;
612
- cursor: pointer;
613
- width: 100%;
614
- line-height: 1.375rem;
615
- text-align: left;
616
- padding: 0.75rem 1rem;
617
- opacity: 1;
618
- }
619
- .eds-contrast .eds-overflow-menu__item {
620
- color: #181c56;
621
- }
622
- .eds-overflow-menu__item.eds-overflow-menu__item--disabled {
623
- background: #e9e9e9;
624
- color: #949494;
625
- }
626
- .eds-contrast .eds-overflow-menu__item.eds-overflow-menu__item--disabled {
627
- background: #e9e9e9;
628
- color: #949494;
629
- }
630
- .eds-overflow-menu__item.eds-overflow-menu__item--disabled:hover {
631
- cursor: not-allowed;
632
- background: #e9e9e9;
633
- color: #949494;
634
- }
635
- .eds-overflow-menu__item .eds-icon {
636
- margin-right: 0.75rem;
637
- }
638
- .eds-overflow-menu__item:hover, .eds-overflow-menu__item:focus, .eds-overflow-menu__item[data-selected] {
639
- background: #d1d4e3;
640
- }
641
- .eds-overflow-menu__item:focus {
642
- outline: none;
643
- }
644
-
645
- .eds-overflow-menu__item + .eds-overflow-menu__item {
646
- border-top: 0.0625rem solid #e9e9e9;
647
- }
648
-
649
- .eds-overflow-menu__menu-list[data-reach-menu-list] {
650
- border: 0.0625rem solid #e9e9e9;
651
- border-radius: 0.25rem;
652
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
653
- overflow: hidden;
654
- }
655
- .eds-overflow-menu__menu-list[data-reach-menu-list]:focus {
656
- outline: none;
657
- }
658
- .eds-overflow-menu__menu-list[data-reach-menu-list].eds-contrast {
659
- box-shadow: 0 0.0625rem 0.1875rem rgb(57, 61, 121);
660
- }
661
-
662
- .eds-overflow-menu__menu-list[data-reach-menu-list],
663
- .eds-overflow-menu__menu-list[data-reach-menu-items] {
664
- animation: slide-in 0.2s ease-in-out;
665
- }
666
-
667
- @keyframes slide-in {
668
- 0% {
669
- opacity: 0;
670
- transform: translateY(0.5rem);
671
- }
672
- 100% {
673
- opacity: 1;
674
- transform: translateY(0);
675
- }
676
- }
677
- [data-reach-menu-popover] {
678
- position: absolute;
679
- z-index: 30;
680
- }
681
- [data-reach-menu-popover] .eds-overflow-menu__menu-list--left {
682
- position: relative;
683
- right: calc(100% - 2rem);
684
- }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/menu",
3
- "version": "4.1.47",
3
+ "version": "4.1.49",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/menu.esm.js",
@@ -27,17 +27,17 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/a11y": "^0.2.68",
31
- "@entur/button": "^3.0.13",
32
- "@entur/expand": "^3.4.6",
33
- "@entur/icons": "^6.4.1",
34
- "@entur/layout": "^2.1.38",
30
+ "@entur/a11y": "^0.2.69",
31
+ "@entur/button": "^3.1.1",
32
+ "@entur/expand": "^3.4.8",
33
+ "@entur/icons": "^6.4.2",
34
+ "@entur/layout": "^2.1.40",
35
35
  "@entur/tokens": "^3.10.0",
36
- "@entur/typography": "^1.8.5",
37
- "@entur/utils": "^0.9.3",
36
+ "@entur/typography": "^1.8.7",
37
+ "@entur/utils": "^0.9.4",
38
38
  "@reach/menu-button": "^0.16.1",
39
39
  "@reach/polymorphic": "0.18.0",
40
40
  "classnames": "^2.3.1"
41
41
  },
42
- "gitHead": "113113f32a331fcd5f01d20e2c47ae2f2b73b93e"
42
+ "gitHead": "0da1a9e2532f60cc1a456a79ad3aa689514ca2c7"
43
43
  }