@entur/layout 3.1.9-beta.7 → 3.1.9-beta.9
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. */
|
|
@@ -708,6 +708,35 @@
|
|
|
708
708
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
709
709
|
/* DO NOT CHANGE!*/
|
|
710
710
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
711
|
+
.eds-tag {
|
|
712
|
+
background: #e9e9e9;
|
|
713
|
+
color: #181c56;
|
|
714
|
+
display: inline-block;
|
|
715
|
+
min-width: 2rem;
|
|
716
|
+
padding: 0.25rem 0.75rem;
|
|
717
|
+
font-size: 0.875rem;
|
|
718
|
+
line-height: 1.375rem;
|
|
719
|
+
}
|
|
720
|
+
.eds-tag--leading-icon .eds-icon {
|
|
721
|
+
margin-right: 0.5rem;
|
|
722
|
+
}
|
|
723
|
+
.eds-tag--trailing-icon .eds-icon {
|
|
724
|
+
margin-left: 0.5rem;
|
|
725
|
+
}
|
|
726
|
+
.eds-tag--compact {
|
|
727
|
+
font-size: 0.75rem;
|
|
728
|
+
padding: 0.125rem 0.5rem;
|
|
729
|
+
line-height: 1.25rem;
|
|
730
|
+
height: 1.5rem;
|
|
731
|
+
}
|
|
732
|
+
.eds-tag--compact.eds-tag--leading-icon .eds-icon {
|
|
733
|
+
margin-right: 0.25rem;
|
|
734
|
+
}
|
|
735
|
+
.eds-tag--compact.eds-tag--trailing-icon .eds-icon {
|
|
736
|
+
margin-left: 0.25rem;
|
|
737
|
+
}
|
|
738
|
+
/* DO NOT CHANGE!*/
|
|
739
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
711
740
|
/* DO NOT CHANGE!*/
|
|
712
741
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
713
742
|
/* DO NOT CHANGE!*/
|
|
@@ -1023,32 +1052,3 @@
|
|
|
1023
1052
|
:root {
|
|
1024
1053
|
--eds-layout: 1;
|
|
1025
1054
|
}
|
|
1026
|
-
/* DO NOT CHANGE!*/
|
|
1027
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
1028
|
-
.eds-tag {
|
|
1029
|
-
background: #e9e9e9;
|
|
1030
|
-
color: #181c56;
|
|
1031
|
-
display: inline-block;
|
|
1032
|
-
min-width: 2rem;
|
|
1033
|
-
padding: 0.25rem 0.75rem;
|
|
1034
|
-
font-size: 0.875rem;
|
|
1035
|
-
line-height: 1.375rem;
|
|
1036
|
-
}
|
|
1037
|
-
.eds-tag--leading-icon .eds-icon {
|
|
1038
|
-
margin-right: 0.5rem;
|
|
1039
|
-
}
|
|
1040
|
-
.eds-tag--trailing-icon .eds-icon {
|
|
1041
|
-
margin-left: 0.5rem;
|
|
1042
|
-
}
|
|
1043
|
-
.eds-tag--compact {
|
|
1044
|
-
font-size: 0.75rem;
|
|
1045
|
-
padding: 0.125rem 0.5rem;
|
|
1046
|
-
line-height: 1.25rem;
|
|
1047
|
-
height: 1.5rem;
|
|
1048
|
-
}
|
|
1049
|
-
.eds-tag--compact.eds-tag--leading-icon .eds-icon {
|
|
1050
|
-
margin-right: 0.25rem;
|
|
1051
|
-
}
|
|
1052
|
-
.eds-tag--compact.eds-tag--trailing-icon .eds-icon {
|
|
1053
|
-
margin-left: 0.25rem;
|
|
1054
|
-
}
|
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.9",
|
|
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.9",
|
|
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": "6f685d2e4ac13bdaf9c6480f9e7922c9d8f4619c"
|
|
40
40
|
}
|