@entur/menu 4.1.28 → 4.1.29-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/styles.css +191 -192
  2. package/package.json +2 -2
package/dist/styles.css CHANGED
@@ -3,54 +3,50 @@
3
3
  --reach-menu-button: 1;
4
4
  }/* DO NOT CHANGE!*/
5
5
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
6
- .eds-top-navigation-item {
7
- --show-active-line: 0;
6
+ .eds-breadcrumb {
7
+ list-style: none;
8
+ margin: 0;
9
+ padding: 0;
10
+ }
11
+
12
+ .eds-breadcrumb__item {
8
13
  display: inline-block;
9
- cursor: pointer;
10
- color: inherit;
11
- text-decoration: none;
12
- position: relative;
13
- padding: 1rem;
14
- min-width: 5rem;
15
- width: -moz-fit-content;
16
- width: fit-content;
17
- text-align: center;
18
- font-family: inherit;
19
- font-size: 1rem;
20
- font-weight: 600;
21
14
  }
22
- .eds-top-navigation-item::after {
23
- content: "";
24
- display: block;
25
- bottom: 1rem;
26
- height: 0.1875rem;
27
- width: 0;
28
- margin: 0 auto;
29
- opacity: var(--show-active-line);
30
- background: #ff5959;
31
- transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
15
+
16
+ .eds-breadcrumb__separator {
17
+ margin: 0 0.25rem 0 0.25rem;
32
18
  }
33
- .eds-top-navigation-item:focus {
34
- outline-offset: 0.125rem;
35
- outline: none;
36
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
19
+
20
+ .eds-breadcrumb__link {
21
+ text-decoration: none;
22
+ color: inherit;
23
+ background-image: linear-gradient(120deg, #181c56 0%, #181c56 100%);
24
+ background-repeat: no-repeat;
25
+ background-size: 100% 0.125rem;
26
+ background-position: 0 100%;
37
27
  }
38
- .eds-contrast .eds-top-navigation-item:focus {
39
- box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
28
+ .eds-contrast .eds-breadcrumb__link {
29
+ background-image: linear-gradient(120deg, #ffffff 0%, #ffffff 100%);
40
30
  }
41
- .eds-top-navigation-item:hover {
42
- --show-active-line: 1;
31
+ .eds-breadcrumb__link:hover {
32
+ animation: eds-breadcrumb-underline 0.3s ease-in;
43
33
  }
44
- .eds-top-navigation-item:hover::after {
45
- width: 2rem;
34
+ .eds-breadcrumb__link:focus {
35
+ outline: none;
36
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
37
+ outline-offset: 0.125rem;
46
38
  }
47
- .eds-top-navigation-item--active {
48
- --show-active-line: 1;
39
+ @keyframes eds-breadcrumb-underline {
40
+ from {
41
+ background-size: 0% 0.125rem;
42
+ }
43
+ to {
44
+ background-size: 100% 0.125rem;
45
+ }
49
46
  }
50
- .eds-top-navigation-item--active::after {
51
- width: 2rem;
52
- }@charset "UTF-8";
53
- /* DO NOT CHANGE!*/
47
+ .eds-breadcrumb__link--current {
48
+ font-weight: 600;
49
+ }/* DO NOT CHANGE!*/
54
50
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
55
51
  /* DO NOT CHANGE!*/
56
52
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
@@ -140,7 +136,7 @@
140
136
  .eds-side-navigation .eds-side-navigation {
141
137
  background-color: #f3f3f3;
142
138
  }
143
- .eds-contrast .eds-side-navigation .eds-side-navigation  {
139
+ .eds-contrast .eds-side-navigation .eds-side-navigation {
144
140
  background-color: #292b6a;
145
141
  }
146
142
  .eds-side-navigation--collapsed {
@@ -208,7 +204,7 @@
208
204
  outline-offset: -2px;
209
205
  background: #ebebf1;
210
206
  }
211
- .eds-contrast .eds-side-navigation__click-target:not([disabled]):active , .eds-contrast .eds-side-navigation__click-target:not([disabled]):focus  {
207
+ .eds-contrast .eds-side-navigation__click-target:not([disabled]):active, .eds-contrast .eds-side-navigation__click-target:not([disabled]):focus {
212
208
  background-color: #54568c;
213
209
  outline: 2px solid #ffffff;
214
210
  }
@@ -271,49 +267,170 @@
271
267
  outline: 2px solid #ffffff;
272
268
  }/* DO NOT CHANGE!*/
273
269
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
274
- .eds-breadcrumb {
275
- list-style: none;
276
- margin: 0;
277
- padding: 0;
278
- }
279
-
280
- .eds-breadcrumb__item {
270
+ .eds-top-navigation-item {
271
+ --show-active-line: 0;
281
272
  display: inline-block;
273
+ cursor: pointer;
274
+ color: inherit;
275
+ text-decoration: none;
276
+ position: relative;
277
+ padding: 1rem;
278
+ min-width: 5rem;
279
+ width: -moz-fit-content;
280
+ width: fit-content;
281
+ text-align: center;
282
+ font-family: inherit;
283
+ font-size: 1rem;
284
+ font-weight: 600;
282
285
  }
283
-
284
- .eds-breadcrumb__separator {
285
- margin: 0 0.25rem 0 0.25rem;
286
+ .eds-top-navigation-item::after {
287
+ content: "";
288
+ display: block;
289
+ bottom: 1rem;
290
+ height: 0.1875rem;
291
+ width: 0;
292
+ margin: 0 auto;
293
+ opacity: var(--show-active-line);
294
+ background: #ff5959;
295
+ transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
286
296
  }
287
-
288
- .eds-breadcrumb__link {
289
- text-decoration: none;
290
- color: inherit;
291
- background-image: linear-gradient(120deg, #181c56 0%, #181c56 100%);
292
- background-repeat: no-repeat;
293
- background-size: 100% 0.125rem;
294
- background-position: 0 100%;
297
+ .eds-top-navigation-item:focus {
298
+ outline-offset: 0.125rem;
299
+ outline: none;
300
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
295
301
  }
296
- .eds-contrast .eds-breadcrumb__link {
297
- background-image: linear-gradient(120deg, #ffffff 0%, #ffffff 100%);
302
+ .eds-contrast .eds-top-navigation-item:focus {
303
+ box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
298
304
  }
299
- .eds-breadcrumb__link:hover {
300
- animation: eds-breadcrumb-underline 0.3s ease-in;
305
+ .eds-top-navigation-item:hover {
306
+ --show-active-line: 1;
301
307
  }
302
- .eds-breadcrumb__link:focus {
308
+ .eds-top-navigation-item:hover::after {
309
+ width: 2rem;
310
+ }
311
+ .eds-top-navigation-item--active {
312
+ --show-active-line: 1;
313
+ }
314
+ .eds-top-navigation-item--active::after {
315
+ width: 2rem;
316
+ }/* DO NOT CHANGE!*/
317
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
318
+ .eds-stepper {
319
+ display: flex;
320
+ flex-direction: row;
321
+ }
322
+ .eds-stepper__item__container {
323
+ cursor: pointer;
324
+ font-family: inherit;
325
+ text-transform: none;
326
+ -webkit-appearance: none;
327
+ -moz-appearance: none;
328
+ appearance: none;
329
+ background: none;
330
+ border: none;
331
+ margin: 0;
332
+ padding: 0;
333
+ align-items: inherit;
334
+ display: flex;
335
+ flex-grow: 1;
336
+ flex-basis: 0;
337
+ flex-direction: column;
338
+ margin-left: 0.25rem;
339
+ }
340
+ .eds-stepper__item__container--non-interactive {
341
+ cursor: default;
342
+ }
343
+ .eds-stepper__item__container:focus {
344
+ outline-offset: 0.125rem;
303
345
  outline: none;
304
346
  box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
305
- outline-offset: 0.125rem;
306
347
  }
307
- @keyframes eds-breadcrumb-underline {
308
- from {
309
- background-size: 0% 0.125rem;
310
- }
311
- to {
312
- background-size: 100% 0.125rem;
313
- }
348
+ .eds-contrast .eds-stepper__item__container:focus {
349
+ box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
314
350
  }
315
- .eds-breadcrumb__link--current {
351
+ .eds-stepper__item__container:first-child {
352
+ margin-left: 0;
353
+ }
354
+ .eds-stepper__item__label {
355
+ cursor: inherit;
356
+ flex-grow: 1;
357
+ flex-direction: column;
358
+ text-align: center;
359
+ font-size: 0.875rem;
360
+ padding: 0.25rem 1rem;
361
+ }
362
+ .eds-stepper__item__label--active {
316
363
  font-weight: 600;
364
+ }
365
+ .eds-stepper__item__label.eds-stepper__item__label--active {
366
+ color: #181c56;
367
+ }
368
+ .eds-contrast .eds-stepper__item__label.eds-stepper__item__label--active {
369
+ color: #ffffff;
370
+ }
371
+ .eds-stepper__item__label.eds-stepper__item__label--has-been {
372
+ color: #181c56;
373
+ }
374
+ .eds-contrast .eds-stepper__item__label.eds-stepper__item__label--has-been {
375
+ color: #ffffff;
376
+ }
377
+ .eds-stepper__item__square {
378
+ height: 0.5rem;
379
+ }
380
+ .eds-stepper__item__square--active {
381
+ color: inherit;
382
+ background: #e9e9e9;
383
+ position: relative;
384
+ }
385
+ .eds-stepper__item__square--active:before {
386
+ background: #181c56;
387
+ content: "";
388
+ position: absolute;
389
+ right: calc(50% - 0.2rem);
390
+ border-radius: 0.0625rem;
391
+ bottom: 0.0625rem;
392
+ width: calc(
393
+ 0.5rem - 0.125rem - 0.01rem
394
+ );
395
+ height: calc(
396
+ 0.5rem - 0.125rem - 0.01rem
397
+ );
398
+ transform: rotate(45deg);
399
+ }
400
+ .eds-contrast .eds-stepper__item__square--active:before {
401
+ border-left-color: #aeb7e2;
402
+ border-left-color: #aeb7e2;
403
+ }
404
+ .eds-stepper__item__square--active:after {
405
+ content: "";
406
+ position: absolute;
407
+ left: 0;
408
+ bottom: 0;
409
+ width: 50%;
410
+ height: 0.5rem;
411
+ background: #181c56;
412
+ }
413
+ .eds-contrast .eds-stepper__item__square--active:after {
414
+ background: #aeb7e2;
415
+ }
416
+ .eds-contrast .eds-stepper__item__square--active {
417
+ background: #aeb7e2;
418
+ background: #393d79;
419
+ }
420
+ .eds-stepper__item__square--inactive {
421
+ color: #656782;
422
+ background: #e9e9e9;
423
+ }
424
+ .eds-contrast .eds-stepper__item__square--inactive {
425
+ color: #aeb7e2;
426
+ background: #393d79;
427
+ }
428
+ .eds-stepper__item__square--has-been {
429
+ color: inherit;
430
+ background: #181c56;
431
+ }
432
+ .eds-contrast .eds-stepper__item__square--has-been {
433
+ background: #aeb7e2;
317
434
  }/* DO NOT CHANGE!*/
318
435
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
319
436
  .eds-pagination {
@@ -558,122 +675,4 @@
558
675
  [data-reach-menu-popover] .eds-overflow-menu__menu-list--left {
559
676
  position: relative;
560
677
  right: calc(100% - 2rem);
561
- }/* DO NOT CHANGE!*/
562
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
563
- .eds-stepper {
564
- display: flex;
565
- flex-direction: row;
566
- }
567
- .eds-stepper__item__container {
568
- cursor: pointer;
569
- font-family: inherit;
570
- text-transform: none;
571
- -webkit-appearance: none;
572
- -moz-appearance: none;
573
- appearance: none;
574
- background: none;
575
- border: none;
576
- margin: 0;
577
- padding: 0;
578
- align-items: inherit;
579
- display: flex;
580
- flex-grow: 1;
581
- flex-basis: 0;
582
- flex-direction: column;
583
- margin-left: 0.25rem;
584
- }
585
- .eds-stepper__item__container--non-interactive {
586
- cursor: default;
587
- }
588
- .eds-stepper__item__container:focus {
589
- outline-offset: 0.125rem;
590
- outline: none;
591
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
592
- }
593
- .eds-contrast .eds-stepper__item__container:focus {
594
- box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
595
- }
596
- .eds-stepper__item__container:first-child {
597
- margin-left: 0;
598
- }
599
- .eds-stepper__item__label {
600
- cursor: inherit;
601
- flex-grow: 1;
602
- flex-direction: column;
603
- text-align: center;
604
- font-size: 0.875rem;
605
- padding: 0.25rem 1rem;
606
- }
607
- .eds-stepper__item__label--active {
608
- font-weight: 600;
609
- }
610
- .eds-stepper__item__label.eds-stepper__item__label--active {
611
- color: #181c56;
612
- }
613
- .eds-contrast .eds-stepper__item__label.eds-stepper__item__label--active {
614
- color: #ffffff;
615
- }
616
- .eds-stepper__item__label.eds-stepper__item__label--has-been {
617
- color: #181c56;
618
- }
619
- .eds-contrast .eds-stepper__item__label.eds-stepper__item__label--has-been {
620
- color: #ffffff;
621
- }
622
- .eds-stepper__item__square {
623
- height: 0.5rem;
624
- }
625
- .eds-stepper__item__square--active {
626
- color: inherit;
627
- background: #e9e9e9;
628
- position: relative;
629
- }
630
- .eds-stepper__item__square--active:before {
631
- background: #181c56;
632
- content: "";
633
- position: absolute;
634
- right: calc(50% - 0.2rem);
635
- border-radius: 0.0625rem;
636
- bottom: 0.0625rem;
637
- width: calc(
638
- 0.5rem - 0.125rem - 0.01rem
639
- );
640
- height: calc(
641
- 0.5rem - 0.125rem - 0.01rem
642
- );
643
- transform: rotate(45deg);
644
- }
645
- .eds-contrast .eds-stepper__item__square--active:before {
646
- border-left-color: #aeb7e2;
647
- border-left-color: #aeb7e2;
648
- }
649
- .eds-stepper__item__square--active:after {
650
- content: "";
651
- position: absolute;
652
- left: 0;
653
- bottom: 0;
654
- width: 50%;
655
- height: 0.5rem;
656
- background: #181c56;
657
- }
658
- .eds-contrast .eds-stepper__item__square--active:after {
659
- background: #aeb7e2;
660
- }
661
- .eds-contrast .eds-stepper__item__square--active {
662
- background: #aeb7e2;
663
- background: #393d79;
664
- }
665
- .eds-stepper__item__square--inactive {
666
- color: #656782;
667
- background: #e9e9e9;
668
- }
669
- .eds-contrast .eds-stepper__item__square--inactive {
670
- color: #aeb7e2;
671
- background: #393d79;
672
- }
673
- .eds-stepper__item__square--has-been {
674
- color: inherit;
675
- background: #181c56;
676
- }
677
- .eds-contrast .eds-stepper__item__square--has-been {
678
- background: #aeb7e2;
679
678
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/menu",
3
- "version": "4.1.28",
3
+ "version": "4.1.29-beta.1",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/menu.esm.js",
@@ -39,5 +39,5 @@
39
39
  "@reach/polymorphic": "0.18.0",
40
40
  "classnames": "^2.3.1"
41
41
  },
42
- "gitHead": "bc067536ed769de8072f19002ef4877a1e974443"
42
+ "gitHead": "8442e00a4b18aeba3c3e6d59f46fd808fcc4fd80"
43
43
  }