@entur/menu 4.1.34 → 4.1.36

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 +209 -209
  2. package/package.json +9 -9
package/dist/styles.css CHANGED
@@ -4,6 +4,55 @@
4
4
  }
5
5
  /* DO NOT CHANGE!*/
6
6
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
7
+ .eds-top-navigation-item {
8
+ --show-active-line: 0;
9
+ display: inline-block;
10
+ cursor: pointer;
11
+ color: inherit;
12
+ text-decoration: none;
13
+ position: relative;
14
+ padding: 1rem;
15
+ min-width: 5rem;
16
+ width: -moz-fit-content;
17
+ width: fit-content;
18
+ text-align: center;
19
+ font-family: inherit;
20
+ font-size: 1rem;
21
+ font-weight: 600;
22
+ }
23
+ .eds-top-navigation-item::after {
24
+ content: "";
25
+ display: block;
26
+ bottom: 1rem;
27
+ height: 0.1875rem;
28
+ width: 0;
29
+ margin: 0 auto;
30
+ opacity: var(--show-active-line);
31
+ background: #ff5959;
32
+ transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
33
+ }
34
+ .eds-top-navigation-item:focus {
35
+ outline-offset: 0.125rem;
36
+ outline: none;
37
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
38
+ }
39
+ .eds-contrast .eds-top-navigation-item:focus {
40
+ box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
41
+ }
42
+ .eds-top-navigation-item:hover {
43
+ --show-active-line: 1;
44
+ }
45
+ .eds-top-navigation-item:hover::after {
46
+ width: 2rem;
47
+ }
48
+ .eds-top-navigation-item--active {
49
+ --show-active-line: 1;
50
+ }
51
+ .eds-top-navigation-item--active::after {
52
+ width: 2rem;
53
+ }
54
+ /* DO NOT CHANGE!*/
55
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
7
56
  .eds-breadcrumb {
8
57
  list-style: none;
9
58
  margin: 0;
@@ -50,6 +99,166 @@
50
99
  }
51
100
  /* DO NOT CHANGE!*/
