@norges-domstoler/dds-components 22.6.0 → 22.7.1

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
@@ -1454,6 +1454,11 @@
1454
1454
  }
1455
1455
  }
1456
1456
 
1457
+ /* src/components/layout/Contrast/Contrast.module.css */
1458
+ :where(.Contrast_container) {
1459
+ background-color: var(--dds-color-surface-inverse-default);
1460
+ }
1461
+
1457
1462
  /* src/components/layout/Grid/Grid.module.css */
1458
1463
  .Grid_dds-grid-template-columns {
1459
1464
  --dds-r-grid-template-columns: var(--dds-r-xs-grid-template-columns);
@@ -1866,8 +1871,6 @@
1866
1871
  display: inline-flex;
1867
1872
  align-items: center;
1868
1873
  justify-content: center;
1869
- height: -moz-fit-content;
1870
- height: fit-content;
1871
1874
  width: -moz-fit-content;
1872
1875
  width: fit-content;
1873
1876
  cursor: pointer;
@@ -2563,12 +2566,10 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
2563
2566
  }
2564
2567
  }
2565
2568
 
2566
- /* src/components/Contrast/Contrast.module.css */
2567
- :where(.Contrast_container) {
2568
- background-color: var(--dds-color-surface-inverse-default);
2569
- }
2570
-
2571
2569
  /* src/components/CookieBanner/CookieBanner.module.css */
2570
+ .CookieBanner_container:focus-visible {
2571
+ outline: none;
2572
+ }
2572
2573
  .CookieBanner_checkbox-label {
2573
2574
  padding: 0 0 0 calc(var(--dds-size-icon-component) + var(--dds-spacing-x0-5));
2574
2575
  align-items: flex-start;
@@ -3042,7 +3043,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
3042
3043
  margin: var(--dds-spacing-x1) 0;
3043
3044
  ul,
3044
3045
  ol {
3045
- margin: 0;
3046
+ margin-block: var(--dds-font-paragraph-spacing-list);
3046
3047
  }
3047
3048
  }
3048
3049
  .List_list--inherit {
@@ -3062,7 +3063,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
3062
3063
  height: var(--dds-list-bullet-size);
3063
3064
  width: var(--dds-list-bullet-size);
3064
3065
  position: absolute;
3065
- top: calc((var(--dds-font-lineheight-list) * 1em) / 2 - var(--dds-list-bullet-size) / 2);
3066
+ top: calc((var(--dds-font-lineheight-x1) * 1em) / 2 - var(--dds-list-bullet-size) / 2);
3066
3067
  left: 0;
3067
3068
  background: var(--dds-color-text-body);
3068
3069
  -webkit-mask-size: 100%;
@@ -3092,7 +3093,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
3092
3093
  }
3093
3094
  }
3094
3095
  .List_li {
3095
- line-height: var(--dds-font-lineheight-list);
3096
+ margin-bottom: var(--dds-font-paragraph-spacing-list);
3096
3097
  }
3097
3098
 
3098
3099
  /* src/components/FavStar/FavStar.module.css */
@@ -4036,7 +4037,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
4036
4037
  }
4037
4038
  .Table_table--with-dividers {
4038
4039
  .Table_row--body {
4039
- border-bottom: 1px solid var(--dds-color-border-default);
4040
+ border-bottom: 1px solid var(--dds-color-border-subtle);
4040
4041
  }
4041
4042
  .Table_row--colapsible-header--open {
4042
4043
  border-bottom: none;
@@ -4381,7 +4382,7 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
4381
4382
  box-sizing: border-box;
4382
4383
  cursor: pointer;
4383
4384
  background-color: var(--dds-color-surface-default);
4384
- border: 1px solid var(--dds-color-border-default);
4385
+ border: 1px solid;
4385
4386
  @media (prefers-reduced-motion: no-preference) {
4386
4387
  transition:
4387
4388
  border-color var(--dds-motion-micro-state),
@@ -4392,9 +4393,6 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
4392
4393
  }
4393
4394
  }
4394
4395
  .ToggleBar_label {
4395
- &:hover .ToggleBar_content {
4396
- background-color: var(--dds-color-surface-hover-default);
4397
- }
4398
4396
  &:first-child .ToggleBar_content {
4399
4397
  margin-inline-end: -1px;
4400
4398
  border-top-left-radius: var(--dds-border-radius-button);
@@ -4407,16 +4405,37 @@ input[data-indeterminate=true] ~ .SelectionControl_selection-control:after {
4407
4405
  &:not(:first-child):not(:last-child) .ToggleBar_content {
4408
4406
  margin-inline-end: -1px;
4409
4407
  }
4408
+ input:focus-visible + .ToggleBar_content,
4409
+ input:checked + .ToggleBar_content {
4410
+ position: relative;
4411
+ z-index: 0;
4412
+ border-radius: var(--dds-border-radius-button);
4413
+ }
4414
+ }
4415
+ .ToggleBar_label--primary {
4416
+ .ToggleBar_content {
4417
+ border-color: var(--dds-color-border-default);
4418
+ }
4419
+ &:hover .ToggleBar_content {
4420
+ background-color: var(--dds-color-surface-hover-default);
4421
+ }
4410
4422
  input:checked + .ToggleBar_content {
4411
4423
  color: var(--dds-color-text-on-action);
4412
4424
  border-color: var(--dds-color-surface-action-selected);
4413
4425
  background-color: var(--dds-color-surface-action-selected);
4414
- position: relative;
4415
- z-index: 0;
4416
4426
  }
4417
- input:focus-visible + .ToggleBar_content {
4418
- position: relative;
4419
- z-index: 0;
4427
+ }
4428
+ .ToggleBar_label--secondary {
4429
+ .ToggleBar_content {
4430
+ border-color: var(--dds-color-border-subtle);
4431
+ }
4432
+ &:hover .ToggleBar_content {
4433
+ background-color: var(--dds-color-surface-hover-subtle);
4434
+ }
4435
+ input:checked + .ToggleBar_content {
4436
+ color: var(--dds-color-text-default);
4437
+ border-color: var(--dds-color-border-default);
4438
+ background-color: var(--dds-color-surface-selected-default);
4420
4439
  }
4421
4440
  }
4422
4441