@entur/menu 4.1.20 → 4.1.21

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/styles.css CHANGED
@@ -57,225 +57,6 @@
57
57
  font-weight: 600;
58
58
  }/* DO NOT CHANGE!*/
59
59
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
60
- /* DO NOT CHANGE!*/
61
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
62
- .eds-side-navigation,
63
- .eds-side-navigation-group {
64
- --primary-background-color: #f8f8f8;
65
- --primary-text-color: #181c56;
66
- }
67
- .eds-contrast .eds-side-navigation,
68
- .eds-contrast .eds-side-navigation-group {
69
- --primary-background-color: #181c56;
70
- --primary-text-color: colors-brand-white;
71
- }
72
-
73
- .eds-side-navigation__click-target svg {
74
- margin-right: 1rem;
75
- color: #656782;
76
- display: inline-flex;
77
- align-self: center;
78
- position: relative;
79
- top: 0.075em;
80
- }
81
- .eds-contrast .eds-side-navigation__click-target svg {
82
- color: #aeb7e2;
83
- }
84
-
85
- .eds-side-navigation__click-target[disabled] svg {
86
- color: #656782;
87
- }
88
-
89
- .eds-side-navigation {
90
- --padding-vertical: 1rem;
91
- --padding-horizontal: 2.5rem;
92
- background-color: var(--primary-background-color);
93
- color: var(--primary-text-color);
94
- padding: 0;
95
- margin: 0;
96
- list-style: none;
97
- position: relative;
98
- transition: max-width ease-in-out 0.2s;
99
- }
100
- .eds-side-navigation__collapse-button {
101
- position: absolute;
102
- right: -0.75rem;
103
- height: 1.5rem;
104
- width: 1.5rem;
105
- border-radius: 50%;
106
- cursor: pointer;
107
- background: #ffffff;
108
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
109
- border: 0.0625rem solid #d1d3d3;
110
- color: inherit;
111
- padding: 0;
112
- display: flex;
113
- align-items: center;
114
- justify-content: center;
115
- border: none;
116
- z-index: 10;
117
- }
118
- .eds-contrast .eds-side-navigation__collapse-button {
119
- background: #393d79;
120
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
121
- border-color: transparent;
122
- }
123
- .eds-side-navigation__collapse-button svg {
124
- margin: 0;
125
- top: 0;
126
- color: #181c56;
127
- }
128
- .eds-contrast .eds-side-navigation__collapse-button svg {
129
- color: #ffffff;
130
- }
131
- .eds-side-navigation__collapse-button:focus {
132
- outline: 2px solid #181c56;
133
- }
134
- .eds-contrast .eds-side-navigation__collapse-button:focus {
135
- outline: 2px solid #ffffff;
136
- }
137
- @media screen and (min-width: 50rem) {
138
- .eds-side-navigation {
139
- max-width: 26rem;
140
- }
141
- }
142
- .eds-side-navigation--small {
143
- --padding-vertical: calc(0.5rem + 0.1875rem);
144
- }
145
- .eds-side-navigation .eds-side-navigation {
146
- background-color: #f3f3f3;
147
- }
148
- .eds-contrast .eds-side-navigation .eds-side-navigation {
149
- background-color: #292b6a;
150
- }
151
- .eds-side-navigation--collapsed {
152
- max-width: 80px;
153
- }
154
-
155
- .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target {
156
- padding-left: 3.5rem;
157
- box-shadow: none;
158
- }
159
- .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target--active {
160
- background-color: #d1d4e3;
161
- }
162
- .eds-contrast .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target--active {
163
- background-color: #54568c;
164
- }
165
-
166
- .eds-side-navigation__click-target {
167
- -webkit-appearance: none;
168
- -moz-appearance: none;
169
- appearance: none;
170
- background: none;
171
- border: 0;
172
- border-bottom: 0.125rem solid #e9e9e9;
173
- border-radius: 0;
174
- color: var(--primary-text-color);
175
- cursor: pointer;
176
- display: block;
177
- font-family: inherit;
178
- font-size: inherit;
179
- font-weight: 500;
180
- line-height: inherit;
181
- padding: var(--padding-vertical) 2.5rem;
182
- padding-left: 2.5rem;
183
- transition: padding 0.2s ease-in-out;
184
- text-align: left;
185
- text-decoration: none;
186
- width: 100%;
187
- }
188
- .eds-contrast .eds-side-navigation__click-target {
189
- border-color: #292b6a;
190
- }
191
- .eds-side-navigation--collapsed .eds-side-navigation__click-target {
192
- padding-left: 2rem;
193
- }
194
- .eds-side-navigation__click-target--active {
195
- box-shadow: inset 0.25rem 0 0 #181c56;
196
- font-weight: 600;
197
- }
198
- .eds-contrast .eds-side-navigation__click-target--active {
199
- box-shadow: inset 0.25rem 0 0 #ff5959;
200
- }
201
- .eds-side-navigation__click-target[disabled] {
202
- cursor: not-allowed;
203
- color: #656782;
204
- }
205
- .eds-side-navigation__click-target:not([disabled]):hover {
206
- background-color: #d1d4e3;
207
- }
208
- .eds-contrast .eds-side-navigation__click-target:not([disabled]):hover {
209
- background-color: #393d79;
210
- }
211
- .eds-side-navigation__click-target:not([disabled]):active, .eds-side-navigation__click-target:not([disabled]):focus {
212
- outline: 2px solid #181c56;
213
- outline-offset: -2px;
214
- background: #ebebf1;
215
- }
216
- .eds-contrast .eds-side-navigation__click-target:not([disabled]):active, .eds-contrast .eds-side-navigation__click-target:not([disabled]):focus {
217
- background-color: #54568c;
218
- outline: 2px solid #ffffff;
219
- }
220
-
221
- .eds-side-navigation-group {
222
- background-color: var(--primary-background-color);
223
- color: var(--primary-text-color);
224
- }
225
- .eds-side-navigation-group + .eds-side-navigation-group {
226
- padding-top: 0.5rem;
227
- }
228
- @media screen and (min-width: 50rem) {
229
- .eds-side-navigation-group {
230
- max-width: 26rem;
231
- }
232
- }
233
-
234
- .eds-side-navigation-group__trigger {
235
- align-items: center;
236
- -webkit-appearance: none;
237
- -moz-appearance: none;
238
- appearance: none;
239
- background: none;
240
- border: none;
241
- border-radius: 0;
242
- border-bottom: 0.125rem solid #e9e9e9;
243
- color: #656782;
244
- cursor: pointer;
245
- display: flex;
246
- font-size: 0.875rem;
247
- font-family: inherit;
248
- font-weight: 500;
249
- height: 3rem;
250
- justify-content: space-between;
251
- letter-spacing: 1px;
252
- line-height: 1.25rem;
253
- padding: 0.75rem 0 0.75rem 2.5rem;
254
- margin: 0;
255
- text-transform: uppercase;
256
- transition: padding 0.2s ease-in-out;
257
- width: 100%;
258
- }
259
- .eds-contrast .eds-side-navigation-group__trigger {
260
- color: #aeb7e2;
261
- border-color: #292b6a;
262
- }
263
- .eds-side-navigation-group__trigger-icon {
264
- margin-right: 0.75rem;
265
- }
266
- .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
267
- margin-right: 2.5rem;
268
- }
269
- .eds-side-navigation--collapsed .eds-side-navigation-group__trigger {
270
- padding-left: 2rem;
271
- }
272
- .eds-side-navigation-group__trigger:focus {
273
- outline: 2px solid #181c56;
274
- }
275
- .eds-contrast .eds-side-navigation-group__trigger:focus {
276
- outline: 2px solid #ffffff;
277
- }/* DO NOT CHANGE!*/
278
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
279
60
  .eds-top-navigation-item {
280
61
  --show-active-line: 0;
281
62
  display: inline-block;
@@ -695,4 +476,223 @@
695
476
  -webkit-appearance: none;
696
477
  appearance: none;
697
478
  margin: 0;
479
+ }/* DO NOT CHANGE!*/
480
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
481
+ /* DO NOT CHANGE!*/
482
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
483
+ .eds-side-navigation,
484
+ .eds-side-navigation-group {
485
+ --primary-background-color: #f8f8f8;
486
+ --primary-text-color: #181c56;
487
+ }
488
+ .eds-contrast .eds-side-navigation,
489
+ .eds-contrast .eds-side-navigation-group {
490
+ --primary-background-color: #181c56;
491
+ --primary-text-color: colors-brand-white;
492
+ }
493
+
494
+ .eds-side-navigation__click-target svg {
495
+ margin-right: 1rem;
496
+ color: #656782;
497
+ display: inline-flex;
498
+ align-self: center;
499
+ position: relative;
500
+ top: 0.075em;
501
+ }
502
+ .eds-contrast .eds-side-navigation__click-target svg {
503
+ color: #aeb7e2;
504
+ }
505
+
506
+ .eds-side-navigation__click-target[disabled] svg {
507
+ color: #656782;
508
+ }
509
+
510
+ .eds-side-navigation {
511
+ --padding-vertical: 1rem;
512
+ --padding-horizontal: 2.5rem;
513
+ background-color: var(--primary-background-color);
514
+ color: var(--primary-text-color);
515
+ padding: 0;
516
+ margin: 0;
517
+ list-style: none;
518
+ position: relative;
519
+ transition: max-width ease-in-out 0.2s;
520
+ }
521
+ .eds-side-navigation__collapse-button {
522
+ position: absolute;
523
+ right: -0.75rem;
524
+ height: 1.5rem;
525
+ width: 1.5rem;
526
+ border-radius: 50%;
527
+ cursor: pointer;
528
+ background: #ffffff;
529
+ box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
530
+ border: 0.0625rem solid #d1d3d3;
531
+ color: inherit;
532
+ padding: 0;
533
+ display: flex;
534
+ align-items: center;
535
+ justify-content: center;
536
+ border: none;
537
+ z-index: 10;
538
+ }
539
+ .eds-contrast .eds-side-navigation__collapse-button {
540
+ background: #393d79;
541
+ box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
542
+ border-color: transparent;
543
+ }
544
+ .eds-side-navigation__collapse-button svg {
545
+ margin: 0;
546
+ top: 0;
547
+ color: #181c56;
548
+ }
549
+ .eds-contrast .eds-side-navigation__collapse-button svg {
550
+ color: #ffffff;
551
+ }
552
+ .eds-side-navigation__collapse-button:focus {
553
+ outline: 2px solid #181c56;
554
+ }
555
+ .eds-contrast .eds-side-navigation__collapse-button:focus {
556
+ outline: 2px solid #ffffff;
557
+ }
558
+ @media screen and (min-width: 50rem) {
559
+ .eds-side-navigation {
560
+ max-width: 26rem;
561
+ }
562
+ }
563
+ .eds-side-navigation--small {
564
+ --padding-vertical: calc(0.5rem + 0.1875rem);
565
+ }
566
+ .eds-side-navigation .eds-side-navigation {
567
+ background-color: #f3f3f3;
568
+ }
569
+ .eds-contrast .eds-side-navigation .eds-side-navigation {
570
+ background-color: #292b6a;
571
+ }
572
+ .eds-side-navigation--collapsed {
573
+ max-width: 80px;
574
+ }
575
+
576
+ .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target {
577
+ padding-left: 3.5rem;
578
+ box-shadow: none;
579
+ }
580
+ .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target--active {
581
+ background-color: #d1d4e3;
582
+ }
583
+ .eds-contrast .eds-side-navigation .eds-side-navigation .eds-side-navigation__click-target--active {
584
+ background-color: #54568c;
585
+ }
586
+
587
+ .eds-side-navigation__click-target {
588
+ -webkit-appearance: none;
589
+ -moz-appearance: none;
590
+ appearance: none;
591
+ background: none;
592
+ border: 0;
593
+ border-bottom: 0.125rem solid #e9e9e9;
594
+ border-radius: 0;
595
+ color: var(--primary-text-color);
596
+ cursor: pointer;
597
+ display: block;
598
+ font-family: inherit;
599
+ font-size: inherit;
600
+ font-weight: 500;
601
+ line-height: inherit;
602
+ padding: var(--padding-vertical) 2.5rem;
603
+ padding-left: 2.5rem;
604
+ transition: padding 0.2s ease-in-out;
605
+ text-align: left;
606
+ text-decoration: none;
607
+ width: 100%;
608
+ }
609
+ .eds-contrast .eds-side-navigation__click-target {
610
+ border-color: #292b6a;
611
+ }
612
+ .eds-side-navigation--collapsed .eds-side-navigation__click-target {
613
+ padding-left: 2rem;
614
+ }
615
+ .eds-side-navigation__click-target--active {
616
+ box-shadow: inset 0.25rem 0 0 #181c56;
617
+ font-weight: 600;
618
+ }
619
+ .eds-contrast .eds-side-navigation__click-target--active {
620
+ box-shadow: inset 0.25rem 0 0 #ff5959;
621
+ }
622
+ .eds-side-navigation__click-target[disabled] {
623
+ cursor: not-allowed;
624
+ color: #656782;
625
+ }
626
+ .eds-side-navigation__click-target:not([disabled]):hover {
627
+ background-color: #d1d4e3;
628
+ }
629
+ .eds-contrast .eds-side-navigation__click-target:not([disabled]):hover {
630
+ background-color: #393d79;
631
+ }
632
+ .eds-side-navigation__click-target:not([disabled]):active, .eds-side-navigation__click-target:not([disabled]):focus {
633
+ outline: 2px solid #181c56;
634
+ outline-offset: -2px;
635
+ background: #ebebf1;
636
+ }
637
+ .eds-contrast .eds-side-navigation__click-target:not([disabled]):active, .eds-contrast .eds-side-navigation__click-target:not([disabled]):focus {
638
+ background-color: #54568c;
639
+ outline: 2px solid #ffffff;
640
+ }
641
+
642
+ .eds-side-navigation-group {
643
+ background-color: var(--primary-background-color);
644
+ color: var(--primary-text-color);
645
+ }
646
+ .eds-side-navigation-group + .eds-side-navigation-group {
647
+ padding-top: 0.5rem;
648
+ }
649
+ @media screen and (min-width: 50rem) {
650
+ .eds-side-navigation-group {
651
+ max-width: 26rem;
652
+ }
653
+ }
654
+
655
+ .eds-side-navigation-group__trigger {
656
+ align-items: center;
657
+ -webkit-appearance: none;
658
+ -moz-appearance: none;
659
+ appearance: none;
660
+ background: none;
661
+ border: none;
662
+ border-radius: 0;
663
+ border-bottom: 0.125rem solid #e9e9e9;
664
+ color: #656782;
665
+ cursor: pointer;
666
+ display: flex;
667
+ font-size: 0.875rem;
668
+ font-family: inherit;
669
+ font-weight: 500;
670
+ height: 3rem;
671
+ justify-content: space-between;
672
+ letter-spacing: 1px;
673
+ line-height: 1.25rem;
674
+ padding: 0.75rem 0 0.75rem 2.5rem;
675
+ margin: 0;
676
+ text-transform: uppercase;
677
+ transition: padding 0.2s ease-in-out;
678
+ width: 100%;
679
+ }
680
+ .eds-contrast .eds-side-navigation-group__trigger {
681
+ color: #aeb7e2;
682
+ border-color: #292b6a;
683
+ }
684
+ .eds-side-navigation-group__trigger-icon {
685
+ margin-right: 0.75rem;
686
+ }
687
+ .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
688
+ margin-right: 2.5rem;
689
+ }
690
+ .eds-side-navigation--collapsed .eds-side-navigation-group__trigger {
691
+ padding-left: 2rem;
692
+ }
693
+ .eds-side-navigation-group__trigger:focus {
694
+ outline: 2px solid #181c56;
695
+ }
696
+ .eds-contrast .eds-side-navigation-group__trigger:focus {
697
+ outline: 2px solid #ffffff;
698
698
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/menu",
3
- "version": "4.1.20",
3
+ "version": "4.1.21",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/menu.esm.js",
@@ -38,5 +38,5 @@
38
38
  "react": ">=16.8.0",
39
39
  "react-dom": ">=16.8.0"
40
40
  },
41
- "gitHead": "103844c30bdc32296f3998a360cf6066492173e9"
41
+ "gitHead": "2e4881a7e25aef8ebd502e14f8434e0277707b09"
42
42
  }