52
101
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
102
+ .eds-pagination {
103
+ align-items: center;
104
+ display: flex;
105
+ flex-wrap: wrap;
106
+ row-gap: 0.75rem;
107
+ justify-content: space-between;
108
+ }
109
+ .eds-pagination__results {
110
+ align-items: center;
111
+ display: flex;
112
+ flex: 1;
113
+ justify-content: flex-start;
114
+ }
115
+ .eds-pagination__results-label {
116
+ margin-right: 0.5rem;
117
+ }
118
+ .eds-pagination__controls {
119
+ align-items: center;
120
+ display: flex;
121
+ justify-content: center;
122
+ }
123
+ .eds-pagination__results:first-of-type:last-of-type, .eds-pagination__controls:first-of-type:last-of-type {
124
+ margin: 0 auto;
125
+ }
126
+
127
+ .eds-pagination-menu__menu-button {
128
+ -webkit-appearance: none;
129
+ -moz-appearance: none;
130
+ appearance: none;
131
+ background: transparent;
132
+ border: 0.0625rem solid #d1d3d3;
133
+ border-radius: 0.25rem;
134
+ color: inherit;
135
+ font-family: inherit;
136
+ display: flex;
137
+ align-items: center;
138
+ justify-content: space-around;
139
+ height: 2rem;
140
+ margin-left: 0.25rem;
141
+ margin-right: 1rem;
142
+ width: 3.5rem;
143
+ }
144
+ .eds-pagination-menu__menu-button--open {
145
+ border-color: currentColor;
146
+ }
147
+ .eds-pagination-menu__menu-button:focus {
148
+ outline: none;
149
+ box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
150
+ }
151
+ .eds-pagination-menu__menu-list {
152
+ width: 3.5rem;
153
+ }
154
+
155
+ .eds-pagination__page {
156
+ align-items: center;
157
+ -webkit-appearance: none;
158
+ -moz-appearance: none;
159
+ appearance: none;
160
+ background: transparent;
161
+ border: 0.0625rem solid #d1d3d3;
162
+ border-color: #d1d3d3;
163
+ border-radius: 0.25rem;
164
+ color: inherit;
165
+ cursor: pointer;
166
+ display: flex;
167
+ font-family: inherit;
168
+ font-size: 0.875rem;
169
+ height: 2rem;
170
+ justify-content: center;
171
+ margin: 0 0.125rem;
172
+ padding: 0 0.25rem;
173
+ transition: background 0.1s ease-out, border-color 0.1s ease-out;
174
+ -webkit-user-select: none;
175
+ -moz-user-select: none;
176
+ user-select: none;
177
+ min-width: 2rem;
178
+ }
179
+ .eds-contrast .eds-pagination__page {
180
+ border-color: #54568c;
181
+ }
182
+ .eds-pagination__page--selected {
183
+ background: #d1d4e3;
184
+ border-color: #181c56;
185
+ color: inherit;
186
+ opacity: 1;
187
+ pointer-events: none;
188
+ }
189
+ .eds-contrast .eds-pagination__page--selected {
190
+ border-color: #ffffff;
191
+ background: #393d79;
192
+ }
193
+ .eds-pagination__page--disabled {
194
+ opacity: 0.5;
195
+ pointer-events: none;
196
+ }
197
+ .eds-pagination__page:hover {
198
+ background-color: #d1d4e3;
199
+ border-color: #d1d4e3;
200
+ }
201
+ .eds-contrast .eds-pagination__page:hover {
202
+ background-color: #393d79;
203
+ border-color: #393d79;
204
+ }
205
+ .eds-pagination__page:focus {
206
+ outline: none;
207
+ border-color: #181c56;
208
+ }
209
+ .eds-contrast .eds-pagination__page:focus {
210
+ border-color: #ffffff;
211
+ }
212
+
213
+ .eds-pagination__ellipsis {
214
+ align-items: baseline;
215
+ cursor: default;
216
+ display: flex;
217
+ font-size: 1.5rem;
218
+ height: 2rem;
219
+ justify-content: center;
220
+ -webkit-user-select: none;
221
+ -moz-user-select: none;
222
+ user-select: none;
223
+ width: 2rem;
224
+ margin: 0 2px;
225
+ }
226
+
227
+ .eds-pagination__input-wrapper {
228
+ white-space: nowrap;
229
+ }
230
+ .eds-pagination__input-label {
231
+ border-left: 0.0625rem solid #d1d3d3;
232
+ color: #656782;
233
+ font-size: 0.875rem;
234
+ margin-left: 0.5rem;
235
+ padding: 0 1rem;
236
+ }
237
+ .eds-contrast .eds-pagination__input-label {
238
+ border-color: #393d79;
239
+ color: #aeb7e2;
240
+ }
241
+ .eds-pagination__input-field {
242
+ -webkit-appearance: none;
243
+ -moz-appearance: none;
244
+ appearance: none;
245
+ background: transparent;
246
+ border: 0.0625rem solid #d1d3d3;
247
+ border-radius: 0.25rem;
248
+ color: inherit;
249
+ font-family: inherit;
250
+ font-size: 0.875rem;
251
+ height: 2rem;
252
+ text-align: center;
253
+ width: 2rem;
254
+ }
255
+ .eds-pagination__input-field::-webkit-inner-spin-button, .eds-pagination__input-field::-webkit-outer-spin-button {
256
+ -webkit-appearance: none;
257
+ appearance: none;
258
+ margin: 0;
259
+ }
260
+ /* DO NOT CHANGE!*/
261
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
53
262
  /* DO NOT CHANGE!*/
54
263
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
55
264
  .eds-side-navigation,
@@ -270,215 +479,6 @@
270
479
  }
271
480
  /* DO NOT CHANGE!*/
