@norges-domstoler/dds-components 18.3.0 → 19.0.0

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/index.css CHANGED
@@ -48,6 +48,28 @@
48
48
  url("./IBMPlexSans-LightItalic-HGYKQIYJ.woff2") format("woff2"),
49
49
  url("./IBMPlexSans-LightItalic-DGDYT5M4.woff") format("woff");
50
50
  }
51
+ @font-face {
52
+ font-family: IBM Plex Sans;
53
+ font-style: normal;
54
+ font-weight: 500;
55
+ font-display: swap;
56
+ src:
57
+ local("IBM Plex Sans Medium"),
58
+ local("IBMPlexSans-Medium"),
59
+ url("./IBMPlexSans-Medium-GPYSN6WY.woff2") format("woff2"),
60
+ url("./IBMPlexSans-Medium-F6RY5FT3.woff") format("woff");
61
+ }
62
+ @font-face {
63
+ font-family: IBM Plex Sans;
64
+ font-style: italic;
65
+ font-weight: 500;
66
+ font-display: swap;
67
+ src:
68
+ local("IBM Plex Sans Medium Italic"),
69
+ local("IBMPlexSans-MediumItalic"),
70
+ url("./IBMPlexSans-MediumItalic-NOK4NVHM.woff2") format("woff2"),
71
+ url("./IBMPlexSans-MediumItalic-HYTLJOHM.woff") format("woff");
72
+ }
51
73
  @font-face {
52
74
  font-family: IBM Plex Sans;
53
75
  font-style: normal;
@@ -1341,17 +1363,66 @@
1341
1363
  }
1342
1364
  .DateInput_popover {
1343
1365
  z-index: var(--dds-zindex-popover);
1344
- border-radius: var(--dds-border-radius-surface);
1345
- background-color: var(--dds-color-surface-default);
1346
- border: 1px solid var(--dds-color-border-default);
1347
1366
  padding: var(--dds-spacing-x0-5);
1348
- box-shadow: var(--dds-shadow-2);
1349
- height: 347px;
1367
+ }
1368
+ .DateInput_popover--large-screen-hide-xs {
1369
+ @media only screen and (max-width: 600px) {
1370
+ display: none;
1371
+ }
1372
+ }
1373
+ .DateInput_popover--large-screen-hide-sm {
1374
+ @media only screen and (max-width: 960px) {
1375
+ display: none;
1376
+ }
1377
+ }
1378
+ .DateInput_popover--large-screen-hide-md {
1379
+ @media only screen and (max-width: 1280px) {
1380
+ display: none;
1381
+ }
1382
+ }
1383
+ .DateInput_popover--large-screen-hide-lg {
1384
+ @media only screen and (max-width: 1920px) {
1385
+ display: none;
1386
+ }
1387
+ }
1388
+ .DateInput_popover--large-screen-hide-xl {
1389
+ display: none;
1390
+ }
1391
+ .DateInput_modal {
1392
+ display: none;
1393
+ }
1394
+ .DateInput_modal--small-screen-show-xs {
1395
+ @media only screen and (max-width: 600px) {
1396
+ display: block;
1397
+ }
1398
+ }
1399
+ .DateInput_modal--small-screen-show-sm {
1400
+ @media only screen and (max-width: 960px) {
1401
+ display: block;
1402
+ }
1403
+ }
1404
+ .DateInput_modal--small-screen-show-md {
1405
+ @media only screen and (max-width: 1280px) {
1406
+ display: block;
1407
+ }
1408
+ }
1409
+ .DateInput_modal--small-screen-show-lg {
1410
+ @media only screen and (max-width: 1920px) {
1411
+ display: block;
1412
+ }
1413
+ }
1414
+ .DateInput_modal--small-screen-show-xl {
1415
+ display: block;
1416
+ }
1417
+ .DateInput_modal-close-button-wrapper {
1418
+ display: flex;
1419
+ justify-content: right;
1350
1420
  }
1351
1421
  .DateInput_calendar {
1352
1422
  display: flex;
1353
1423
  flex-direction: column;
1354
1424
  gap: 1rem;
1425
+ height: 327px;
1355
1426
  }
1356
1427
  .DateInput_calendar__header {
1357
1428
  display: flex;
@@ -1415,6 +1486,30 @@
1415
1486
  text-decoration: underline line-through;
1416
1487
  }
