@navikt/ds-css 5.12.1 → 5.12.3
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/CHANGELOG.md +8 -0
- package/dist/component/expansioncard.css +26 -8
- package/dist/component/expansioncard.min.css +2 -2
- package/dist/component/index.css +25 -8
- package/dist/component/index.min.css +2 -2
- package/dist/components.css +26 -8
- package/dist/components.min.css +2 -2
- package/dist/global/tokens.css +1 -1
- package/dist/index.css +25 -8
- package/dist/index.min.css +2 -2
- package/expansioncard.css +26 -8
- package/package.json +2 -2
package/dist/global/tokens.css
CHANGED
package/dist/index.css
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@charset "UTF-8";
|
|
2
2
|
/**
|
|
3
3
|
* Do not edit directly
|
|
4
|
-
* Generated on
|
|
4
|
+
* Generated on Thu, 04 Jan 2024 19:18:28 GMT
|
|
5
5
|
*/
|
|
6
6
|
:root, :host {
|
|
7
7
|
--a-spacing-1-alt: 0.375rem;
|
|
@@ -2305,6 +2305,8 @@ body,
|
|
|
2305
2305
|
--__ac-expansioncard-border-color: var(--ac-expansioncard-border-color, var(--a-border-default));
|
|
2306
2306
|
--__ac-expansioncard-border-radius: var(--ac-expansioncard-border-radius, var(--a-border-radius-large));
|
|
2307
2307
|
--__ac-expansioncard-border-width: 1px;
|
|
2308
|
+
--__ac-expansioncard-padding-block: var(--a-spacing-4);
|
|
2309
|
+
--__ac-expansioncard-padding-inline: var(--a-spacing-6);
|
|
2308
2310
|
|
|
2309
2311
|
border-radius: var(--__ac-expansioncard-border-radius);
|
|
2310
2312
|
background-color: var(--ac-expansioncard-bg, var(--a-surface-default));
|
|
@@ -2329,15 +2331,16 @@ body,
|
|
|
2329
2331
|
width: 100%;
|
|
2330
2332
|
display: flex;
|
|
2331
2333
|
gap: var(--a-spacing-4);
|
|
2332
|
-
padding: var(--
|
|
2334
|
+
padding: var(--__ac-expansioncard-padding-block) var(--__ac-expansioncard-padding-inline);
|
|
2333
2335
|
border-radius: var(--__ac-expansioncard-border-radius);
|
|
2334
2336
|
background-color: var(--ac-expansioncard-header-bg, var(--a-surface-transparent));
|
|
2335
2337
|
position: relative;
|
|
2336
2338
|
border: var(--__ac-expansioncard-border-width) solid var(--__ac-expansioncard-border-color);
|
|
2337
2339
|
justify-content: space-between;
|
|
2338
2340
|
}
|
|
2339
|
-
.navds-expansioncard--small
|
|
2340
|
-
padding: var(--a-spacing-3)
|
|
2341
|
+
.navds-expansioncard--small {
|
|
2342
|
+
--__ac-expansioncard-padding-block: var(--a-spacing-3);
|
|
2343
|
+
--__ac-expansioncard-padding-inline: var(--a-spacing-4);
|
|
2341
2344
|
}
|
|
2342
2345
|
.navds-expansioncard__header:hover {
|
|
2343
2346
|
background-color: var(--ac-expansioncard-header-bg-hover, var(--a-surface-hover));
|
|
@@ -2355,6 +2358,20 @@ body,
|
|
|
2355
2358
|
box-shadow: 1px 0 0 0 var(--__ac-expansioncard-border-color), -1px 0 0 0 var(--__ac-expansioncard-border-color),
|
|
2356
2359
|
0 -1px 0 0 var(--__ac-expansioncard-border-color);
|
|
2357
2360
|
}
|
|
2361
|
+
.navds-expansioncard--open > :where(.navds-expansioncard__header)::after {
|
|
2362
|
+
content: "";
|
|
2363
|
+
background-color: var(--a-border-divider);
|
|
2364
|
+
bottom: 0;
|
|
2365
|
+
left: var(--__ac-expansioncard-padding-inline);
|
|
2366
|
+
height: 1px;
|
|
2367
|
+
width: calc(100% - 2 * var(--__ac-expansioncard-padding-inline));
|
|
2368
|
+
position: absolute;
|
|
2369
|
+
opacity: 1;
|
|
2370
|
+
transition: opacity 0.1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
|
2371
|
+
}
|
|
2372
|
+
.navds-expansioncard--open > :where(.navds-expansioncard__header:hover)::after {
|
|
2373
|
+
opacity: 0;
|
|
2374
|
+
}
|
|
2358
2375
|
/*************************
|
|
2359
2376
|
* Header/Typography *
|
|
2360
2377
|
*************************/
|
|
@@ -2434,15 +2451,15 @@ body,
|
|
|
2434
2451
|
* Content *
|
|
2435
2452
|
*************************/
|
|
2436
2453
|
.navds-expansioncard__content {
|
|
2454
|
+
--__ac-expansioncard-padding-block: var(--a-spacing-3);
|
|
2455
|
+
|
|
2437
2456
|
border-end-end-radius: var(--__ac-expansioncard-border-radius);
|
|
2438
2457
|
border-end-start-radius: var(--__ac-expansioncard-border-radius);
|
|
2439
|
-
padding: var(--
|
|
2458
|
+
padding: var(--__ac-expansioncard-padding-block) var(--__ac-expansioncard-padding-inline)
|
|
2459
|
+
var(--__ac-expansioncard-padding-inline);
|
|
2440
2460
|
border: var(--__ac-expansioncard-border-width) solid var(--__ac-expansioncard-border-color);
|
|
2441
2461
|
border-top: none;
|
|
2442
2462
|
}
|
|
2443
|
-
.navds-expansioncard--small > :where(.navds-expansioncard__content) {
|
|
2444
|
-
padding: var(--a-spacing-3) var(--a-spacing-4) var(--a-spacing-4);
|
|
2445
|
-
}
|
|
2446
2463
|
.navds-expansioncard__content--closed {
|
|
2447
2464
|
display: none;
|
|
2448
2465
|
}
|