@entur/layout 3.1.9-beta.11 → 3.1.9-beta.12
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 +133 -133
- package/package.json +3 -3
package/dist/styles.css
CHANGED
|
@@ -133,97 +133,25 @@
|
|
|
133
133
|
--white-alpha-90: rgba(255,255,255,0.89804);
|
|
134
134
|
}
|
|
135
135
|
|
|
136
|
-
.eds-
|
|
137
|
-
display: flex;
|
|
138
|
-
flex-direction: column;
|
|
139
|
-
padding: 2rem;
|
|
140
|
-
position: relative;
|
|
141
|
-
transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
142
|
-
}
|
|
143
|
-
.eds-navigation-card-header {
|
|
144
|
-
display: flex;
|
|
145
|
-
flex-direction: column;
|
|
146
|
-
margin-bottom: 1rem;
|
|
147
|
-
}
|
|
148
|
-
.eds-navigation-card-header__content {
|
|
136
|
+
.eds-base-card {
|
|
149
137
|
display: flex;
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
.
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
.eds-navigation-card-header__highlight {
|
|
162
|
-
width: 2rem;
|
|
163
|
-
height: 0.1875rem;
|
|
164
|
-
background: var(--components-layout-card-standard-divide);
|
|
165
|
-
opacity: var(--show-active-line);
|
|
166
|
-
transition: width 0.2s ease-in-out;
|
|
167
|
-
}
|
|
168
|
-
.eds-navigation-card:hover {
|
|
169
|
-
background-color: var(--components-layout-card-standard-fill-hoveractive);
|
|
170
|
-
box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
|
|
171
|
-
}
|
|
172
|
-
.eds-navigation-card:hover:before {
|
|
173
|
-
opacity: 1;
|
|
174
|
-
}
|
|
175
|
-
.eds-navigation-card:hover .eds-navigation-card-header__highlight {
|
|
176
|
-
width: 5rem;
|
|
177
|
-
}
|
|
178
|
-
.eds-contrast .eds-navigation-card:hover {
|
|
179
|
-
background-color: var(--components-layout-card-contrast-fill-hoveractive);
|
|
180
|
-
box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
|
|
181
|
-
}
|
|
182
|
-
.eds-navigation-card:active {
|
|
183
|
-
background-color: var(--components-layout-card-standard-fill-hoveractive);
|
|
184
|
-
border: 1px solid var(--components-layout-card-standard-border-active);
|
|
185
|
-
box-shadow: none;
|
|
138
|
+
box-shadow: 6px 6px 10px 0px var(--components-layout-card-standard-shadowlayer3), 3px 3px 6px 0px var(--components-layout-card-standard-shadowlayer2), 1px 1px 2px 0px var(--components-layout-card-standard-shadowlayer1);
|
|
139
|
+
background-color: var(--components-layout-card-standard-fill-default-solid);
|
|
140
|
+
border: 0.0625rem solid var(--components-layout-card-standard-border-default);
|
|
141
|
+
color: var(--components-layout-card-standard-text);
|
|
142
|
+
border-radius: 0.25rem;
|
|
143
|
+
align-items: flex-start;
|
|
144
|
+
-webkit-appearance: none;
|
|
145
|
+
-moz-appearance: none;
|
|
146
|
+
appearance: none;
|
|
147
|
+
-webkit-text-decoration: none;
|
|
148
|
+
text-decoration: none;
|
|
186
149
|
}
|
|
187
|
-
.eds-contrast .eds-
|
|
188
|
-
background-color: var(--components-layout-card-contrast-fill-
|
|
189
|
-
border-color: var(--components-layout-card-contrast-border-
|
|
150
|
+
.eds-contrast .eds-base-card {
|
|
151
|
+
background-color: var(--components-layout-card-contrast-fill-default-solid);
|
|
152
|
+
border-color: var(--components-layout-card-contrast-border-default);
|
|
190
153
|
box-shadow: none;
|
|
191
|
-
|
|
192
|
-
.eds-navigation-card:focus-visible {
|
|
193
|
-
outline: 2px solid #181c56;
|
|
194
|
-
outline-color: var(--basecolors-stroke-focus-standard);
|
|
195
|
-
outline-offset: 0.125rem;
|
|
196
|
-
}
|
|
197
|
-
.eds-contrast .eds-navigation-card:focus-visible {
|
|
198
|
-
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
199
|
-
}
|
|
200
|
-
.eds-navigation-card__arrow-icon {
|
|
201
|
-
margin-top: 0.5rem;
|
|
202
|
-
}
|
|
203
|
-
.eds-navigation-card--compact {
|
|
204
|
-
padding: 1.5rem;
|
|
205
|
-
}
|
|
206
|
-
.eds-navigation-card--compact .eds-navigation-card-header {
|
|
207
|
-
margin-bottom: 0;
|
|
208
|
-
}
|
|
209
|
-
.eds-navigation-card .eds-paragraph {
|
|
210
|
-
margin-bottom: 0;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
@media (prefers-reduced-motion: reduce) {
|
|
214
|
-
.eds-navigation-card {
|
|
215
|
-
transition: none;
|
|
216
|
-
}
|
|
217
|
-
.eds-navigation-card-header__highlight {
|
|
218
|
-
transition: none;
|
|
219
|
-
}
|
|
220
|
-
.eds-navigation-card:hover {
|
|
221
|
-
transform: none;
|
|
222
|
-
box-shadow: none;
|
|
223
|
-
}
|
|
224
|
-
.eds-navigation-card:hover .eds-navigation-card-header__highlight {
|
|
225
|
-
width: 2rem;
|
|
226
|
-
}
|
|
154
|
+
color: var(--components-layout-card-contrast-text);
|
|
227
155
|
}
|
|
228
156
|
/* DO NOT CHANGE!*/
|
|
229
157
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
@@ -360,25 +288,97 @@
|
|
|
360
288
|
--white-alpha-90: rgba(255,255,255,0.89804);
|
|
361
289
|
}
|
|
362
290
|
|
|
363
|
-
.eds-
|
|
291
|
+
.eds-navigation-card {
|
|
364
292
|
display: flex;
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
border-radius: 0.25rem;
|
|
370
|
-
align-items: flex-start;
|
|
371
|
-
-webkit-appearance: none;
|
|
372
|
-
-moz-appearance: none;
|
|
373
|
-
appearance: none;
|
|
374
|
-
-webkit-text-decoration: none;
|
|
375
|
-
text-decoration: none;
|
|
293
|
+
flex-direction: column;
|
|
294
|
+
padding: 2rem;
|
|
295
|
+
position: relative;
|
|
296
|
+
transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
|
|
376
297
|
}
|
|
377
|
-
.eds-
|
|
378
|
-
|
|
379
|
-
|
|
298
|
+
.eds-navigation-card-header {
|
|
299
|
+
display: flex;
|
|
300
|
+
flex-direction: column;
|
|
301
|
+
margin-bottom: 1rem;
|
|
302
|
+
}
|
|
303
|
+
.eds-navigation-card-header__content {
|
|
304
|
+
display: flex;
|
|
305
|
+
align-items: center;
|
|
306
|
+
}
|
|
307
|
+
.eds-navigation-card-header__title {
|
|
308
|
+
font-size: 1.5rem;
|
|
309
|
+
line-height: 1.875rem;
|
|
310
|
+
font-weight: 600;
|
|
311
|
+
}
|
|
312
|
+
.eds-navigation-card-header__title-icon {
|
|
313
|
+
font-size: 1.53125rem;
|
|
314
|
+
margin-right: 0.75rem;
|
|
315
|
+
}
|
|
316
|
+
.eds-navigation-card-header__highlight {
|
|
317
|
+
width: 2rem;
|
|
318
|
+
height: 0.1875rem;
|
|
319
|
+
background: var(--components-layout-card-standard-divide);
|
|
320
|
+
opacity: var(--show-active-line);
|
|
321
|
+
transition: width 0.2s ease-in-out;
|
|
322
|
+
}
|
|
323
|
+
.eds-navigation-card:hover {
|
|
324
|
+
background-color: var(--components-layout-card-standard-fill-hoveractive);
|
|
325
|
+
box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-standard-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-standard-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-standard-shadowlayer1);
|
|
326
|
+
}
|
|
327
|
+
.eds-navigation-card:hover:before {
|
|
328
|
+
opacity: 1;
|
|
329
|
+
}
|
|
330
|
+
.eds-navigation-card:hover .eds-navigation-card-header__highlight {
|
|
331
|
+
width: 5rem;
|
|
332
|
+
}
|
|
333
|
+
.eds-contrast .eds-navigation-card:hover {
|
|
334
|
+
background-color: var(--components-layout-card-contrast-fill-hoveractive);
|
|
335
|
+
box-shadow: 0.625rem 0.625rem 1rem var(--components-layout-card-contrast-shadowlayer3), 0.375rem 0.375rem 0.75rem var(--components-layout-card-contrast-shadowlayer2), 0.1875rem 0.1875rem 0.375rem var(--components-layout-card-contrast-shadowlayer1);
|
|
336
|
+
}
|
|
337
|
+
.eds-navigation-card:active {
|
|
338
|
+
background-color: var(--components-layout-card-standard-fill-hoveractive);
|
|
339
|
+
border: 1px solid var(--components-layout-card-standard-border-active);
|
|
380
340
|
box-shadow: none;
|
|
381
|
-
|
|
341
|
+
}
|
|
342
|
+
.eds-contrast .eds-navigation-card:active {
|
|
343
|
+
background-color: var(--components-layout-card-contrast-fill-hoveractive);
|
|
344
|
+
border-color: var(--components-layout-card-contrast-border-active);
|
|
345
|
+
box-shadow: none;
|
|
346
|
+
}
|
|
347
|
+
.eds-navigation-card:focus-visible {
|
|
348
|
+
outline: 2px solid #181c56;
|
|
349
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
350
|
+
outline-offset: 0.125rem;
|
|
351
|
+
}
|
|
352
|
+
.eds-contrast .eds-navigation-card:focus-visible {
|
|
353
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
354
|
+
}
|
|
355
|
+
.eds-navigation-card__arrow-icon {
|
|
356
|
+
margin-top: 0.5rem;
|
|
357
|
+
}
|
|
358
|
+
.eds-navigation-card--compact {
|
|
359
|
+
padding: 1.5rem;
|
|
360
|
+
}
|
|
361
|
+
.eds-navigation-card--compact .eds-navigation-card-header {
|
|
362
|
+
margin-bottom: 0;
|
|
363
|
+
}
|
|
364
|
+
.eds-navigation-card .eds-paragraph {
|
|
365
|
+
margin-bottom: 0;
|
|
366
|
+
}
|
|
367
|
+
|
|
368
|
+
@media (prefers-reduced-motion: reduce) {
|
|
369
|
+
.eds-navigation-card {
|
|
370
|
+
transition: none;
|
|
371
|
+
}
|
|
372
|
+
.eds-navigation-card-header__highlight {
|
|
373
|
+
transition: none;
|
|
374
|
+
}
|
|
375
|
+
.eds-navigation-card:hover {
|
|
376
|
+
transform: none;
|
|
377
|
+
box-shadow: none;
|
|
378
|
+
}
|
|
379
|
+
.eds-navigation-card:hover .eds-navigation-card-header__highlight {
|
|
380
|
+
width: 2rem;
|
|
381
|
+
}
|
|
382
382
|
}
|
|
383
383
|
/* DO NOT CHANGE!*/
|
|
384
384
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
@@ -706,35 +706,6 @@
|
|
|
706
706
|
}
|
|
707
707
|
/* DO NOT CHANGE!*/
|
|
708
708
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
709
|
-
.eds-tag {
|
|
710
|
-
background: #e9e9e9;
|
|
711
|
-
color: #181c56;
|
|
712
|
-
display: inline-block;
|
|
713
|
-
min-width: 2rem;
|
|
714
|
-
padding: 0.25rem 0.75rem;
|
|
715
|
-
font-size: 0.875rem;
|
|
716
|
-
line-height: 1.375rem;
|
|
717
|
-
}
|
|
718
|
-
.eds-tag--leading-icon .eds-icon {
|
|
719
|
-
margin-right: 0.5rem;
|
|
720
|
-
}
|
|
721
|
-
.eds-tag--trailing-icon .eds-icon {
|
|
722
|
-
margin-left: 0.5rem;
|
|
723
|
-
}
|
|
724
|
-
.eds-tag--compact {
|
|
725
|
-
font-size: 0.75rem;
|
|
726
|
-
padding: 0.125rem 0.5rem;
|
|
727
|
-
line-height: 1.25rem;
|
|
728
|
-
height: 1.5rem;
|
|
729
|
-
}
|
|
730
|
-
.eds-tag--compact.eds-tag--leading-icon .eds-icon {
|
|
731
|
-
margin-right: 0.25rem;
|
|
732
|
-
}
|
|
733
|
-
.eds-tag--compact.eds-tag--trailing-icon .eds-icon {
|
|
734
|
-
margin-left: 0.25rem;
|
|
735
|
-
}
|
|
736
|
-
/* DO NOT CHANGE!*/
|
|
737
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
738
709
|
/* DO NOT CHANGE!*/
|
|
739
710
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
740
711
|
/* DO NOT CHANGE!*/
|
|
@@ -1052,3 +1023,32 @@
|
|
|
1052
1023
|
}
|
|
1053
1024
|
/* DO NOT CHANGE!*/
|
|
1054
1025
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
1026
|
+
.eds-tag {
|
|
1027
|
+
background: #e9e9e9;
|
|
1028
|
+
color: #181c56;
|
|
1029
|
+
display: inline-block;
|
|
1030
|
+
min-width: 2rem;
|
|
1031
|
+
padding: 0.25rem 0.75rem;
|
|
1032
|
+
font-size: 0.875rem;
|
|
1033
|
+
line-height: 1.375rem;
|
|
1034
|
+
}
|
|
1035
|
+
.eds-tag--leading-icon .eds-icon {
|
|
1036
|
+
margin-right: 0.5rem;
|
|
1037
|
+
}
|
|
1038
|
+
.eds-tag--trailing-icon .eds-icon {
|
|
1039
|
+
margin-left: 0.5rem;
|
|
1040
|
+
}
|
|
1041
|
+
.eds-tag--compact {
|
|
1042
|
+
font-size: 0.75rem;
|
|
1043
|
+
padding: 0.125rem 0.5rem;
|
|
1044
|
+
line-height: 1.25rem;
|
|
1045
|
+
height: 1.5rem;
|
|
1046
|
+
}
|
|
1047
|
+
.eds-tag--compact.eds-tag--leading-icon .eds-icon {
|
|
1048
|
+
margin-right: 0.25rem;
|
|
1049
|
+
}
|
|
1050
|
+
.eds-tag--compact.eds-tag--trailing-icon .eds-icon {
|
|
1051
|
+
margin-left: 0.25rem;
|
|
1052
|
+
}
|
|
1053
|
+
/* DO NOT CHANGE!*/
|
|
1054
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/layout",
|
|
3
|
-
"version": "3.1.9-beta.
|
|
3
|
+
"version": "3.1.9-beta.12",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/layout.esm.js",
|
|
@@ -29,12 +29,12 @@
|
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@entur/icons": "^8.0.0",
|
|
31
31
|
"@entur/tokens": "^3.19.1",
|
|
32
|
-
"@entur/typography": "^1.10.0-beta.
|
|
32
|
+
"@entur/typography": "^1.10.0-beta.12",
|
|
33
33
|
"@entur/utils": "^0.12.3",
|
|
34
34
|
"classnames": "^2.3.1"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"dts-cli": "2.0.5"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "2a01de420517ee321602ced4e534eada22e2a10c"
|
|
40
40
|
}
|