1417
1488
 
1489
+ /* src/components/ThemeProvider/ThemeProvider.module.css */
1490
+ .ThemeProvider_global-variables {
1491
+ --dds-color-text-body: var(--dds-color-text-default);
1492
+ --dds-color-text-body-subtle: var(--dds-color-text-subtle);
1493
+ --dds-color-text-link: var(--dds-color-text-action-resting);
1494
+ --dds-color-text-link-visited: var(--dds-color-text-action-visited);
1495
+ --dds-color-text-label: var(--dds-color-text-medium);
1496
+ --dds-color-text-placeholder: var(--dds-color-text-subtle);
1497
+ --dds-color-text-helper: var(--dds-color-text-subtle);
1498
+ --dds-color-icon-link: var(--dds-color-text-action-resting);
1499
+ --dds-focus-outline: var(--dds-color-focus-outside) 2px solid;
1500
+ --dds-focus-outline-offset: var(--dds-spacing-x0-125);
1501
+ --dds-focus-outline-inset: calc(0px - var(--dds-spacing-x0-25));
1502
+ --dds-focus-box-shadow: 0 0 0 2px var(--dds-color-focus-inside);
1503
+ --dds-focus-transition: outline-offset 0.2s;
1504
+ --dds-input-default-width: 320px;
1505
+ --dds-transition-duration-surface-move: 0.5s;
1506
+ }
1507
+ .ThemeProvider_global-styles {
1508
+ font: var(--dds-font-body-medium);
1509
+ letter-spacing: var(--dds-font-body-medium-letter-spacing);
1510
+ color: var(--dds-color-text-default);
1511
+ }
1512
+
1418
1513
  /* src/components/InputMessage/InputMessage.module.css */
1419
1514
  .InputMessage_container {
1420
1515
  display: flex;
@@ -1598,30 +1693,6 @@
1598
1693
  align-self: flex-end;
1599
1694
  }
1600
1695
 
1601
- /* src/components/ThemeProvider/ThemeProvider.module.css */
1602
- .ThemeProvider_global-variables {
1603
- --dds-color-text-body: var(--dds-color-text-default);
1604
- --dds-color-text-body-subtle: var(--dds-color-text-subtle);
1605
- --dds-color-text-link: var(--dds-color-text-action-resting);
1606
- --dds-color-text-link-visited: var(--dds-color-text-action-visited);
1607
- --dds-color-text-label: var(--dds-color-text-medium);
1608
- --dds-color-text-placeholder: var(--dds-color-text-subtle);
1609
- --dds-color-text-helper: var(--dds-color-text-subtle);
1610
- --dds-color-icon-link: var(--dds-color-text-action-resting);
1611
- --dds-focus-outline: var(--dds-color-focus-outside) 2px solid;
1612
- --dds-focus-outline-offset: var(--dds-spacing-x0-125);
1613
- --dds-focus-outline-inset: calc(0px - var(--dds-spacing-x0-25));
1614
- --dds-focus-box-shadow: 0 0 0 2px var(--dds-color-focus-inside);
1615
- --dds-focus-transition: outline-offset 0.2s;
1616
- --dds-input-default-width: 320px;
1617
- --dds-transition-duration-surface-move: 0.5s;
1618
- }
1619
- .ThemeProvider_global-styles {
1620
- font: var(--dds-font-body-medium);
1621
- letter-spacing: var(--dds-font-body-medium-letter-spacing);
1622
- color: var(--dds-color-text-default);
1623
- }
1624
-
1625
1696
  /* src/components/EmptyContent/EmptyContent.module.css */
1626
1697
  .EmptyContent_containter {
1627
1698
  display: flex;
@@ -2843,10 +2914,10 @@
2843
2914
  z-index: var(--dds-zindex-popover);
2844
2915
  padding: var(--dds-spacing-x0-75) var(--dds-spacing-x1) var(--dds-spacing-x1-5) var(--dds-spacing-x1);
2845
2916
  }
2846
- .Popover_content--closable--no-title {
2917
+ .Popover_content--closable--no-header {
2847
2918
  margin-top: var(--dds-spacing-x2);
2848
2919
  }
2849
- .Popover_title {
2920
+ .Popover_header {
2850
2921
  margin-right: var(--dds-spacing-x2);
2851
2922
  }
2852
2923
  .Popover_close-button {