@norges-domstoler/dds-components 0.0.0-dev-20240916102541 → 0.0.0-dev-20240917132627

package/dist/index.css

@@ -116,19 +116,24 @@
 /* src/components/Typography/typographyStyles.module.css */
 :root {
   --dds-color-text-body: var(--dds-color-text-default);
+  --dds-color-text-body-subtle: var(--dds-color-text-subtle);
   --dds-color-text-link: var(--dds-color-text-action-resting);
   --dds-color-text-link-visited: var(--dds-color-text-action-visited);
   --dds-color-text-label: var(--dds-color-text-medium);
   --dds-color-text-placeholder: var(--dds-color-text-subtle);
   --dds-color-text-helper: var(--dds-color-text-subtle);
+  --dds-color-icon-link: var(--dds-color-text-action-resting);
 }
 .typographyStyles_contrast {
   --dds-color-text-body: var(--dds-color-text-on-inverse);
+  --dds-color-text-body-subtle: var(--dds-color-text-on-inverse);
   --dds-color-text-link: var(--dds-color-text-on-inverse);
   --dds-color-text-link-visited: var( --dds-color-text-action-visited-on-inverse );
   --dds-color-text-label: var(--dds-color-text-on-inverse);
   --dds-color-text-helper: var(--dds-color-text-on-inverse);
   --dds-color-text-placeholder: var(--dds-color-text-subtle);
+  --dds-color-icon-link: var(--dds-color-text-on-inverse);
+  color: var(--dds-color-text-on-inverse);
 }
 :where(.typographyStyles_a) {
   font: inherit;
@@ -981,7 +986,7 @@
   padding: var(--dds-spacing-x0-125) 0;
 }
 .Breadcrumbs_icon {
-  color: var(--dds-color-icon-action-resting);
+  color: var(--dds-color-icon-link);
 }
 
 /* src/components/Button/Button.module.css */
@@ -1394,6 +1399,11 @@
   gap: var(--dds-spacing-x0-75);
 }
 
+/* src/components/Contrast/Contrast.module.css */
+:where(.Contrast_container) {
+  background-color: var(--dds-color-surface-inverse-default);
+}
+
 /* src/components/date-inputs/common/DateInput.module.css */
 .DateInput_date-input {
   display: inline-flex;
@@ -1599,13 +1609,13 @@
 }
 .DescriptionList_list--default {
   dt {
-    color: var(--dds-color-text-default);
+    color: var(--dds-color-text-body);
     font-weight: 600;
   }
 }
 .DescriptionList_list--subtle {
   dt {
-    color: var(--dds-color-text-subtle);
+    color: var(--dds-color-text-body-subtle);
   }
 }
 .DescriptionList_list--row {
@@ -1623,7 +1633,7 @@
   align-items: center;
   display: flex;
   gap: var(--dds-spacing-x0-25);
-  color: var(--dds-color-text-default);
+  color: var(--dds-color-text-body);
 }
 .DescriptionList_group {
   margin: var(--dds-spacing-x2);
@@ -2038,7 +2048,6 @@
 
 /* src/components/Footer/Footer.module.css */
 .Footer_container {
-  background-color: var(--dds-color-brand-primary-default);
   padding-block-start: var(--dds-spacing-x3);
   padding-block-end: var(--dds-spacing-x6);
   @media only screen and (min-width: 960px) {
@@ -2441,7 +2450,7 @@
 
 /* src/components/List/List.module.css */
 .List_list {
-  color: var(--dds-color-text-default);
+  color: var(--dds-color-text-body);
   margin: var(--dds-spacing-x1) 0;
   ul,
   ol {
@@ -2466,15 +2475,21 @@
       position: absolute;
       top: calc((2.5em / 2) - 0.5em);
       left: 0;
-      background-size: contain;
-      background-repeat: no-repeat;
-      background-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<circle cx="6.7085" cy="6.7085" r="2.625" fill="%230B0D0E"/>%0A</svg>%0A');
+      background: var(--dds-color-text-body);
+      -webkit-mask-size: 100%;
+      mask-size: 100%;
+      -webkit-mask-repeat: no-repeat;
+      mask-repeat: no-repeat;
+      -webkit-mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<circle cx="6.7085" cy="6.7085" r="2.625" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<circle cx="6.7085" cy="6.7085" r="2.625" fill="%230B0D0E"/>%0A</svg>%0A');
     }
     ul > li:before {
-      background-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect x="3.04346" y="6.08691" width="7.30435" height="1.82609" fill="%230B0D0E"/>%0A</svg>%0A');
+      -webkit-mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect x="3.04346" y="6.08691" width="7.30435" height="1.82609" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<rect x="3.04346" y="6.08691" width="7.30435" height="1.82609" fill="%230B0D0E"/>%0A</svg>%0A');
     }
     ul > li > ul > li:before {
-      background-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M6.70817 9.33333C8.80225 9.33333 10.4998 7.50516 10.4998 5.25H2.9165C2.9165 7.50516 4.61409 9.33333 6.70817 9.33333Z" fill="%230B0D0E"/>%0A</svg>%0A');
+      -webkit-mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M6.70817 9.33333C8.80225 9.33333 10.4998 7.50516 10.4998 5.25H2.9165C2.9165 7.50516 4.61409 9.33333 6.70817 9.33333Z" fill="%230B0D0E"/>%0A</svg>%0A');
+      mask-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M6.70817 9.33333C8.80225 9.33333 10.4998 7.50516 10.4998 5.25H2.9165C2.9165 7.50516 4.61409 9.33333 6.70817 9.33333Z" fill="%230B0D0E"/>%0A</svg>%0A');
     }
   }
 }
@@ -3221,7 +3236,6 @@
 
 /* src/components/SkipToContent/SkipToContent.module.css */
 .SkipToContent_wrapper {
-  background-color: var(--dds-color-surface-inverse-default);
   padding: var(--dds-spacing-x0-25);
   box-sizing: border-box;
   position: absolute;
@@ -3244,11 +3258,6 @@
   z-index: 250;
   opacity: 1;
 }
-.SkipToContent_link,
-.SkipToContent_link:hover {
-  text-decoration: none;
-  color: var(--dds-color-text-on-inverse);
-}
 
 /* src/components/SplitButton/SplitButton.module.css */
 .SplitButton_container {