@entur/menu 5.2.1-beta.3 → 5.2.1-beta.5

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
@@ -1,399 +1,5 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- /* DO NOT CHANGE!*/
4
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
5
- /* DO NOT CHANGE!*/
6
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
7
- [data-color-mode=light],
8
- :root {
9
- --components-menu-breadcrumb-contrast-icon: #ffffff;
10
- --components-menu-breadcrumb-contrast-text: #ffffff;
11
- --components-menu-breadcrumb-standard-icon: #181c56;
12
- --components-menu-breadcrumb-standard-text: #181c56;
13
- --components-menu-navigationbar-contrast-background: #393d79;
14
- --components-menu-navigationbar-contrast-divide: rgba(255, 255, 255, 0);
15
- --components-menu-navigationbar-contrast-icon-selected: #ffffff;
16
- --components-menu-navigationbar-contrast-icon-unselected: #d9dae8;
17
- --components-menu-navigationbar-contrast-stroke-selected: #ff5959;
18
- --components-menu-navigationbar-contrast-text-selected: #ffffff;
19
- --components-menu-navigationbar-contrast-text-unselected: #d9dae8;
20
- --components-menu-navigationbar-standard-background: #ffffff;
21
- --components-menu-navigationbar-standard-divide: #e3e6e8;
22
- --components-menu-navigationbar-standard-icon-selected: #181c56;
23
- --components-menu-navigationbar-standard-icon-unselected: #626493;
24
- --components-menu-navigationbar-standard-stroke-selected: #ff5959;
25
- --components-menu-navigationbar-standard-text-selected: #181c56;
26
- --components-menu-navigationbar-standard-text-unselected: #626493;
27
- --components-menu-navigationlink-contrast-icon: #ffffff;
28
- --components-menu-navigationlink-contrast-text: #ffffff;
29
- --components-menu-navigationlink-standard-icon: #181c56;
30
- --components-menu-navigationlink-standard-text: #181c56;
31
- --components-menu-overflowmenu-border: #8284ab;
32
- --components-menu-overflowmenu-fill-active: #aeb7e2;
33
- --components-menu-overflowmenu-fill-default: #f2f5f7;
34
- --components-menu-overflowmenu-fill-hover: #d9ddf2;
35
- --components-menu-overflowmenu-icon: #181c56;
36
- --components-menu-overflowmenu-icon-disabled: #6e6f73;
37
- --components-menu-overflowmenu-text: #181c56;
38
- --components-menu-overflowmenu-text-disabled: #6e6f73;
39
- --components-menu-pagination-contrast-active: #8794d4;
40
- --components-menu-pagination-contrast-border-selected: #ffffff;
41
- --components-menu-pagination-contrast-border-unselected: rgba(174, 183, 226, 0.6980392157);
42
- --components-menu-pagination-contrast-default: rgba(255, 255, 255, 0);
43
- --components-menu-pagination-contrast-hover: #626493;
44
- --components-menu-pagination-contrast-icon: #ffffff;
45
- --components-menu-pagination-contrast-text-selected: #181c56;
46
- --components-menu-pagination-contrast-text-subdued: #d9dae8;
47
- --components-menu-pagination-contrast-text-unselected: #ffffff;
48
- --components-menu-pagination-standard-active: #aeb7e2;
49
- --components-menu-pagination-standard-border-selected: #181c56;
50
- --components-menu-pagination-standard-border-unselected: rgba(84, 86, 140, 0.4);
51
- --components-menu-pagination-standard-default: rgba(255, 255, 255, 0);
52
- --components-menu-pagination-standard-hover: #d9ddf2;
53
- --components-menu-pagination-standard-icon: #181c56;
54
- --components-menu-pagination-standard-text-selected: #181c56;
55
- --components-menu-pagination-standard-text-subdued: #626493;
56
- --components-menu-pagination-standard-text-unselected: #181c56;
57
- --components-menu-sidenavigation-contrast-avatar: #393d79;
58
- --components-menu-sidenavigation-contrast-background: #181c56;
59
- --components-menu-sidenavigation-contrast-divide: #8284ab;
60
- --components-menu-sidenavigation-contrast-fill-active: rgba(255, 255, 255, 0);
61
- --components-menu-sidenavigation-contrast-fill-default: rgba(255, 255, 255, 0);
62
- --components-menu-sidenavigation-contrast-fill-hover: #393d79;
63
- --components-menu-sidenavigation-contrast-icon: #ffffff;
64
- --components-menu-sidenavigation-contrast-icon-disabled: #b6b8ba;
65
- --components-menu-sidenavigation-contrast-icon-label: #aeb7e2;
66
- --components-menu-sidenavigation-contrast-label: #aeb7e2;
67
- --components-menu-sidenavigation-contrast-stroke-selected: #ff5959;
68
- --components-menu-sidenavigation-contrast-text: #ffffff;
69
- --components-menu-sidenavigation-contrast-text-disabled: #b6b8ba;
70
- --components-menu-sidenavigation-standard-avatar: #ffffff;
71
- --components-menu-sidenavigation-standard-background: #f2f5f7;
72
- --components-menu-sidenavigation-standard-divide: #e3e6e8;
73
- --components-menu-sidenavigation-standard-fill-active: rgba(255, 255, 255, 0);
74
- --components-menu-sidenavigation-standard-fill-default: rgba(255, 255, 255, 0);
75
- --components-menu-sidenavigation-standard-fill-hover: #d9dae8;
76
- --components-menu-sidenavigation-standard-icon: #181c56;
77
- --components-menu-sidenavigation-standard-icon-disabled: #6e6f73;
78
- --components-menu-sidenavigation-standard-icon-label: #626493;
79
- --components-menu-sidenavigation-standard-label: #626493;
80
- --components-menu-sidenavigation-standard-stroke-selected: #181c56;
81
- --components-menu-sidenavigation-standard-text: #181c56;
82
- --components-menu-sidenavigation-standard-text-disabled: #6e6f73;
83
- --components-menu-stepper-contrast-background: #626493;
84
- --components-menu-stepper-contrast-progressbar: #aeb7e2;
85
- --components-menu-stepper-contrast-text-completed: #ffffff;
86
- --components-menu-stepper-contrast-text-uncompleted: #aeb7e2;
87
- --components-menu-stepper-standard-background: #e3e6e8;
88
- --components-menu-stepper-standard-progressbar: #181c56;
89
- --components-menu-stepper-standard-text-completed: #181c56;
90
- --components-menu-stepper-standard-text-uncompleted: #6e6f73;
91
- --components-menu-tableofcontent-contrast-icon-selected: #ffffff;
92
- --components-menu-tableofcontent-contrast-icon-unselected: #d9dae8;
93
- --components-menu-tableofcontent-contrast-stroke-selected: #ff5959;
94
- --components-menu-tableofcontent-contrast-stroke-unselected: #54568c;
95
- --components-menu-tableofcontent-contrast-text-selected: #ffffff;
96
- --components-menu-tableofcontent-contrast-text-unselected: #d9dae8;
97
- --components-menu-tableofcontent-standard-icon-selected: #181c56;
98
- --components-menu-tableofcontent-standard-icon-unselected: #626493;
99
- --components-menu-tableofcontent-standard-stroke-selected: #ff5959;
100
- --components-menu-tableofcontent-standard-stroke-unselected: #e3e6e8;
101
- --components-menu-tableofcontent-standard-text-selected: #181c56;
102
- --components-menu-tableofcontent-standard-text-unselected: #626493;
103
- }
104
-
105
- [data-color-mode=dark] {
106
- --components-menu-breadcrumb-contrast-icon: #e5e5e9;
107
- --components-menu-breadcrumb-contrast-text: #e5e5e9;
108
- --components-menu-breadcrumb-standard-icon: #e5e5e9;
109
- --components-menu-breadcrumb-standard-text: #e5e5e9;
110
- --components-menu-navigationbar-contrast-background: #393a49;
111
- --components-menu-navigationbar-contrast-divide: rgba(255, 255, 255, 0);
112
- --components-menu-navigationbar-contrast-icon-selected: #e5e5e9;
113
- --components-menu-navigationbar-contrast-icon-unselected: #b6b8ba;
114
- --components-menu-navigationbar-contrast-stroke-selected: #ff9494;
115
- --components-menu-navigationbar-contrast-text-selected: #e5e5e9;
116
- --components-menu-navigationbar-contrast-text-unselected: #b6b8ba;
117
- --components-menu-navigationbar-standard-background: #393a49;
118
- --components-menu-navigationbar-standard-divide: rgba(255, 255, 255, 0);
119
- --components-menu-navigationbar-standard-icon-selected: #e5e5e9;
120
- --components-menu-navigationbar-standard-icon-unselected: #b6b8ba;
121
- --components-menu-navigationbar-standard-stroke-selected: #ff9494;
122
- --components-menu-navigationbar-standard-text-selected: #e5e5e9;
123
- --components-menu-navigationbar-standard-text-unselected: #b6b8ba;
124
- --components-menu-navigationlink-contrast-icon: #e5e5e9;
125
- --components-menu-navigationlink-contrast-text: #e5e5e9;
126
- --components-menu-navigationlink-standard-icon: #e5e5e9;
127
- --components-menu-navigationlink-standard-text: #e5e5e9;
128
- --components-menu-overflowmenu-border: rgba(255, 255, 255, 0);
129
- --components-menu-overflowmenu-fill-active: #8794d4;
130
- --components-menu-overflowmenu-fill-default: #464755;
131
- --components-menu-overflowmenu-fill-hover: #626493;
132
- --components-menu-overflowmenu-icon: #e5e5e9;
133
- --components-menu-overflowmenu-icon-disabled: #949699;
134
- --components-menu-overflowmenu-text: #e5e5e9;
135
- --components-menu-overflowmenu-text-disabled: #949699;
136
- --components-menu-pagination-contrast-active: #8794d4;
137
- --components-menu-pagination-contrast-border-selected: #e5e5e9;
138
- --components-menu-pagination-contrast-border-unselected: rgba(174, 183, 226, 0.6980392157);
139
- --components-menu-pagination-contrast-default: rgba(255, 255, 255, 0);
140
- --components-menu-pagination-contrast-hover: #626493;
141
- --components-menu-pagination-contrast-icon: #e5e5e9;
142
- --components-menu-pagination-contrast-text-selected: #08091c;
143
- --components-menu-pagination-contrast-text-subdued: #b3b4bd;
144
- --components-menu-pagination-contrast-text-unselected: #e5e5e9;
145
- --components-menu-pagination-standard-active: #8794d4;
146
- --components-menu-pagination-standard-border-selected: #e5e5e9;
147
- --components-menu-pagination-standard-border-unselected: rgba(174, 183, 226, 0.6980392157);
148
- --components-menu-pagination-standard-default: rgba(255, 255, 255, 0);
149
- --components-menu-pagination-standard-hover: #626493;
150
- --components-menu-pagination-standard-icon: #e5e5e9;
151
- --components-menu-pagination-standard-text-selected: #08091c;
152
- --components-menu-pagination-standard-text-subdued: #b3b4bd;
153
- --components-menu-pagination-standard-text-unselected: #e5e5e9;
154
- --components-menu-sidenavigation-contrast-avatar: rgba(229, 229, 233, 0.1490196078);
155
- --components-menu-sidenavigation-contrast-background: #212233;
156
- --components-menu-sidenavigation-contrast-divide: #81828f;
157
- --components-menu-sidenavigation-contrast-fill-active: rgba(255, 255, 255, 0);
158
- --components-menu-sidenavigation-contrast-fill-default: rgba(255, 255, 255, 0);
159
- --components-menu-sidenavigation-contrast-fill-hover: rgba(229, 229, 233, 0.1490196078);
160
- --components-menu-sidenavigation-contrast-icon: #e5e5e9;
161
- --components-menu-sidenavigation-contrast-icon-disabled: #949699;
162
- --components-menu-sidenavigation-contrast-icon-label: #b3b4bd;
163
- --components-menu-sidenavigation-contrast-label: #b3b4bd;
164
- --components-menu-sidenavigation-contrast-stroke-selected: #ff9494;
165
- --components-menu-sidenavigation-contrast-text: #e5e5e9;
166
- --components-menu-sidenavigation-contrast-text-disabled: #949699;
167
- --components-menu-sidenavigation-standard-avatar: rgba(229, 229, 233, 0.1490196078);
168
- --components-menu-sidenavigation-standard-background: #212233;
169
- --components-menu-sidenavigation-standard-divide: #81828f;
170
- --components-menu-sidenavigation-standard-fill-active: rgba(255, 255, 255, 0);
171
- --components-menu-sidenavigation-standard-fill-default: rgba(255, 255, 255, 0);
172
- --components-menu-sidenavigation-standard-fill-hover: rgba(229, 229, 233, 0.1490196078);
173
- --components-menu-sidenavigation-standard-icon: #e5e5e9;
174
- --components-menu-sidenavigation-standard-icon-disabled: #949699;
175
- --components-menu-sidenavigation-standard-icon-label: #b3b4bd;
176
- --components-menu-sidenavigation-standard-label: #b3b4bd;
177
- --components-menu-sidenavigation-standard-stroke-selected: #ff9494;
178
- --components-menu-sidenavigation-standard-text: #e5e5e9;
179
- --components-menu-sidenavigation-standard-text-disabled: #949699;
180
- --components-menu-stepper-contrast-background: #626493;
181
- --components-menu-stepper-contrast-progressbar: #aeb7e2;
182
- --components-menu-stepper-contrast-text-completed: #e5e5e9;
183
- --components-menu-stepper-contrast-text-uncompleted: #b6b8ba;
184
- --components-menu-stepper-standard-background: #626493;
185
- --components-menu-stepper-standard-progressbar: #aeb7e2;
186
- --components-menu-stepper-standard-text-completed: #e5e5e9;
187
- --components-menu-stepper-standard-text-uncompleted: #b6b8ba;
188
- --components-menu-tableofcontent-contrast-icon-selected: #e5e5e9;
189
- --components-menu-tableofcontent-contrast-icon-unselected: #b3b4bd;
190
- --components-menu-tableofcontent-contrast-stroke-selected: #ff9494;
191
- --components-menu-tableofcontent-contrast-stroke-unselected: rgba(84, 86, 140, 0.4);
192
- --components-menu-tableofcontent-contrast-text-selected: #e5e5e9;
193
- --components-menu-tableofcontent-contrast-text-unselected: #b3b4bd;
194
- --components-menu-tableofcontent-standard-icon-selected: #e5e5e9;
195
- --components-menu-tableofcontent-standard-icon-unselected: #b3b4bd;
196
- --components-menu-tableofcontent-standard-stroke-selected: #ff9494;
197
- --components-menu-tableofcontent-standard-stroke-unselected: rgba(84, 86, 140, 0.4);
198
- --components-menu-tableofcontent-standard-text-selected: #e5e5e9;
199
- --components-menu-tableofcontent-standard-text-unselected: #b3b4bd;
200
- }
201
-
202
- /* DO NOT CHANGE!*/
203
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
204
- /* DO NOT CHANGE!*/
205
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
206
- [data-color-mode=light],
207
- :root {
208
- --basecolors-frame-contrast: #181c56;
209
- --basecolors-frame-contrastalt: #393d79;
210
- --basecolors-frame-contrastalt-2: #292b6a;
211
- --basecolors-frame-default: #ffffff;
212
- --basecolors-frame-elevated: #ffffff;
213
- --basecolors-frame-elevatedalt: #f6f6f9;
214
- --basecolors-frame-subdued: #d9dae8;
215
- --basecolors-frame-tint: #f6f6f9;
216
- --basecolors-shape-accent: #181c56;
217
- --basecolors-shape-bicycle-contrast: #00db9b;
218
- --basecolors-shape-bicycle-default: #388f76;
219
- --basecolors-shape-bus-contrast: #ff6392;
220
- --basecolors-shape-bus-default: #c5044e;
221
- --basecolors-shape-cableway-contrast: #b482fb;
222
- --basecolors-shape-cableway-default: #78469a;
223
- --basecolors-shape-disabled: #6e6f73;
224
- --basecolors-shape-disabledalt: #b6b8ba;
225
- --basecolors-shape-ferry-contrast: #6fdfff;
226
- --basecolors-shape-ferry-default: #0c6693;
227
- --basecolors-shape-funicular-contrast: #b482fb;
228
- --basecolors-shape-funicular-default: #78469a;
229
- --basecolors-shape-helicopter-contrast: #fbafea;
230
- --basecolors-shape-helicopter-default: #800664;
231
- --basecolors-shape-highlight: #ff5959;
232
- --basecolors-shape-light: #ffffff;
233
- --basecolors-shape-mask: #ffffff;
234
- --basecolors-shape-maskalt: #ffffff;
235
- --basecolors-shape-metro-contrast: #f08901;
236
- --basecolors-shape-metro-default: #bf5826;
237
- --basecolors-shape-mobility-contrast: #00db9b;
238
- --basecolors-shape-mobility-default: #388f76;
239
- --basecolors-shape-plane-contrast: #fbafea;
240
- --basecolors-shape-plane-default: #800664;
241
- --basecolors-shape-subdued: #626493;
242
- --basecolors-shape-subduedalt: #d9dae8;
243
- --basecolors-shape-taxi-contrast: #ffe082;
244
- --basecolors-shape-taxi-default: #3d3e40;
245
- --basecolors-shape-train-contrast: #42a5f5;
246
- --basecolors-shape-train-default: #00367f;
247
- --basecolors-shape-tram-contrast: #b482fb;
248
- --basecolors-shape-tram-default: #78469a;
249
- --basecolors-shape-walk-contrast: #8284ab;
250
- --basecolors-shape-walk-default: #8d8e9c;
251
- --basecolors-shape-airportlinkbus-contrast: #fbafea;
252
- --basecolors-shape-airportlinkbus-default: #800664;
253
- --basecolors-shape-airportlinkrail-contrast: #fbafea;
254
- --basecolors-shape-airportlinkrail-default: #800664;
255
- --basecolors-stroke-contrast: #aeb7e2;
256
- --basecolors-stroke-default: #181c56;
257
- --basecolors-stroke-disabled: #949699;
258
- --basecolors-stroke-focus-contrast: #aeb7e2;
259
- --basecolors-stroke-focus-standard: #181c56;
260
- --basecolors-stroke-highlight: #ff5959;
261
- --basecolors-stroke-light: #ffffff;
262
- --basecolors-stroke-subdued: #8284ab;
263
- --basecolors-stroke-subduedalt: #e3e6e8;
264
- --basecolors-text-accent: #181c56;
265
- --basecolors-text-disabled: #6e6f73;
266
- --basecolors-text-disabledalt: #b6b8ba;
267
- --basecolors-text-highlight: #ff5959;
268
- --basecolors-text-light: #ffffff;
269
- --basecolors-text-subdued: #626493;
270
- --basecolors-text-subduedalt: #d9dae8;
271
- }
272
-
273
- [data-color-mode=dark] {
274
- --basecolors-frame-contrast: #212233;
275
- --basecolors-frame-contrastalt: #141527;
276
- --basecolors-frame-contrastalt-2: #08091c;
277
- --basecolors-frame-default: #08091c;
278
- --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
279
- --basecolors-frame-elevatedalt: #464755;
280
- --basecolors-frame-subdued: #2d2e3e;
281
- --basecolors-frame-tint: #141527;
282
- --basecolors-shape-accent: #e5e5e9;
283
- --basecolors-shape-bicycle-contrast: #4db295;
284
- --basecolors-shape-bicycle-default: #4db295;
285
- --basecolors-shape-bus-contrast: #ef7398;
286
- --basecolors-shape-bus-default: #ef7398;
287
- --basecolors-shape-cableway-contrast: #b898e5;
288
- --basecolors-shape-cableway-default: #b898e5;
289
- --basecolors-shape-disabled: #b6b8ba;
290
- --basecolors-shape-disabledalt: #b3b4bd;
291
- --basecolors-shape-ferry-contrast: #8ccfe2;
292
- --basecolors-shape-ferry-default: #8ccfe2;
293
- --basecolors-shape-funicular-contrast: #b898e5;
294
- --basecolors-shape-funicular-default: #b898e5;
295
- --basecolors-shape-helicopter-contrast: #f2b8e5;
296
- --basecolors-shape-helicopter-default: #f2b8e5;
297
- --basecolors-shape-highlight: #ff9494;
298
- --basecolors-shape-light: #e5e5e9;
299
- --basecolors-shape-mask: #2d2e3e;
300
- --basecolors-shape-maskalt: #393a49;
301
- --basecolors-shape-metro-contrast: #dd973c;
302
- --basecolors-shape-metro-default: #dd973c;
303
- --basecolors-shape-mobility-contrast: #4db295;
304
- --basecolors-shape-mobility-default: #4db295;
305
- --basecolors-shape-plane-contrast: #f2b8e5;
306
- --basecolors-shape-plane-default: #f2b8e5;
307
- --basecolors-shape-subdued: #b3b4bd;
308
- --basecolors-shape-subduedalt: #b3b4bd;
309
- --basecolors-shape-taxi-contrast: #ffe082;
310
- --basecolors-shape-taxi-default: #ffe082;
311
- --basecolors-shape-train-contrast: #60a2d7;
312
- --basecolors-shape-train-default: #60a2d7;
313
- --basecolors-shape-tram-contrast: #b898e5;
314
- --basecolors-shape-tram-default: #b898e5;
315
- --basecolors-shape-walk-contrast: #8d8e9c;
316
- --basecolors-shape-walk-default: #8d8e9c;
317
- --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
318
- --basecolors-shape-airportlinkbus-default: #f2b8e5;
319
- --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
320
- --basecolors-shape-airportlinkrail-default: #f2b8e5;
321
- --basecolors-stroke-contrast: #aeb7e2;
322
- --basecolors-stroke-default: #b3b4bd;
323
- --basecolors-stroke-disabled: #e3e6e8;
324
- --basecolors-stroke-focus-contrast: #aeb7e2;
325
- --basecolors-stroke-focus-standard: #aeb7e2;
326
- --basecolors-stroke-highlight: #ff9494;
327
- --basecolors-stroke-light: #b3b4bd;
328
- --basecolors-stroke-subdued: #81828f;
329
- --basecolors-stroke-subduedalt: #949699;
330
- --basecolors-text-accent: #e5e5e9;
331
- --basecolors-text-disabled: #b6b8ba;
332
- --basecolors-text-disabledalt: #b6b8ba;
333
- --basecolors-text-highlight: #ff9494;
334
- --basecolors-text-light: #e5e5e9;
335
- --basecolors-text-subdued: #b3b4bd;
336
- --basecolors-text-subduedalt: #b3b4bd;
337
- }
338
-
339
- :root {
340
- --eds-menu: 1;
341
- --reach-menu-button: 1;
342
- }/* DO NOT CHANGE!*/
343
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
344
- .eds-breadcrumb {
345
- list-style: none;
346
- margin: 0;
347
- padding: 0;
348
- }
349
-
350
- .eds-breadcrumb__item {
351
- display: inline-block;
352
- color: var(--components-menu-breadcrumb-standard-text);
353
- }
354
- .eds-contrast .eds-breadcrumb__item {
355
- color: var(--components-menu-breadcrumb-contrast-text);
356
- }
357
-
358
- .eds-breadcrumb__separator {
359
- margin: 0 0.25rem 0 0.25rem;
360
- }
361
-
362
- .eds-breadcrumb__link {
363
- text-decoration: none;
364
- color: var(--components-menu-breadcrumb-standard-text);
365
- background-image: linear-gradient(120deg, var(--components-menu-breadcrumb-standard-text) 0%, var(--components-menu-breadcrumb-standard-text) 100%);
366
- background-repeat: no-repeat;
367
- background-size: 100% 0.125rem;
368
- background-position: 0 100%;
369
- }
370
- .eds-contrast .eds-breadcrumb__link {
371
- color: var(--components-menu-breadcrumb-contrast-text);
372
- background-image: linear-gradient(120deg, var(--components-menu-breadcrumb-contrast-text) 0%, var(--components-menu-breadcrumb-contrast-text) 100%);
373
- }
374
- .eds-breadcrumb__link:hover {
375
- animation: eds-breadcrumb-underline 0.3s ease-in;
376
- }
377
- .eds-breadcrumb__link:focus-visible {
378
- outline: 2px solid #181c56;
379
- outline-color: var(--basecolors-stroke-focus-standard);
380
- outline-offset: 0.125rem;
381
- }
382
- .eds-contrast .eds-breadcrumb__link:focus-visible {
383
- outline-color: var(--basecolors-stroke-focus-contrast);
384
- }
385
- @keyframes eds-breadcrumb-underline {
386
- from {
387
- background-size: 0% 0.125rem;
388
- }
389
- to {
390
- background-size: 100% 0.125rem;
391
- }
392
- }
393
- .eds-breadcrumb__link--current {
394
- font-weight: 600;
395
- }/* DO NOT CHANGE!*/
396
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
397
3
  .eds-overflow-menu__menu-list {
398
4
  box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
399
5
  overflow: hidden;
@@ -407,13 +13,16 @@
407
13
  .eds-overflow-menu__item {
408
14
  display: block;
409
15
  width: 100%;
410
- appearance: none;
16
+ -webkit-appearance: none;
17
+ -moz-appearance: none;
18
+ appearance: none;
411
19
  padding: 0.75rem;
412
20
  border: none;
413
21
  outline: none;
414
22
  font-size: 1rem;
415
23
  line-height: 1.375rem;
416
24
  text-align: left;
25
+ -webkit-text-decoration: none;
417
26
  text-decoration: none;
418
27
  color: var(--components-menu-overflowmenu-text);
419
28
  background: var(--components-menu-overflowmenu-fill-default);
@@ -433,158 +42,63 @@
433
42
  }
434
43
  .eds-overflow-menu__item svg {
435
44
  margin-right: 0.75rem;
436
- }/* DO NOT CHANGE!*/
437
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
438
- .eds-pagination {
439
- align-items: center;
440
- display: flex;
441
- flex-wrap: wrap;
442
- row-gap: 0.75rem;
443
- justify-content: space-between;
444
- }
445
- .eds-pagination__results {
446
- margin-right: 0.5rem;
447
- display: flex;
448
- flex: 1;
449
- align-items: center;
450
- justify-content: flex-start;
451
- color: var(--components-menu-pagination-standard-text-subdued);
452
- }
453
- .eds-contrast .eds-pagination__results {
454
- color: var(--components-menu-pagination-contrast-text-subdued);
455
- }
456
- .eds-pagination__results .eds-pagination__results__change-number-of-results {
457
- border: solid 0.0625rem var(--components-menu-pagination-contrast-border-unselected);
458
- margin: 0 0.5rem;
459
- }
460
- .eds-pagination__results .eds-pagination__results__change-number-of-results__arrow {
461
- margin-left: 0.5rem;
462
- }
463
- .eds-pagination__results .eds-pagination__results__change-number-of-results[aria-expanded=true] .eds-pagination__results__change-number-of-results__arrow {
464
- transform: rotate(180deg);
465
- }
466
- .eds-pagination__results:first-of-type:last-of-type, .eds-pagination__controls:first-of-type:last-of-type {
467
- margin: 0 auto;
468
- }
469
- .eds-pagination__controls {
470
- align-items: center;
471
- display: flex;
472
- justify-content: center;
473
- }
474
- .eds-pagination__controls__page {
475
- align-items: center;
476
- appearance: none;
477
- background-color: var(--components-menu-pagination-standard-default);
478
- border: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
479
- border-radius: 0.25rem;
480
- color: var(--components-menu-pagination-standard-text-unselected);
481
- cursor: pointer;
482
- display: flex;
483
- font-family: inherit;
484
- font-size: 0.875rem;
485
- height: 2rem;
486
- justify-content: center;
487
- margin: 0 0.125rem;
488
- padding: 0 0.25rem;
489
- transition: background 0.1s ease-out, border-color 0.1s ease-out;
490
- user-select: none;
491
- min-width: 2rem;
492
- }
493
- .eds-contrast .eds-pagination__controls__page {
494
- background-color: var(--components-menu-pagination-contrast-default);
495
- border-color: var(--components-menu-pagination-contrast-border-unselected);
496
- color: var(--components-menu-pagination-contrast-text-unselected);
497
- }
498
- .eds-pagination__controls__page--selected {
499
- background: var(--components-menu-pagination-standard-active);
500
- border-color: var(--components-menu-pagination-standard-border-selected);
501
- color: var(--components-menu-pagination-standard-text-selected);
502
- opacity: 1;
503
- pointer-events: none;
504
- }
505
- .eds-contrast .eds-pagination__controls__page--selected {
506
- background: var(--components-menu-pagination-contrast-active);
507
- border-color: var(--components-menu-pagination-contrast-border-selected);
508
- color: var(--components-menu-pagination-contrast-text-selected);
509
- }
510
- .eds-pagination__controls__page--disabled {
511
- opacity: 0.5;
512
- pointer-events: none;
513
- }
514
- .eds-pagination__controls__page:hover {
515
- background-color: var(--components-menu-pagination-standard-hover);
516
- border-color: var(--components-menu-pagination-standard-border-unselected);
517
- }
518
- .eds-contrast .eds-pagination__controls__page:hover {
519
- background-color: var(--components-menu-pagination-contrast-hover);
520
- border-color: var(--components-menu-pagination-contrast-border-unselected);
521
- }
522
- .eds-pagination__controls__page:focus-visible {
523
- outline: 2px solid #181c56;
524
- outline-color: var(--basecolors-stroke-focus-standard);
525
- outline-offset: 0.125rem;
526
- }
527
- .eds-contrast .eds-pagination__controls__page:focus-visible {
528
- outline-color: var(--basecolors-stroke-focus-contrast);
529
- }
530
- .eds-pagination__controls__page__ellipsis {
531
- color: var(--components-menu-pagination-standard-icon);
532
- align-items: baseline;
533
- cursor: default;
534
- display: flex;
535
- font-size: 1.5rem;
536
- height: 2rem;
537
- justify-content: center;
538
- user-select: none;
539
- width: 2rem;
540
- margin: 0 2px;
541
45
  }
542
- .eds-contrast .eds-pagination__controls__page__ellipsis {
543
- color: var(--components-menu-pagination-contrast-icon);
544
- }
545
- .eds-pagination__controls__input__wrapper {
546
- white-space: nowrap;
46
+ /* DO NOT CHANGE!*/
47
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
48
+ .eds-breadcrumb {
49
+ list-style: none;
50
+ margin: 0;
51
+ padding: 0;
547
52
  }
548
- .eds-pagination__controls__input__label {
549
- border-left: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
550
- color: var(--components-menu-pagination-standard-text-subdued);
551
- font-size: 0.875rem;
552
- margin-left: 0.5rem;
553
- padding: 0 1rem;
53
+
54
+ .eds-breadcrumb__item {
55
+ display: inline-block;
56
+ color: var(--components-menu-breadcrumb-standard-text);
554
57
  }
555
- .eds-contrast .eds-pagination__controls__input__label {
556
- border-color: var(--components-menu-pagination-contrast-border-unselected);
557
- color: var(--components-menu-pagination-contrast-text-subdued);
58
+ .eds-contrast .eds-breadcrumb__item {
59
+ color: var(--components-menu-breadcrumb-contrast-text);
558
60
  }
559
- .eds-pagination__controls__input__field {
560
- appearance: none;
561
- background-color: var(--components-menu-pagination-standard-default);
562
- border: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
563
- border-radius: 0.25rem;
564
- color: var(--components-menu-pagination-standard-text-unselected);
565
- font-family: inherit;
566
- font-size: 0.875rem;
567
- height: 2rem;
568
- text-align: center;
569
- width: 2rem;
61
+
62
+ .eds-breadcrumb__separator {
63
+ margin: 0 0.25rem 0 0.25rem;
570
64
  }
571
- .eds-contrast .eds-pagination__controls__input__field {
572
- background-color: var(--components-menu-pagination-contrast-default);
573
- border-color: var(--components-menu-pagination-contrast-border-unselected);
574
- color: var(--components-menu-pagination-contrast-text-unselected);
65
+
66
+ .eds-breadcrumb__link {
67
+ -webkit-text-decoration: none;
68
+ text-decoration: none;
69
+ color: var(--components-menu-breadcrumb-standard-text);
70
+ background-image: linear-gradient(120deg, var(--components-menu-breadcrumb-standard-text) 0%, var(--components-menu-breadcrumb-standard-text) 100%);
71
+ background-repeat: no-repeat;
72
+ background-size: 100% 0.125rem;
73
+ background-position: 0 100%;
575
74
  }
576
- .eds-pagination__controls__input__field::-webkit-inner-spin-button, .eds-pagination__controls__input__field::-webkit-outer-spin-button {
577
- appearance: none;
578
- margin: 0;
75
+ .eds-contrast .eds-breadcrumb__link {
76
+ color: var(--components-menu-breadcrumb-contrast-text);
77
+ background-image: linear-gradient(120deg, var(--components-menu-breadcrumb-contrast-text) 0%, var(--components-menu-breadcrumb-contrast-text) 100%);
579
78
  }
580
- .eds-pagination__controls__input__field:focus-visible {
79
+ .eds-breadcrumb__link:hover {
80
+ animation: eds-breadcrumb-underline 0.3s ease-in;
81
+ }
82
+ .eds-breadcrumb__link:focus-visible {
581
83
  outline: 2px solid #181c56;
582
84
  outline-color: var(--basecolors-stroke-focus-standard);
583
85
  outline-offset: 0.125rem;
584
86
  }
585
- .eds-contrast .eds-pagination__controls__input__field:focus-visible {
87
+ .eds-contrast .eds-breadcrumb__link:focus-visible {
586
88
  outline-color: var(--basecolors-stroke-focus-contrast);
587
- }/* DO NOT CHANGE!*/
89
+ }
90
+ @keyframes eds-breadcrumb-underline {
91
+ from {
92
+ background-size: 0% 0.125rem;
93
+ }
94
+ to {
95
+ background-size: 100% 0.125rem;
96
+ }
97
+ }
98
+ .eds-breadcrumb__link--current {
99
+ font-weight: 600;
100
+ }
101
+ /* DO NOT CHANGE!*/
588
102
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
589
103
  .eds-side-navigation,
590
104
  .eds-side-navigation-group {
@@ -697,7 +211,9 @@
697
211
  }
698
212
 
699
213
  .eds-side-navigation__click-target {
700
- appearance: none;
214
+ -webkit-appearance: none;
215
+ -moz-appearance: none;
216
+ appearance: none;
701
217
  background: none;
702
218
  border: 0;
703
219
  border-bottom: 0.0625rem solid var(--components-menu-sidenavigation-standard-divide);
@@ -713,6 +229,7 @@
713
229
  padding-left: 2.5rem;
714
230
  transition: padding 0.2s ease-in-out;
715
231
  text-align: left;
232
+ -webkit-text-decoration: none;
716
233
  text-decoration: none;
717
234
  width: 100%;
718
235
  }
@@ -763,7 +280,9 @@
763
280
 
764
281
  .eds-side-navigation-group__trigger {
765
282
  align-items: center;
766
- appearance: none;
283
+ -webkit-appearance: none;
284
+ -moz-appearance: none;
285
+ appearance: none;
767
286
  background-color: var(--components-menu-sidenavigation-standard-background);
768
287
  border: none;
769
288
  border-bottom: 0.0625rem solid var(--components-menu-sidenavigation-standard-divide);
@@ -783,156 +302,666 @@
783
302
  transition: padding 0.2s ease-in-out;
784
303
  width: 100%;
785
304
  }
786
- .eds-contrast .eds-side-navigation-group__trigger {
787
- color: var(--components-menu-sidenavigation-contrast-label);
788
- background-color: var(--components-menu-sidenavigation-contrast-background);
789
- border-color: var(--components-menu-sidenavigation-contrast-divide);
305
+ .eds-contrast .eds-side-navigation-group__trigger {
306
+ color: var(--components-menu-sidenavigation-contrast-label);
307
+ background-color: var(--components-menu-sidenavigation-contrast-background);
308
+ border-color: var(--components-menu-sidenavigation-contrast-divide);
309
+ }
310
+ .eds-side-navigation-group__trigger-icon {
311
+ margin-right: 0.75rem;
312
+ }
313
+ .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
314
+ margin-right: 2.5rem;
315
+ color: var(--components-menu-sidenavigation-standard-icon-label);
316
+ }
317
+ .eds-contrast .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
318
+ color: var(--components-menu-sidenavigation-contrast-icon-label);
319
+ }
320
+ .eds-side-navigation--collapsed .eds-side-navigation-group__trigger {
321
+ padding-left: 2rem;
322
+ }
323
+ .eds-side-navigation-group__trigger:focus-visible {
324
+ outline: 2px solid #181c56;
325
+ outline-color: var(--basecolors-stroke-focus-standard);
326
+ outline-offset: 0.125rem;
327
+ }
328
+ .eds-contrast .eds-side-navigation-group__trigger:focus-visible {
329
+ outline-color: var(--basecolors-stroke-focus-contrast);
330
+ }
331
+ /* DO NOT CHANGE!*/
332
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
333
+ .eds-pagination {
334
+ align-items: center;
335
+ display: flex;
336
+ flex-wrap: wrap;
337
+ row-gap: 0.75rem;
338
+ justify-content: space-between;
339
+ }
340
+ .eds-pagination__results {
341
+ margin-right: 0.5rem;
342
+ display: flex;
343
+ flex: 1;
344
+ align-items: center;
345
+ justify-content: flex-start;
346
+ color: var(--components-menu-pagination-standard-text-subdued);
347
+ }
348
+ .eds-contrast .eds-pagination__results {
349
+ color: var(--components-menu-pagination-contrast-text-subdued);
350
+ }
351
+ .eds-pagination__results .eds-pagination__results__change-number-of-results {
352
+ border: solid 0.0625rem var(--components-menu-pagination-contrast-border-unselected);
353
+ margin: 0 0.5rem;
354
+ }
355
+ .eds-pagination__results .eds-pagination__results__change-number-of-results__arrow {
356
+ margin-left: 0.5rem;
357
+ }
358
+ .eds-pagination__results .eds-pagination__results__change-number-of-results[aria-expanded=true] .eds-pagination__results__change-number-of-results__arrow {
359
+ transform: rotate(180deg);
360
+ }
361
+ .eds-pagination__results:first-of-type:last-of-type, .eds-pagination__controls:first-of-type:last-of-type {
362
+ margin: 0 auto;
363
+ }
364
+ .eds-pagination__controls {
365
+ align-items: center;
366
+ display: flex;
367
+ justify-content: center;
368
+ }
369
+ .eds-pagination__controls__page {
370
+ align-items: center;
371
+ -webkit-appearance: none;
372
+ -moz-appearance: none;
373
+ appearance: none;
374
+ background-color: var(--components-menu-pagination-standard-default);
375
+ border: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
376
+ border-radius: 0.25rem;
377
+ color: var(--components-menu-pagination-standard-text-unselected);
378
+ cursor: pointer;
379
+ display: flex;
380
+ font-family: inherit;
381
+ font-size: 0.875rem;
382
+ height: 2rem;
383
+ justify-content: center;
384
+ margin: 0 0.125rem;
385
+ padding: 0 0.25rem;
386
+ transition: background 0.1s ease-out, border-color 0.1s ease-out;
387
+ -webkit-user-select: none;
388
+ -moz-user-select: none;
389
+ user-select: none;
390
+ min-width: 2rem;
391
+ }
392
+ .eds-contrast .eds-pagination__controls__page {
393
+ background-color: var(--components-menu-pagination-contrast-default);
394
+ border-color: var(--components-menu-pagination-contrast-border-unselected);
395
+ color: var(--components-menu-pagination-contrast-text-unselected);
396
+ }
397
+ .eds-pagination__controls__page--selected {
398
+ background: var(--components-menu-pagination-standard-active);
399
+ border-color: var(--components-menu-pagination-standard-border-selected);
400
+ color: var(--components-menu-pagination-standard-text-selected);
401
+ opacity: 1;
402
+ pointer-events: none;
403
+ }
404
+ .eds-contrast .eds-pagination__controls__page--selected {
405
+ background: var(--components-menu-pagination-contrast-active);
406
+ border-color: var(--components-menu-pagination-contrast-border-selected);
407
+ color: var(--components-menu-pagination-contrast-text-selected);
408
+ }
409
+ .eds-pagination__controls__page--disabled {
410
+ opacity: 0.5;
411
+ pointer-events: none;
412
+ }
413
+ .eds-pagination__controls__page:hover {
414
+ background-color: var(--components-menu-pagination-standard-hover);
415
+ border-color: var(--components-menu-pagination-standard-border-unselected);
416
+ }
417
+ .eds-contrast .eds-pagination__controls__page:hover {
418
+ background-color: var(--components-menu-pagination-contrast-hover);
419
+ border-color: var(--components-menu-pagination-contrast-border-unselected);
420
+ }
421
+ .eds-pagination__controls__page:focus-visible {
422
+ outline: 2px solid #181c56;
423
+ outline-color: var(--basecolors-stroke-focus-standard);
424
+ outline-offset: 0.125rem;
425
+ }
426
+ .eds-contrast .eds-pagination__controls__page:focus-visible {
427
+ outline-color: var(--basecolors-stroke-focus-contrast);
428
+ }
429
+ .eds-pagination__controls__page__ellipsis {
430
+ color: var(--components-menu-pagination-standard-icon);
431
+ align-items: baseline;
432
+ cursor: default;
433
+ display: flex;
434
+ font-size: 1.5rem;
435
+ height: 2rem;
436
+ justify-content: center;
437
+ -webkit-user-select: none;
438
+ -moz-user-select: none;
439
+ user-select: none;
440
+ width: 2rem;
441
+ margin: 0 2px;
442
+ }
443
+ .eds-contrast .eds-pagination__controls__page__ellipsis {
444
+ color: var(--components-menu-pagination-contrast-icon);
445
+ }
446
+ .eds-pagination__controls__input__wrapper {
447
+ white-space: nowrap;
448
+ }
449
+ .eds-pagination__controls__input__label {
450
+ border-left: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
451
+ color: var(--components-menu-pagination-standard-text-subdued);
452
+ font-size: 0.875rem;
453
+ margin-left: 0.5rem;
454
+ padding: 0 1rem;
455
+ }
456
+ .eds-contrast .eds-pagination__controls__input__label {
457
+ border-color: var(--components-menu-pagination-contrast-border-unselected);
458
+ color: var(--components-menu-pagination-contrast-text-subdued);
459
+ }
460
+ .eds-pagination__controls__input__field {
461
+ -webkit-appearance: none;
462
+ -moz-appearance: none;
463
+ appearance: none;
464
+ background-color: var(--components-menu-pagination-standard-default);
465
+ border: 0.0625rem solid var(--components-menu-pagination-standard-border-unselected);
466
+ border-radius: 0.25rem;
467
+ color: var(--components-menu-pagination-standard-text-unselected);
468
+ font-family: inherit;
469
+ font-size: 0.875rem;
470
+ height: 2rem;
471
+ text-align: center;
472
+ width: 2rem;
473
+ }
474
+ .eds-contrast .eds-pagination__controls__input__field {
475
+ background-color: var(--components-menu-pagination-contrast-default);
476
+ border-color: var(--components-menu-pagination-contrast-border-unselected);
477
+ color: var(--components-menu-pagination-contrast-text-unselected);
478
+ }
479
+ .eds-pagination__controls__input__field::-webkit-inner-spin-button, .eds-pagination__controls__input__field::-webkit-outer-spin-button {
480
+ -webkit-appearance: none;
481
+ appearance: none;
482
+ margin: 0;
483
+ }
484
+ .eds-pagination__controls__input__field:focus-visible {
485
+ outline: 2px solid #181c56;
486
+ outline-color: var(--basecolors-stroke-focus-standard);
487
+ outline-offset: 0.125rem;
488
+ }
489
+ .eds-contrast .eds-pagination__controls__input__field:focus-visible {
490
+ outline-color: var(--basecolors-stroke-focus-contrast);
491
+ }
492
+ /* DO NOT CHANGE!*/
493
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
494
+ .eds-stepper {
495
+ --text-color: var(--components-menu-stepper-standard-text-uncompleted);
496
+ --line-color: var(--components-menu-stepper-standard-background);
497
+ --label-font-weight: 500;
498
+ --display-active-line: none;
499
+ display: flex;
500
+ flex-direction: row;
501
+ width: 100%;
502
+ list-style-type: none;
503
+ }
504
+ .eds-stepper__step {
505
+ display: flex;
506
+ flex-grow: 1;
507
+ flex-basis: 0;
508
+ flex-direction: column;
509
+ align-items: inherit;
510
+ -webkit-appearance: none;
511
+ -moz-appearance: none;
512
+ appearance: none;
513
+ background: none;
514
+ border: none;
515
+ font-family: inherit;
516
+ text-transform: none;
517
+ }
518
+ .eds-stepper__step:focus-visible .eds-stepper__step__label {
519
+ outline-offset: 0.125rem;
520
+ outline: 2px solid #181c56;
521
+ }
522
+ .eds-contrast .eds-stepper__step:focus-visible .eds-stepper__step__label {
523
+ outline: 2px solid #ffffff;
524
+ }
525
+ .eds-contrast .eds-stepper__step {
526
+ --text-color: var(--components-menu-stepper-contrast-text-uncompleted);
527
+ --line-color: var(--components-menu-stepper-contrast-background);
528
+ }
529
+ .eds-stepper__step__wrapper {
530
+ flex-grow: 1;
531
+ }
532
+ .eds-stepper__step--interactive {
533
+ all: unset;
534
+ display: flex;
535
+ flex-direction: column;
536
+ width: 100%;
537
+ cursor: pointer;
538
+ }
539
+ .eds-stepper__step--active {
540
+ --text-color: var(--components-menu-stepper-standard-text-uncompleted);
541
+ --label-font-weight: 600;
542
+ --display-active-line: block;
543
+ }
544
+ .eds-contrast .eds-stepper__step--active {
545
+ --text-color: var(--components-menu-stepper-contrast-text-uncompleted);
546
+ }
547
+ .eds-stepper__step--completed {
548
+ --text-color: var(--components-menu-stepper-standard-text-completed);
549
+ --line-color: var(--components-menu-stepper-standard-progressbar);
550
+ }
551
+ .eds-contrast .eds-stepper__step--completed {
552
+ --text-color: var(--components-menu-stepper-contrast-text-completed);
553
+ --line-color: var(--components-menu-stepper-contrast-progressbar);
554
+ }
555
+ .eds-stepper__step__label {
556
+ flex-grow: 1;
557
+ flex-direction: column;
558
+ align-self: center;
559
+ text-align: center;
560
+ font-size: 0.875rem;
561
+ margin: 0.5rem 0 0;
562
+ padding: 0 0.5rem;
563
+ width: -moz-fit-content;
564
+ width: fit-content;
565
+ border-radius: 0.0625rem;
566
+ color: var(--text-color);
567
+ font-weight: var(--label-font-weight);
568
+ }
569
+ .eds-stepper__step--interactive:hover .eds-stepper__step__label {
570
+ background-color: var(--components-menu-stepper-standard-background);
571
+ color: var(--components-menu-stepper-standard-text-completed);
790
572
  }
791
- .eds-side-navigation-group__trigger-icon {
792
- margin-right: 0.75rem;
573
+ .eds-contrast .eds-stepper__step--interactive:hover .eds-stepper__step__label {
574
+ background-color: var(--components-menu-stepper-contrast-background);
575
+ color: var(--components-menu-stepper-contrast-text-completed);
793
576
  }
794
- .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
795
- margin-right: 2.5rem;
796
- color: var(--components-menu-sidenavigation-standard-icon-label);
577
+ .eds-stepper__step__line {
578
+ height: 0.5rem;
579
+ background: var(--line-color);
580
+ position: relative;
797
581
  }
798
- .eds-contrast .eds-side-navigation-group__trigger .eds-side-navigation-group__expand-icon {
799
- color: var(--components-menu-sidenavigation-contrast-icon-label);
582
+ .eds-stepper__step__line:before {
583
+ display: var(--display-active-line);
584
+ content: "";
585
+ position: absolute;
586
+ right: calc(50% - 0.2rem);
587
+ bottom: 0.0625rem;
588
+ border-radius: 0.0625rem;
589
+ background: var(--components-menu-stepper-standard-progressbar);
590
+ width: calc(0.5rem - 0.125rem - 0.01rem);
591
+ height: calc(0.5rem - 0.125rem - 0.01rem);
592
+ transform: rotate(45deg);
800
593
  }
801
- .eds-side-navigation--collapsed .eds-side-navigation-group__trigger {
802
- padding-left: 2rem;
594
+ .eds-contrast .eds-stepper__step__line:before {
595
+ background: var(--components-menu-stepper-contrast-progressbar);
803
596
  }
804
- .eds-side-navigation-group__trigger:focus-visible {
805
- outline: 2px solid #181c56;
806
- outline-color: var(--basecolors-stroke-focus-standard);
807
- outline-offset: 0.125rem;
597
+ .eds-stepper__step__line:after {
598
+ display: var(--display-active-line);
599
+ content: "";
600
+ position: absolute;
601
+ left: 0;
602
+ bottom: 0;
603
+ width: 50%;
604
+ height: 0.5rem;
605
+ background: var(--components-menu-stepper-standard-progressbar);
606
+ }
607
+ .eds-contrast .eds-stepper__step__line:after {
608
+ background: var(--components-menu-stepper-contrast-progressbar);
609
+ }
610
+ /* DO NOT CHANGE!*/
611
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
612
+ /* DO NOT CHANGE!*/
613
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
614
+ /* DO NOT CHANGE!*/
615
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
616
+ [data-color-mode=light],
617
+ :root {
618
+ --components-menu-breadcrumb-contrast-icon: #ffffff;
619
+ --components-menu-breadcrumb-contrast-text: #ffffff;
620
+ --components-menu-breadcrumb-standard-icon: #181c56;
621
+ --components-menu-breadcrumb-standard-text: #181c56;
622
+ --components-menu-navigationbar-contrast-background: #393d79;
623
+ --components-menu-navigationbar-contrast-divide: rgba(255, 255, 255, 0);
624
+ --components-menu-navigationbar-contrast-icon-selected: #ffffff;
625
+ --components-menu-navigationbar-contrast-icon-unselected: #d9dae8;
626
+ --components-menu-navigationbar-contrast-stroke-selected: #ff5959;
627
+ --components-menu-navigationbar-contrast-text-selected: #ffffff;
628
+ --components-menu-navigationbar-contrast-text-unselected: #d9dae8;
629
+ --components-menu-navigationbar-standard-background: #ffffff;
630
+ --components-menu-navigationbar-standard-divide: #e3e6e8;
631
+ --components-menu-navigationbar-standard-icon-selected: #181c56;
632
+ --components-menu-navigationbar-standard-icon-unselected: #626493;
633
+ --components-menu-navigationbar-standard-stroke-selected: #ff5959;
634
+ --components-menu-navigationbar-standard-text-selected: #181c56;
635
+ --components-menu-navigationbar-standard-text-unselected: #626493;
636
+ --components-menu-navigationlink-contrast-icon: #ffffff;
637
+ --components-menu-navigationlink-contrast-text: #ffffff;
638
+ --components-menu-navigationlink-standard-icon: #181c56;
639
+ --components-menu-navigationlink-standard-text: #181c56;
640
+ --components-menu-overflowmenu-border: #8284ab;
641
+ --components-menu-overflowmenu-fill-active: #aeb7e2;
642
+ --components-menu-overflowmenu-fill-default: #f2f5f7;
643
+ --components-menu-overflowmenu-fill-hover: #d9ddf2;
644
+ --components-menu-overflowmenu-icon: #181c56;
645
+ --components-menu-overflowmenu-icon-disabled: #6e6f73;
646
+ --components-menu-overflowmenu-text: #181c56;
647
+ --components-menu-overflowmenu-text-disabled: #6e6f73;
648
+ --components-menu-pagination-contrast-active: #8794d4;
649
+ --components-menu-pagination-contrast-border-selected: #ffffff;
650
+ --components-menu-pagination-contrast-border-unselected: rgba(174, 183, 226, 0.6980392157);
651
+ --components-menu-pagination-contrast-default: rgba(255, 255, 255, 0);
652
+ --components-menu-pagination-contrast-hover: #626493;
653
+ --components-menu-pagination-contrast-icon: #ffffff;
654
+ --components-menu-pagination-contrast-text-selected: #181c56;
655
+ --components-menu-pagination-contrast-text-subdued: #d9dae8;
656
+ --components-menu-pagination-contrast-text-unselected: #ffffff;
657
+ --components-menu-pagination-standard-active: #aeb7e2;
658
+ --components-menu-pagination-standard-border-selected: #181c56;
659
+ --components-menu-pagination-standard-border-unselected: rgba(84, 86, 140, 0.4);
660
+ --components-menu-pagination-standard-default: rgba(255, 255, 255, 0);
661
+ --components-menu-pagination-standard-hover: #d9ddf2;
662
+ --components-menu-pagination-standard-icon: #181c56;
663
+ --components-menu-pagination-standard-text-selected: #181c56;
664
+ --components-menu-pagination-standard-text-subdued: #626493;
665
+ --components-menu-pagination-standard-text-unselected: #181c56;
666
+ --components-menu-sidenavigation-contrast-avatar: #393d79;
667
+ --components-menu-sidenavigation-contrast-background: #181c56;
668
+ --components-menu-sidenavigation-contrast-divide: #8284ab;
669
+ --components-menu-sidenavigation-contrast-fill-active: rgba(255, 255, 255, 0);
670
+ --components-menu-sidenavigation-contrast-fill-default: rgba(255, 255, 255, 0);
671
+ --components-menu-sidenavigation-contrast-fill-hover: #393d79;
672
+ --components-menu-sidenavigation-contrast-icon: #ffffff;
673
+ --components-menu-sidenavigation-contrast-icon-disabled: #b6b8ba;
674
+ --components-menu-sidenavigation-contrast-icon-label: #aeb7e2;
675
+ --components-menu-sidenavigation-contrast-label: #aeb7e2;
676
+ --components-menu-sidenavigation-contrast-stroke-selected: #ff5959;
677
+ --components-menu-sidenavigation-contrast-text: #ffffff;
678
+ --components-menu-sidenavigation-contrast-text-disabled: #b6b8ba;
679
+ --components-menu-sidenavigation-standard-avatar: #ffffff;
680
+ --components-menu-sidenavigation-standard-background: #f2f5f7;
681
+ --components-menu-sidenavigation-standard-divide: #e3e6e8;
682
+ --components-menu-sidenavigation-standard-fill-active: rgba(255, 255, 255, 0);
683
+ --components-menu-sidenavigation-standard-fill-default: rgba(255, 255, 255, 0);
684
+ --components-menu-sidenavigation-standard-fill-hover: #d9dae8;
685
+ --components-menu-sidenavigation-standard-icon: #181c56;
686
+ --components-menu-sidenavigation-standard-icon-disabled: #6e6f73;
687
+ --components-menu-sidenavigation-standard-icon-label: #626493;
688
+ --components-menu-sidenavigation-standard-label: #626493;
689
+ --components-menu-sidenavigation-standard-stroke-selected: #181c56;
690
+ --components-menu-sidenavigation-standard-text: #181c56;
691
+ --components-menu-sidenavigation-standard-text-disabled: #6e6f73;
692
+ --components-menu-stepper-contrast-background: #626493;
693
+ --components-menu-stepper-contrast-progressbar: #aeb7e2;
694
+ --components-menu-stepper-contrast-text-completed: #ffffff;
695
+ --components-menu-stepper-contrast-text-uncompleted: #aeb7e2;
696
+ --components-menu-stepper-standard-background: #e3e6e8;
697
+ --components-menu-stepper-standard-progressbar: #181c56;
698
+ --components-menu-stepper-standard-text-completed: #181c56;
699
+ --components-menu-stepper-standard-text-uncompleted: #6e6f73;
700
+ --components-menu-tableofcontent-contrast-icon-selected: #ffffff;
701
+ --components-menu-tableofcontent-contrast-icon-unselected: #d9dae8;
702
+ --components-menu-tableofcontent-contrast-stroke-selected: #ff5959;
703
+ --components-menu-tableofcontent-contrast-stroke-unselected: #54568c;
704
+ --components-menu-tableofcontent-contrast-text-selected: #ffffff;
705
+ --components-menu-tableofcontent-contrast-text-unselected: #d9dae8;
706
+ --components-menu-tableofcontent-standard-icon-selected: #181c56;
707
+ --components-menu-tableofcontent-standard-icon-unselected: #626493;
708
+ --components-menu-tableofcontent-standard-stroke-selected: #ff5959;
709
+ --components-menu-tableofcontent-standard-stroke-unselected: #e3e6e8;
710
+ --components-menu-tableofcontent-standard-text-selected: #181c56;
711
+ --components-menu-tableofcontent-standard-text-unselected: #626493;
712
+ }
713
+
714
+ [data-color-mode=dark] {
715
+ --components-menu-breadcrumb-contrast-icon: #e5e5e9;
716
+ --components-menu-breadcrumb-contrast-text: #e5e5e9;
717
+ --components-menu-breadcrumb-standard-icon: #e5e5e9;
718
+ --components-menu-breadcrumb-standard-text: #e5e5e9;
719
+ --components-menu-navigationbar-contrast-background: #393a49;
720
+ --components-menu-navigationbar-contrast-divide: rgba(255, 255, 255, 0);
721
+ --components-menu-navigationbar-contrast-icon-selected: #e5e5e9;
722
+ --components-menu-navigationbar-contrast-icon-unselected: #b6b8ba;
723
+ --components-menu-navigationbar-contrast-stroke-selected: #ff9494;
724
+ --components-menu-navigationbar-contrast-text-selected: #e5e5e9;
725
+ --components-menu-navigationbar-contrast-text-unselected: #b6b8ba;
726
+ --components-menu-navigationbar-standard-background: #393a49;
727
+ --components-menu-navigationbar-standard-divide: rgba(255, 255, 255, 0);
728
+ --components-menu-navigationbar-standard-icon-selected: #e5e5e9;
729
+ --components-menu-navigationbar-standard-icon-unselected: #b6b8ba;
730
+ --components-menu-navigationbar-standard-stroke-selected: #ff9494;
731
+ --components-menu-navigationbar-standard-text-selected: #e5e5e9;
732
+ --components-menu-navigationbar-standard-text-unselected: #b6b8ba;
733
+ --components-menu-navigationlink-contrast-icon: #e5e5e9;
734
+ --components-menu-navigationlink-contrast-text: #e5e5e9;
735
+ --components-menu-navigationlink-standard-icon: #e5e5e9;
736
+ --components-menu-navigationlink-standard-text: #e5e5e9;
737
+ --components-menu-overflowmenu-border: rgba(255, 255, 255, 0);
738
+ --components-menu-overflowmenu-fill-active: #8794d4;
739
+ --components-menu-overflowmenu-fill-default: #464755;
740
+ --components-menu-overflowmenu-fill-hover: #626493;
741
+ --components-menu-overflowmenu-icon: #e5e5e9;
742
+ --components-menu-overflowmenu-icon-disabled: #949699;
743
+ --components-menu-overflowmenu-text: #e5e5e9;
744
+ --components-menu-overflowmenu-text-disabled: #949699;
745
+ --components-menu-pagination-contrast-active: #8794d4;
746
+ --components-menu-pagination-contrast-border-selected: #e5e5e9;
747
+ --components-menu-pagination-contrast-border-unselected: rgba(174, 183, 226, 0.6980392157);
748
+ --components-menu-pagination-contrast-default: rgba(255, 255, 255, 0);
749
+ --components-menu-pagination-contrast-hover: #626493;
750
+ --components-menu-pagination-contrast-icon: #e5e5e9;
751
+ --components-menu-pagination-contrast-text-selected: #08091c;
752
+ --components-menu-pagination-contrast-text-subdued: #b3b4bd;
753
+ --components-menu-pagination-contrast-text-unselected: #e5e5e9;
754
+ --components-menu-pagination-standard-active: #8794d4;
755
+ --components-menu-pagination-standard-border-selected: #e5e5e9;
756
+ --components-menu-pagination-standard-border-unselected: rgba(174, 183, 226, 0.6980392157);
757
+ --components-menu-pagination-standard-default: rgba(255, 255, 255, 0);
758
+ --components-menu-pagination-standard-hover: #626493;
759
+ --components-menu-pagination-standard-icon: #e5e5e9;
760
+ --components-menu-pagination-standard-text-selected: #08091c;
761
+ --components-menu-pagination-standard-text-subdued: #b3b4bd;
762
+ --components-menu-pagination-standard-text-unselected: #e5e5e9;
763
+ --components-menu-sidenavigation-contrast-avatar: rgba(229, 229, 233, 0.1490196078);
764
+ --components-menu-sidenavigation-contrast-background: #212233;
765
+ --components-menu-sidenavigation-contrast-divide: #81828f;
766
+ --components-menu-sidenavigation-contrast-fill-active: rgba(255, 255, 255, 0);
767
+ --components-menu-sidenavigation-contrast-fill-default: rgba(255, 255, 255, 0);
768
+ --components-menu-sidenavigation-contrast-fill-hover: rgba(229, 229, 233, 0.1490196078);
769
+ --components-menu-sidenavigation-contrast-icon: #e5e5e9;
770
+ --components-menu-sidenavigation-contrast-icon-disabled: #949699;
771
+ --components-menu-sidenavigation-contrast-icon-label: #b3b4bd;
772
+ --components-menu-sidenavigation-contrast-label: #b3b4bd;
773
+ --components-menu-sidenavigation-contrast-stroke-selected: #ff9494;
774
+ --components-menu-sidenavigation-contrast-text: #e5e5e9;
775
+ --components-menu-sidenavigation-contrast-text-disabled: #949699;
776
+ --components-menu-sidenavigation-standard-avatar: rgba(229, 229, 233, 0.1490196078);
777
+ --components-menu-sidenavigation-standard-background: #212233;
778
+ --components-menu-sidenavigation-standard-divide: #81828f;
779
+ --components-menu-sidenavigation-standard-fill-active: rgba(255, 255, 255, 0);
780
+ --components-menu-sidenavigation-standard-fill-default: rgba(255, 255, 255, 0);
781
+ --components-menu-sidenavigation-standard-fill-hover: rgba(229, 229, 233, 0.1490196078);
782
+ --components-menu-sidenavigation-standard-icon: #e5e5e9;
783
+ --components-menu-sidenavigation-standard-icon-disabled: #949699;
784
+ --components-menu-sidenavigation-standard-icon-label: #b3b4bd;
785
+ --components-menu-sidenavigation-standard-label: #b3b4bd;
786
+ --components-menu-sidenavigation-standard-stroke-selected: #ff9494;
787
+ --components-menu-sidenavigation-standard-text: #e5e5e9;
788
+ --components-menu-sidenavigation-standard-text-disabled: #949699;
789
+ --components-menu-stepper-contrast-background: #626493;
790
+ --components-menu-stepper-contrast-progressbar: #aeb7e2;
791
+ --components-menu-stepper-contrast-text-completed: #e5e5e9;
792
+ --components-menu-stepper-contrast-text-uncompleted: #b6b8ba;
793
+ --components-menu-stepper-standard-background: #626493;
794
+ --components-menu-stepper-standard-progressbar: #aeb7e2;
795
+ --components-menu-stepper-standard-text-completed: #e5e5e9;
796
+ --components-menu-stepper-standard-text-uncompleted: #b6b8ba;
797
+ --components-menu-tableofcontent-contrast-icon-selected: #e5e5e9;
798
+ --components-menu-tableofcontent-contrast-icon-unselected: #b3b4bd;
799
+ --components-menu-tableofcontent-contrast-stroke-selected: #ff9494;
800
+ --components-menu-tableofcontent-contrast-stroke-unselected: rgba(84, 86, 140, 0.4);
801
+ --components-menu-tableofcontent-contrast-text-selected: #e5e5e9;
802
+ --components-menu-tableofcontent-contrast-text-unselected: #b3b4bd;
803
+ --components-menu-tableofcontent-standard-icon-selected: #e5e5e9;
804
+ --components-menu-tableofcontent-standard-icon-unselected: #b3b4bd;
805
+ --components-menu-tableofcontent-standard-stroke-selected: #ff9494;
806
+ --components-menu-tableofcontent-standard-stroke-unselected: rgba(84, 86, 140, 0.4);
807
+ --components-menu-tableofcontent-standard-text-selected: #e5e5e9;
808
+ --components-menu-tableofcontent-standard-text-unselected: #b3b4bd;
808
809
  }
809
- .eds-contrast .eds-side-navigation-group__trigger:focus-visible {
810
- outline-color: var(--basecolors-stroke-focus-contrast);
811
- }/* DO NOT CHANGE!*/
810
+
811
+ /* DO NOT CHANGE!*/
812
812
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
813
- .eds-stepper {
814
- --text-color: var(--components-menu-stepper-standard-text-uncompleted);
815
- --line-color: var(--components-menu-stepper-standard-background);
816
- --label-font-weight: 500;
817
- --display-active-line: none;
818
- display: flex;
819
- flex-direction: row;
820
- width: 100%;
821
- list-style-type: none;
822
- }
823
- .eds-stepper__step {
824
- display: flex;
825
- flex-grow: 1;
826
- flex-basis: 0;
827
- flex-direction: column;
828
- align-items: inherit;
829
- appearance: none;
830
- background: none;
831
- border: none;
832
- font-family: inherit;
833
- text-transform: none;
834
- }
835
- .eds-stepper__step:focus-visible .eds-stepper__step__label {
836
- outline-offset: 0.125rem;
837
- outline: 2px solid #181c56;
838
- }
839
- .eds-contrast .eds-stepper__step:focus-visible .eds-stepper__step__label {
840
- outline: 2px solid #ffffff;
841
- }
842
- .eds-contrast .eds-stepper__step {
843
- --text-color: var(--components-menu-stepper-contrast-text-uncompleted);
844
- --line-color: var(--components-menu-stepper-contrast-background);
845
- }
846
- .eds-stepper__step__wrapper {
847
- flex-grow: 1;
848
- }
849
- .eds-stepper__step--interactive {
850
- all: unset;
851
- display: flex;
852
- flex-direction: column;
853
- width: 100%;
854
- cursor: pointer;
855
- }
856
- .eds-stepper__step--active {
857
- --text-color: var(--components-menu-stepper-standard-text-uncompleted);
858
- --label-font-weight: 600;
859
- --display-active-line: block;
860
- }
861
- .eds-contrast .eds-stepper__step--active {
862
- --text-color: var(--components-menu-stepper-contrast-text-uncompleted);
863
- }
864
- .eds-stepper__step--completed {
865
- --text-color: var(--components-menu-stepper-standard-text-completed);
866
- --line-color: var(--components-menu-stepper-standard-progressbar);
867
- }
868
- .eds-contrast .eds-stepper__step--completed {
869
- --text-color: var(--components-menu-stepper-contrast-text-completed);
870
- --line-color: var(--components-menu-stepper-contrast-progressbar);
871
- }
872
- .eds-stepper__step__label {
873
- flex-grow: 1;
874
- flex-direction: column;
875
- align-self: center;
876
- text-align: center;
877
- font-size: 0.875rem;
878
- margin: 0.5rem 0 0;
879
- padding: 0 0.5rem;
880
- width: fit-content;
881
- border-radius: 0.0625rem;
882
- color: var(--text-color);
883
- font-weight: var(--label-font-weight);
884
- }
885
- .eds-stepper__step--interactive:hover .eds-stepper__step__label {
886
- background-color: var(--components-menu-stepper-standard-background);
887
- color: var(--components-menu-stepper-standard-text-completed);
888
- }
889
- .eds-contrast .eds-stepper__step--interactive:hover .eds-stepper__step__label {
890
- background-color: var(--components-menu-stepper-contrast-background);
891
- color: var(--components-menu-stepper-contrast-text-completed);
892
- }
893
- .eds-stepper__step__line {
894
- height: 0.5rem;
895
- background: var(--line-color);
896
- position: relative;
897
- }
898
- .eds-stepper__step__line:before {
899
- display: var(--display-active-line);
900
- content: "";
901
- position: absolute;
902
- right: calc(50% - 0.2rem);
903
- bottom: 0.0625rem;
904
- border-radius: 0.0625rem;
905
- background: var(--components-menu-stepper-standard-progressbar);
906
- width: calc(0.5rem - 0.125rem - 0.01rem);
907
- height: calc(0.5rem - 0.125rem - 0.01rem);
908
- transform: rotate(45deg);
813
+ /* DO NOT CHANGE!*/
814
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
815
+ [data-color-mode=light],
816
+ :root {
817
+ --basecolors-frame-contrast: #181c56;
818
+ --basecolors-frame-contrastalt: #393d79;
819
+ --basecolors-frame-contrastalt-2: #292b6a;
820
+ --basecolors-frame-default: #ffffff;
821
+ --basecolors-frame-elevated: #ffffff;
822
+ --basecolors-frame-elevatedalt: #f6f6f9;
823
+ --basecolors-frame-subdued: #d9dae8;
824
+ --basecolors-frame-tint: #f6f6f9;
825
+ --basecolors-shape-accent: #181c56;
826
+ --basecolors-shape-bicycle-contrast: #00db9b;
827
+ --basecolors-shape-bicycle-default: #388f76;
828
+ --basecolors-shape-bus-contrast: #ff6392;
829
+ --basecolors-shape-bus-default: #c5044e;
830
+ --basecolors-shape-cableway-contrast: #b482fb;
831
+ --basecolors-shape-cableway-default: #78469a;
832
+ --basecolors-shape-disabled: #6e6f73;
833
+ --basecolors-shape-disabledalt: #b6b8ba;
834
+ --basecolors-shape-ferry-contrast: #6fdfff;
835
+ --basecolors-shape-ferry-default: #0c6693;
836
+ --basecolors-shape-funicular-contrast: #b482fb;
837
+ --basecolors-shape-funicular-default: #78469a;
838
+ --basecolors-shape-helicopter-contrast: #fbafea;
839
+ --basecolors-shape-helicopter-default: #800664;
840
+ --basecolors-shape-highlight: #ff5959;
841
+ --basecolors-shape-light: #ffffff;
842
+ --basecolors-shape-mask: #ffffff;
843
+ --basecolors-shape-maskalt: #ffffff;
844
+ --basecolors-shape-metro-contrast: #f08901;
845
+ --basecolors-shape-metro-default: #bf5826;
846
+ --basecolors-shape-mobility-contrast: #00db9b;
847
+ --basecolors-shape-mobility-default: #388f76;
848
+ --basecolors-shape-plane-contrast: #fbafea;
849
+ --basecolors-shape-plane-default: #800664;
850
+ --basecolors-shape-subdued: #626493;
851
+ --basecolors-shape-subduedalt: #d9dae8;
852
+ --basecolors-shape-taxi-contrast: #ffe082;
853
+ --basecolors-shape-taxi-default: #3d3e40;
854
+ --basecolors-shape-train-contrast: #42a5f5;
855
+ --basecolors-shape-train-default: #00367f;
856
+ --basecolors-shape-tram-contrast: #b482fb;
857
+ --basecolors-shape-tram-default: #78469a;
858
+ --basecolors-shape-walk-contrast: #8284ab;
859
+ --basecolors-shape-walk-default: #8d8e9c;
860
+ --basecolors-shape-airportlinkbus-contrast: #fbafea;
861
+ --basecolors-shape-airportlinkbus-default: #800664;
862
+ --basecolors-shape-airportlinkrail-contrast: #fbafea;
863
+ --basecolors-shape-airportlinkrail-default: #800664;
864
+ --basecolors-stroke-contrast: #aeb7e2;
865
+ --basecolors-stroke-default: #181c56;
866
+ --basecolors-stroke-disabled: #949699;
867
+ --basecolors-stroke-focus-contrast: #aeb7e2;
868
+ --basecolors-stroke-focus-standard: #181c56;
869
+ --basecolors-stroke-highlight: #ff5959;
870
+ --basecolors-stroke-light: #ffffff;
871
+ --basecolors-stroke-subdued: #8284ab;
872
+ --basecolors-stroke-subduedalt: #e3e6e8;
873
+ --basecolors-text-accent: #181c56;
874
+ --basecolors-text-disabled: #6e6f73;
875
+ --basecolors-text-disabledalt: #b6b8ba;
876
+ --basecolors-text-highlight: #ff5959;
877
+ --basecolors-text-light: #ffffff;
878
+ --basecolors-text-subdued: #626493;
879
+ --basecolors-text-subduedalt: #d9dae8;
909
880
  }
910
- .eds-contrast .eds-stepper__step__line:before {
911
- background: var(--components-menu-stepper-contrast-progressbar);
881
+
882
+ [data-color-mode=dark] {
883
+ --basecolors-frame-contrast: #212233;
884
+ --basecolors-frame-contrastalt: #141527;
885
+ --basecolors-frame-contrastalt-2: #08091c;
886
+ --basecolors-frame-default: #08091c;
887
+ --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
888
+ --basecolors-frame-elevatedalt: #464755;
889
+ --basecolors-frame-subdued: #2d2e3e;
890
+ --basecolors-frame-tint: #141527;
891
+ --basecolors-shape-accent: #e5e5e9;
892
+ --basecolors-shape-bicycle-contrast: #4db295;
893
+ --basecolors-shape-bicycle-default: #4db295;
894
+ --basecolors-shape-bus-contrast: #ef7398;
895
+ --basecolors-shape-bus-default: #ef7398;
896
+ --basecolors-shape-cableway-contrast: #b898e5;
897
+ --basecolors-shape-cableway-default: #b898e5;
898
+ --basecolors-shape-disabled: #b6b8ba;
899
+ --basecolors-shape-disabledalt: #b3b4bd;
900
+ --basecolors-shape-ferry-contrast: #8ccfe2;
901
+ --basecolors-shape-ferry-default: #8ccfe2;
902
+ --basecolors-shape-funicular-contrast: #b898e5;
903
+ --basecolors-shape-funicular-default: #b898e5;
904
+ --basecolors-shape-helicopter-contrast: #f2b8e5;
905
+ --basecolors-shape-helicopter-default: #f2b8e5;
906
+ --basecolors-shape-highlight: #ff9494;
907
+ --basecolors-shape-light: #e5e5e9;
908
+ --basecolors-shape-mask: #2d2e3e;
909
+ --basecolors-shape-maskalt: #393a49;
910
+ --basecolors-shape-metro-contrast: #dd973c;
911
+ --basecolors-shape-metro-default: #dd973c;
912
+ --basecolors-shape-mobility-contrast: #4db295;
913
+ --basecolors-shape-mobility-default: #4db295;
914
+ --basecolors-shape-plane-contrast: #f2b8e5;
915
+ --basecolors-shape-plane-default: #f2b8e5;
916
+ --basecolors-shape-subdued: #b3b4bd;
917
+ --basecolors-shape-subduedalt: #b3b4bd;
918
+ --basecolors-shape-taxi-contrast: #ffe082;
919
+ --basecolors-shape-taxi-default: #ffe082;
920
+ --basecolors-shape-train-contrast: #60a2d7;
921
+ --basecolors-shape-train-default: #60a2d7;
922
+ --basecolors-shape-tram-contrast: #b898e5;
923
+ --basecolors-shape-tram-default: #b898e5;
924
+ --basecolors-shape-walk-contrast: #8d8e9c;
925
+ --basecolors-shape-walk-default: #8d8e9c;
926
+ --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
927
+ --basecolors-shape-airportlinkbus-default: #f2b8e5;
928
+ --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
929
+ --basecolors-shape-airportlinkrail-default: #f2b8e5;
930
+ --basecolors-stroke-contrast: #aeb7e2;
931
+ --basecolors-stroke-default: #b3b4bd;
932
+ --basecolors-stroke-disabled: #e3e6e8;
933
+ --basecolors-stroke-focus-contrast: #aeb7e2;
934
+ --basecolors-stroke-focus-standard: #aeb7e2;
935
+ --basecolors-stroke-highlight: #ff9494;
936
+ --basecolors-stroke-light: #b3b4bd;
937
+ --basecolors-stroke-subdued: #81828f;
938
+ --basecolors-stroke-subduedalt: #949699;
939
+ --basecolors-text-accent: #e5e5e9;
940
+ --basecolors-text-disabled: #b6b8ba;
941
+ --basecolors-text-disabledalt: #b6b8ba;
942
+ --basecolors-text-highlight: #ff9494;
943
+ --basecolors-text-light: #e5e5e9;
944
+ --basecolors-text-subdued: #b3b4bd;
945
+ --basecolors-text-subduedalt: #b3b4bd;
912
946
  }
913
- .eds-stepper__step__line:after {
914
- display: var(--display-active-line);
915
- content: "";
916
- position: absolute;
917
- left: 0;
918
- bottom: 0;
919
- width: 50%;
920
- height: 0.5rem;
921
- background: var(--components-menu-stepper-standard-progressbar);
947
+
948
+ :root {
949
+ --eds-menu: 1;
950
+ --reach-menu-button: 1;
922
951
  }
923
- .eds-contrast .eds-stepper__step__line:after {
924
- background: var(--components-menu-stepper-contrast-progressbar);
925
- }/* DO NOT CHANGE!*/
952
+ /* DO NOT CHANGE!*/
926
953
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
927
954
  .eds-top-navigation-item {
928
955
  --show-active-line: 0;
929
956
  display: inline-block;
930
957
  cursor: pointer;
931
958
  color: var(--components-menu-navigationbar-standard-text-unselected);
959
+ -webkit-text-decoration: none;
932
960
  text-decoration: none;
933
961
  position: relative;
934
962
  padding: 1rem;
935
963
  min-width: 5rem;
964
+ width: -moz-fit-content;
936
965
  width: fit-content;
937
966
  text-align: center;
938
967
  font-family: inherit;
@@ -976,4 +1005,4 @@
976
1005
  }
977
1006
  .eds-contrast .eds-top-navigation-item--active {
978
1007
  color: var(--components-menu-navigationbar-contrast-text-selected);
979
- }
1008
+ }