@entur/layout 3.1.9-beta.10 → 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 +106 -106
- 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. */
|
|
@@ -710,8 +710,6 @@
|
|
|
710
710
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
711
711
|
/* DO NOT CHANGE!*/
|
|
712
712
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
713
|
-
/* DO NOT CHANGE!*/
|
|
714
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
715
713
|
[data-color-mode=light],
|
|
716
714
|
:root {
|
|
717
715
|
--components-layout-badge-information-contrast-border: rgba(255, 255, 255, 0);
|
|
@@ -1052,3 +1050,5 @@
|
|
|
1052
1050
|
.eds-tag--compact.eds-tag--trailing-icon .eds-icon {
|
|
1053
1051
|
margin-left: 0.25rem;
|
|
1054
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
|
}
|