272
481
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
273
- .eds-top-navigation-item {
274
- --show-active-line: 0;
275
- display: inline-block;
276
- cursor: pointer;
277
- color: inherit;
278
- text-decoration: none;
279
- position: relative;
280
- padding: 1rem;
281
- min-width: 5rem;
282
- width: -moz-fit-content;
283
- width: fit-content;
284
- text-align: center;
285
- font-family: inherit;
286
- font-size: 1rem;
287
- font-weight: 600;
288
- }
289
- .eds-top-navigation-item::after {
290
- content: "";
291
- display: block;
292
- bottom: 1rem;
293
- height: 0.1875rem;
294
- width: 0;
295
- margin: 0 auto;
296
- opacity: var(--show-active-line);
297
- background: #ff5959;
298
- transition: width ease-in-out 0.2s, opacity ease-in-out 0.2s;
299
- }
300
- .eds-top-navigation-item:focus {
301
- outline-offset: 0.125rem;
302
- outline: none;
303
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
304
- }
305
- .eds-contrast .eds-top-navigation-item:focus {
306
- box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
307
- }
308
- .eds-top-navigation-item:hover {
309
- --show-active-line: 1;
310
- }
311
- .eds-top-navigation-item:hover::after {
312
- width: 2rem;
313
- }
314
- .eds-top-navigation-item--active {
315
- --show-active-line: 1;
316
- }
317
- .eds-top-navigation-item--active::after {
318
- width: 2rem;
319
- }
320
- /* DO NOT CHANGE!*/
321
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
322
- .eds-pagination {
323
- align-items: center;
324
- display: flex;
325
- flex-wrap: wrap;
326
- row-gap: 0.75rem;
327
- justify-content: space-between;
328
- }
329
- .eds-pagination__results {
330
- align-items: center;
331
- display: flex;
332
- flex: 1;
333
- justify-content: flex-start;
334
- }
335
- .eds-pagination__results-label {
336
- margin-right: 0.5rem;
337
- }
338
- .eds-pagination__controls {
339
- align-items: center;
340
- display: flex;
341
- justify-content: center;
342
- }
343
- .eds-pagination__results:first-of-type:last-of-type, .eds-pagination__controls:first-of-type:last-of-type {
344
- margin: 0 auto;
345
- }
346
-
347
- .eds-pagination-menu__menu-button {
348
- -webkit-appearance: none;
349
- -moz-appearance: none;
350
- appearance: none;
351
- background: transparent;
352
- border: 0.0625rem solid #d1d3d3;
353
- border-radius: 0.25rem;
354
- color: inherit;
355
- font-family: inherit;
356
- display: flex;
357
- align-items: center;
358
- justify-content: space-around;
359
- height: 2rem;
360
- margin-left: 0.25rem;
361
- margin-right: 1rem;
362
- width: 3.5rem;
363
- }
364
- .eds-pagination-menu__menu-button--open {
365
- border-color: currentColor;
366
- }
367
- .eds-pagination-menu__menu-button:focus {
368
- outline: none;
369
- box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
370
- }
371
- .eds-pagination-menu__menu-list {
372
- width: 3.5rem;
373
- }
374
-
375
- .eds-pagination__page {
376
- align-items: center;
377
- -webkit-appearance: none;
378
- -moz-appearance: none;
379
- appearance: none;
380
- background: transparent;
381
- border: 0.0625rem solid #d1d3d3;
382
- border-color: #d1d3d3;
383
- border-radius: 0.25rem;
384
- color: inherit;
385
- cursor: pointer;
386
- display: flex;
387
- font-family: inherit;
388
- font-size: 0.875rem;
389
- height: 2rem;
390
- justify-content: center;
391
- margin: 0 0.125rem;
392
- padding: 0 0.25rem;
393
- transition: background 0.1s ease-out, border-color 0.1s ease-out;
394
- -webkit-user-select: none;
395
- -moz-user-select: none;
396
- user-select: none;
397
- min-width: 2rem;
398
- }
399
- .eds-contrast .eds-pagination__page {
400
- border-color: #54568c;
401
- }
402
- .eds-pagination__page--selected {
403
- background: #d1d4e3;
404
- border-color: #181c56;
405
- color: inherit;
406
- opacity: 1;
407
- pointer-events: none;
408
- }
409
- .eds-contrast .eds-pagination__page--selected {
410
- border-color: #ffffff;
411
- background: #393d79;
412
- }
413
- .eds-pagination__page--disabled {
414
- opacity: 0.5;
415
- pointer-events: none;
416
- }
417
- .eds-pagination__page:hover {
418
- background-color: #d1d4e3;
419
- border-color: #d1d4e3;
420
- }
421
- .eds-contrast .eds-pagination__page:hover {
422
- background-color: #393d79;
423
- border-color: #393d79;
424
- }
425
- .eds-pagination__page:focus {
426
- outline: none;
427
- border-color: #181c56;
428
- }
429
- .eds-contrast .eds-pagination__page:focus {
430
- border-color: #ffffff;
431
- }
432
-
433
- .eds-pagination__ellipsis {
434
- align-items: baseline;
435
- cursor: default;
436
- display: flex;
437
- font-size: 1.5rem;
438
- height: 2rem;
439
- justify-content: center;
440
- -webkit-user-select: none;
441
- -moz-user-select: none;
442
- user-select: none;
443
- width: 2rem;
444
- margin: 0 2px;
445
- }
446
-
447
- .eds-pagination__input-wrapper {
448
- white-space: nowrap;
449
- }
450
- .eds-pagination__input-label {
451
- border-left: 0.0625rem solid #d1d3d3;
452
- color: #656782;
453
- font-size: 0.875rem;
454
- margin-left: 0.5rem;
455
- padding: 0 1rem;
456
- }
457
- .eds-contrast .eds-pagination__input-label {
458
- border-color: #393d79;
459
- color: #aeb7e2;
460
- }
461
- .eds-pagination__input-field {
462
- -webkit-appearance: none;
463
- -moz-appearance: none;
464
- appearance: none;
465
- background: transparent;
466
- border: 0.0625rem solid #d1d3d3;
467
- border-radius: 0.25rem;
468
- color: inherit;
469
- font-family: inherit;
470
- font-size: 0.875rem;
471
- height: 2rem;
472
- text-align: center;
473
- width: 2rem;
474
- }
475
- .eds-pagination__input-field::-webkit-inner-spin-button, .eds-pagination__input-field::-webkit-outer-spin-button {
476
- -webkit-appearance: none;
477
- appearance: none;
478
- margin: 0;
479
- }
480
- /* DO NOT CHANGE!*/
481
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
482
482
  .eds-overflow-menu__item {
483
483
  -webkit-appearance: none;
484
484
  -moz-appearance: none;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/menu",
3
- "version": "4.1.34",
3
+ "version": "4.1.36",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/menu.esm.js",
@@ -27,17 +27,17 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/a11y": "^0.2.61",
31
- "@entur/button": "^3.0.2",
32
- "@entur/expand": "^3.3.40",
33
- "@entur/icons": "^6.1.0",
34
- "@entur/layout": "^2.1.26",
30
+ "@entur/a11y": "^0.2.62",
31
+ "@entur/button": "^3.0.3",
32
+ "@entur/expand": "^3.3.42",
33
+ "@entur/icons": "^6.2.0",
34
+ "@entur/layout": "^2.1.28",
35
35
  "@entur/tokens": "^3.8.1",
36
- "@entur/typography": "^1.7.13",
37
- "@entur/utils": "^0.6.0",
36
+ "@entur/typography": "^1.7.14",
37
+ "@entur/utils": "^0.7.0",
38
38
  "@reach/menu-button": "^0.16.1",
39
39
  "@reach/polymorphic": "0.18.0",
40
40
  "classnames": "^2.3.1"
41
41
  },
42
- "gitHead": "a3edbb9069b9bd125919df8984b23628a1040cf4"
42
+ "gitHead": "402d010ee77f4ff809e3b709b0a29865c04cc1f4"
43
43
  }