@navikt/ds-css 1.3.27 → 1.3.29

package/form/confirmation-panel.css

@@ -1,23 +1,11 @@
 :root,
 :host {
-  --navds-confirmation-panel-color-background: var(
-    --navds-global-color-orange-50
-  );
-  --navds-confirmation-panel-color-background-checked: var(
-    --navds-global-color-green-50
-  );
-  --navds-confirmation-panel-color-background-error: var(
-    --navds-global-color-red-50
-  );
-  --navds-confirmation-panel-color-border: var(
-    --navds-semantic-color-feedback-warning-border
-  );
-  --navds-confirmation-panel-color-border-checked: var(
-    --navds-semantic-color-feedback-success-border
-  );
-  --navds-confirmation-panel-color-border-error: var(
-    --navds-semantic-color-feedback-danger-border
-  );
+  --navds-confirmation-panel-color-background: var(--navds-global-color-orange-50);
+  --navds-confirmation-panel-color-background-checked: var(--navds-global-color-green-50);
+  --navds-confirmation-panel-color-background-error: var(--navds-global-color-red-50);
+  --navds-confirmation-panel-color-border: var(--navds-semantic-color-feedback-warning-border);
+  --navds-confirmation-panel-color-border-checked: var(--navds-semantic-color-feedback-success-border);
+  --navds-confirmation-panel-color-border-error: var(--navds-semantic-color-feedback-danger-border);
 }
 
 .navds-confirmation-panel__inner {

package/form/error-summary.css

@@ -1,11 +1,7 @@
 :root,
 :host {
-  --navds-error-summary-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
-  --navds-error-summary-color-border: var(
-    --navds-semantic-color-feedback-danger-border
-  );
+  --navds-error-summary-color-background: var(--navds-semantic-color-component-background-light);
+  --navds-error-summary-color-border: var(--navds-semantic-color-feedback-danger-border);
 }
 
 .navds-error-summary {

package/form/radio-checkbox.css

@@ -1,28 +1,14 @@
 :root,
 :host {
-  --navds-radio-checkbox-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-radio-checkbox-color-background: var(--navds-semantic-color-component-background-light);
   --navds-radio-checkbox-color-text: var(--navds-semantic-color-text);
-  --navds-radio-checkbox-color-background-hover: var(
-    --navds-semantic-color-interaction-primary-hover-subtle
-  );
-  --navds-radio-checkbox-color-background-checked: var(
-    --navds-semantic-color-interaction-primary
-  );
+  --navds-radio-checkbox-color-background-hover: var(--navds-semantic-color-interaction-primary-hover-subtle);
+  --navds-radio-checkbox-color-background-checked: var(--navds-semantic-color-interaction-primary);
   --navds-radio-checkbox-color-shadow: var(--navds-semantic-color-border);
-  --navds-radio-checkbox-color-shadow-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-radio-checkbox-color-shadow-checked: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-radio-checkbox-color-shadow-error: var(
-    --navds-semantic-color-interaction-danger
-  );
-  --navds-radio-checkbox-color-label-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
+  --navds-radio-checkbox-color-shadow-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-radio-checkbox-color-shadow-checked: var(--navds-semantic-color-interaction-primary);
+  --navds-radio-checkbox-color-shadow-error: var(--navds-semantic-color-interaction-danger);
+  --navds-radio-checkbox-color-label-hover: var(--navds-semantic-color-interaction-primary);
 }
 
 .navds-checkbox,
@@ -94,14 +80,12 @@
 
 .navds-checkbox__input:focus + .navds-checkbox__label::before,
 .navds-radio__input:focus + .navds-radio__label::before {
-  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow),
-    var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow), var(--navds-shadow-focus);
 }
 
 .navds-checkbox__input:hover:focus + .navds-checkbox__label::before,
 .navds-radio__input:hover:focus + .navds-radio__label::before {
-  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-hover),
-    var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-hover), var(--navds-shadow-focus);
 }
 
 .navds-checkbox__input:indeterminate + .navds-checkbox__label::before {
@@ -121,9 +105,7 @@
   flex-shrink: 0;
 }
 
-.navds-checkbox--small
-  .navds-checkbox__input:indeterminate
-  + .navds-checkbox__label::after {
+.navds-checkbox--small .navds-checkbox__input:indeterminate + .navds-checkbox__label::after {
   transform: translate(0.25rem, -50%);
 }
 
@@ -136,9 +118,7 @@
   background-color: var(--navds-radio-checkbox-color-background-checked);
 }
 
-.navds-checkbox--small
-  > .navds-checkbox__input:checked
-  + .navds-checkbox__label::before {
+.navds-checkbox--small > .navds-checkbox__input:checked + .navds-checkbox__label::before {
   background-position: 4px center;
 }
 
@@ -148,14 +128,12 @@
 }
 
 .navds-radio__input:checked + .navds-radio__label::before {
-  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-checked),
-    inset 0 0 0 4px #fff;
+  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-checked), inset 0 0 0 4px #fff;
   background-color: var(--navds-radio-checkbox-color-background-checked);
 }
 
 .navds-radio__input:checked:focus + .navds-radio__label::before {
-  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-checked),
-    inset 0 0 0 4px #fff, var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-checked), inset 0 0 0 4px #fff, var(--navds-shadow-focus);
 }
 
 .navds-checkbox__input:hover:not(:disabled) + .navds-checkbox__label,
@@ -163,17 +141,13 @@
   color: var(--navds-radio-checkbox-color-label-hover);
 }
 
-.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)
-  + .navds-checkbox__label::before,
-.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus)
-  + .navds-radio__label::before {
+.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus) + .navds-checkbox__label::before,
+.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus) + .navds-radio__label::before {
   box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-hover);
 }
 
-.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate)
-  + .navds-checkbox__label::before,
-.navds-radio__input:hover:not(:disabled):not(:checked)
-  + .navds-radio__label::before {
+.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate) + .navds-checkbox__label::before,
+.navds-radio__input:hover:not(:disabled):not(:checked) + .navds-radio__label::before {
   background-color: var(--navds-radio-checkbox-color-background-hover);
 }
 
@@ -192,8 +166,7 @@
 .navds-radio--error
   > .navds-radio__input:focus:not(:hover):not(:disabled):not(:checked):not(:indeterminate)
   + .navds-radio__label::before {
-  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-error),
-    var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow-error), var(--navds-shadow-focus);
 }
 
 .navds-checkbox--disabled,

package/form/search.css

@@ -3,9 +3,7 @@
 [data-theme="light"] {
   --navds-search-color-text: var(--navds-semantic-color-text);
   --navds-search-color-border: var(--navds-semantic-color-border);
-  --navds-search-color-border-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
+  --navds-search-color-border-hover: var(--navds-semantic-color-interaction-primary);
   --navds-search-color-clear-hover: var(--navds-global-color-blue-500);
   --navds-search-color-border-error: var(--navds-global-color-red-500);
 }
@@ -121,32 +119,26 @@
 }
 
 .navds-search__button-search.navds-button--secondary {
-  box-shadow: -1px 0 0 0 var(--navds-search-color-border) inset,
-    0 1px 0 0 var(--navds-search-color-border) inset,
+  box-shadow: -1px 0 0 0 var(--navds-search-color-border) inset, 0 1px 0 0 var(--navds-search-color-border) inset,
     0 -1px 0 0 var(--navds-search-color-border) inset;
 }
 
 .navds-search__button-search.navds-button--secondary:hover {
-  box-shadow: -1px 0 0 0 var(--navds-search-color-border-hover) inset,
-    0 1px 0 0 var(--navds-search-color-border-hover) inset,
-    0 -1px 0 0 var(--navds-search-color-border-hover) inset,
-    -1px 0 0 0 var(--navds-search-color-border-hover);
+  box-shadow: -1px 0 0 0 var(--navds-search-color-border-hover) inset, 0 1px 0 0 var(--navds-search-color-border-hover) inset,
+    0 -1px 0 0 var(--navds-search-color-border-hover) inset, -1px 0 0 0 var(--navds-search-color-border-hover);
   z-index: 1;
 }
 
-.navds-search__wrapper-inner:focus-within
-  + .navds-search__button-search.navds-button--secondary:hover {
+.navds-search__wrapper-inner:focus-within + .navds-search__button-search.navds-button--secondary:hover {
   z-index: auto;
 }
 
 .navds-search__button-search.navds-button--secondary:focus {
-  box-shadow: 0 0 0 1px var(--navds-search-color-border) inset,
-    var(--navds-shadow-focus);
+  box-shadow: 0 0 0 1px var(--navds-search-color-border) inset, var(--navds-shadow-focus);
 }
 
 .navds-search__button-search.navds-button--secondary:focus:hover {
-  box-shadow: 0 0 0 1px var(--navds-search-color-border-hover) inset,
-    var(--navds-shadow-focus);
+  box-shadow: 0 0 0 1px var(--navds-search-color-border-hover) inset, var(--navds-shadow-focus);
 }
 
 .navds-search__button-search.navds-button--secondary:focus:active {
@@ -160,8 +152,7 @@
 }
 
 .navds-search--error .navds-search__input:focus:not(:hover):not(:disabled) {
-  box-shadow: inset 0 0 0 1px var(--navds-search-color-border-error),
-    var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 1px var(--navds-search-color-border-error), var(--navds-shadow-focus);
 }
 
 /* Focus layering */

package/form/select.css

@@ -1,22 +1,12 @@
 :root,
 :host {
-  --navds-select-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-select-color-background: var(--navds-semantic-color-component-background-light);
   --navds-select-color-border: var(--navds-semantic-color-border);
-  --navds-select-color-border-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-select-color-border-error: var(
-    --navds-semantic-color-interaction-danger
-  );
-  --navds-select-color-shadow-error: var(
-    --navds-semantic-color-interaction-danger
-  );
+  --navds-select-color-border-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-select-color-border-error: var(--navds-semantic-color-interaction-danger);
+  --navds-select-color-shadow-error: var(--navds-semantic-color-interaction-danger);
   --navds-select-color-border-disabled: var(--navds-global-color-gray-400);
-  --navds-select-color-background-disabled: var(
-    --navds-semantic-color-component-background-alternate
-  );
+  --navds-select-color-background-disabled: var(--navds-semantic-color-component-background-alternate);
 }
 
 .navds-select__input {

package/form/switch.css

@@ -1,32 +1,16 @@
 :root,
 :host {
   --navds-switch-color-label: var(--navds-semantic-color-text);
-  --navds-switch-color-label-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
+  --navds-switch-color-label-hover: var(--navds-semantic-color-interaction-primary);
   --navds-switch-color-track-background: var(--navds-semantic-color-text-muted);
-  --navds-switch-color-track-background-checked: var(
-    --navds-semantic-color-feedback-success-border
-  );
-  --navds-switch-color-track-background-hover: var(
-    --navds-global-color-gray-800
-  );
-  --navds-switch-color-track-background-hover-checked: var(
-    --navds-semantic-color-feedback-success-icon
-  );
-  --navds-switch-color-track-shadow-inner-focus: var(
-    --navds-semantic-color-component-background-light
-  );
-  --navds-switch-color-thumb: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-switch-color-track-background-checked: var(--navds-semantic-color-feedback-success-border);
+  --navds-switch-color-track-background-hover: var(--navds-global-color-gray-800);
+  --navds-switch-color-track-background-hover-checked: var(--navds-semantic-color-feedback-success-icon);
+  --navds-switch-color-track-shadow-inner-focus: var(--navds-semantic-color-component-background-light);
+  --navds-switch-color-thumb: var(--navds-semantic-color-component-background-light);
   --navds-switch-color-thumb-icon: var(--navds-semantic-color-text-muted);
-  --navds-switch-color-thumb-icon-checked: var(
-    --navds-semantic-color-feedback-success-border
-  );
-  --navds-switch-color-thumb-loader-checked: var(
-    --navds-semantic-color-feedback-success-border
-  );
+  --navds-switch-color-thumb-icon-checked: var(--navds-semantic-color-feedback-success-border);
+  --navds-switch-color-thumb-loader-checked: var(--navds-semantic-color-feedback-success-border);
 }
 
 .navds-switch {
@@ -78,21 +62,15 @@
 }
 
 .navds-switch--small > .navds-switch__label-wrapper > .navds-switch__content {
-  padding: calc(var(--navds-spacing-2) - 2px) 0
-    calc(var(--navds-spacing-2) - 2px) 3.25rem;
+  padding: calc(var(--navds-spacing-2) - 2px) 0 calc(var(--navds-spacing-2) - 2px) 3.25rem;
 }
 
-.navds-switch--right.navds-switch--small
-  > .navds-switch__label-wrapper
-  > .navds-switch__content {
-  padding: calc(var(--navds-spacing-2) - 2px) 3.25rem
-    calc(var(--navds-spacing-2) - 2px) 0;
+.navds-switch--right.navds-switch--small > .navds-switch__label-wrapper > .navds-switch__content {
+  padding: calc(var(--navds-spacing-2) - 2px) 3.25rem calc(var(--navds-spacing-2) - 2px) 0;
 }
 
 .navds-switch--with-description,
-.navds-switch--small
-  > .navds-switch__label-wrapper
-  > .navds-switch--with-description {
+.navds-switch--small > .navds-switch__label-wrapper > .navds-switch--with-description {
   padding-bottom: 0;
 }
 
@@ -148,8 +126,7 @@
 }
 
 .navds-switch__input:focus ~ .navds-switch__track {
-  box-shadow: 0 0 0 1px var(--navds-switch-color-track-shadow-inner-focus),
-    var(--navds-shadow-focus);
+  box-shadow: 0 0 0 1px var(--navds-switch-color-track-shadow-inner-focus), var(--navds-shadow-focus);
 }
 
 /* Thumb */
@@ -179,30 +156,21 @@
     transform: translateX(2px);
   }
 
-  .navds-switch__input:checked:hover
-    ~ .navds-switch__track
-    > .navds-switch__thumb {
+  .navds-switch__input:checked:hover ~ .navds-switch__track > .navds-switch__thumb {
     transform: translateX(18px);
   }
 }
 
-.navds-switch__input:disabled:hover
-  ~ .navds-switch__track
-  > .navds-switch__thumb {
+.navds-switch__input:disabled:hover ~ .navds-switch__track > .navds-switch__thumb {
   transform: translateX(0);
 }
 
-.navds-switch__input:checked:disabled:hover
-  ~ .navds-switch__track
-  > .navds-switch__thumb {
+.navds-switch__input:checked:disabled:hover ~ .navds-switch__track > .navds-switch__thumb {
   transform: translateX(20px);
 }
 
 /* Loader */
-.navds-switch__input:checked
-  ~ .navds-switch__track
-  > .navds-switch__thumb
-  .navds-loader__foreground {
+.navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb .navds-loader__foreground {
   stroke: var(--navds-switch-color-thumb-loader-checked);
 }
 

package/form/text-field.css

@@ -2,34 +2,20 @@
 :host,
 [data-theme="light"] {
   --navds-text-field-color-text: var(--navds-semantic-color-text);
-  --navds-text-field-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-text-field-color-background: var(--navds-semantic-color-component-background-light);
   --navds-text-field-color-border: var(--navds-semantic-color-border);
-  --navds-text-field-color-border-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-text-field-color-border-error: var(
-    --navds-semantic-color-interaction-danger
-  );
-  --navds-text-field-color-shadow-error: var(
-    --navds-semantic-color-interaction-danger
-  );
+  --navds-text-field-color-border-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-text-field-color-border-error: var(--navds-semantic-color-interaction-danger);
+  --navds-text-field-color-shadow-error: var(--navds-semantic-color-interaction-danger);
   --navds-text-field-color-border-disabled: var(--navds-global-color-gray-400);
-  --navds-text-field-color-background-disabled: var(
-    --navds-semantic-color-component-background-alternate
-  );
+  --navds-text-field-color-background-disabled: var(--navds-semantic-color-component-background-alternate);
   --navds-text-field-color-text-disabled: var(--navds-semantic-color-text);
-  --navds-text-field-color-placeholder-text: var(
-    --navds-semantic-color-text-muted
-  );
+  --navds-text-field-color-placeholder-text: var(--navds-semantic-color-text-muted);
 }
 
 [data-theme="dark"] {
   --navds-text-field-color-text: var(--navds-semantic-color-text-inverted);
-  --navds-text-field-color-background: var(
-    --navds-semantic-color-component-background-inverted
-  );
+  --navds-text-field-color-background: var(--navds-semantic-color-component-background-inverted);
   --navds-text-field-color-border: var(--navds-semantic-color-border-inverted);
   --navds-text-field-color-border-hover: var(--navds-global-color-blue-200);
   --navds-text-field-color-placeholder-text: var(--navds-global-color-gray-500);
@@ -76,10 +62,8 @@
   box-shadow: 0 0 0 1px var(--navds-text-field-color-border-error);
 }
 
-.navds-text-field--error
-  > .navds-text-field__input:focus:not(:hover):not(:disabled) {
-  box-shadow: 0 0 0 1px var(--navds-text-field-color-border-error),
-    var(--navds-shadow-focus);
+.navds-text-field--error > .navds-text-field__input:focus:not(:hover):not(:disabled) {
+  box-shadow: 0 0 0 1px var(--navds-text-field-color-border-error), var(--navds-shadow-focus);
 }
 
 /* Disabled handling */

package/form/textarea.css

@@ -1,27 +1,15 @@
 :root,
 :host {
-  --navds-textarea-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-textarea-color-background: var(--navds-semantic-color-component-background-light);
   --navds-textarea-color-border: var(--navds-semantic-color-border);
-  --navds-textarea-color-border-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-textarea-color-border-error: var(
-    --navds-semantic-color-interaction-danger
-  );
-  --navds-textarea-color-shadow-error: var(
-    --navds-semantic-color-interaction-danger
-  );
+  --navds-textarea-color-border-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-textarea-color-border-error: var(--navds-semantic-color-interaction-danger);
+  --navds-textarea-color-shadow-error: var(--navds-semantic-color-interaction-danger);
   --navds-textarea-color-counter-text: var(--navds-semantic-color-text-muted);
-  --navds-textarea-color-counter-text-error: var(
-    --navds-semantic-color-interaction-danger
-  );
+  --navds-textarea-color-counter-text-error: var(--navds-semantic-color-interaction-danger);
   --navds-textarea-color-text-disabled: var(--navds-semantic-color-text);
   --navds-textarea-color-border-disabled: var(--navds-global-color-gray-400);
-  --navds-textarea-color-background-disabled: var(
-    --navds-semantic-color-component-background-alternate
-  );
+  --navds-textarea-color-background-disabled: var(--navds-semantic-color-component-background-alternate);
 }
 
 .navds-textarea__wrapper {
@@ -84,8 +72,7 @@
 /**
   Error handling
 */
-.navds-textarea--error
-  .navds-textarea__input:not(:hover):not(:focus):not(:disabled) {
+.navds-textarea--error .navds-textarea__input:not(:hover):not(:focus):not(:disabled) {
   box-shadow: 0 0 0 1px var(--navds-textarea-color-shadow-error);
   border-color: var(--navds-textarea-color-border-error);
 }

package/guide-panel.css

@@ -1,12 +1,8 @@
 :root,
 :host {
-  --navds-guide-panel-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-guide-panel-color-background: var(--navds-semantic-color-component-background-light);
   --navds-guide-panel-color-border: var(--navds-global-color-blue-400);
-  --navds-guide-panel-color-illustration-background: var(
-    --navds-global-color-blue-200
-  );
+  --navds-guide-panel-color-illustration-background: var(--navds-global-color-blue-200);
 }
 
 /**

package/help-text.css

@@ -1,24 +1,12 @@
 :root,
 :host {
   --navds-help-text-color: var(--navds-semantic-color-interaction-primary);
-  --navds-help-text-color-hover: var(
-    --navds-semantic-color-component-background-light
-  );
-  --navds-help-text-color-focus: var(
-    --navds-semantic-color-component-background-light
-  );
-  --navds-help-text-color-background-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-help-text-color-background-focus: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-help-text-color-shadow-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
-  --navds-help-text-color-popover-background: var(
-    --navds-semantic-color-feedback-info-background
-  );
+  --navds-help-text-color-hover: var(--navds-semantic-color-component-background-light);
+  --navds-help-text-color-focus: var(--navds-semantic-color-component-background-light);
+  --navds-help-text-color-background-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-help-text-color-background-focus: var(--navds-semantic-color-interaction-primary);
+  --navds-help-text-color-shadow-hover: var(--navds-semantic-color-interaction-primary);
+  --navds-help-text-color-popover-background: var(--navds-semantic-color-feedback-info-background);
 }
 
 .navds-help-text__button {
@@ -37,8 +25,7 @@
 
 .navds-help-text__button:focus {
   outline: none;
-  box-shadow: 0 0 0 1px var(--navds-global-color-white),
-    0 0 0 4px var(--navds-semantic-color-focus);
+  box-shadow: 0 0 0 1px var(--navds-global-color-white), 0 0 0 4px var(--navds-semantic-color-focus);
 }
 
 .navds-help-text__icon {
@@ -60,12 +47,10 @@
   display: none;
 }
 
-.navds-help-text__button:where(:hover, :focus, [aria-expanded="true"])
-  > .navds-help-text__icon {
+.navds-help-text__button:where(:hover, :focus, [aria-expanded="true"]) > .navds-help-text__icon {
   display: none;
 }
 
-.navds-help-text__button:where(:hover, :focus, [aria-expanded="true"])
-  > .navds-help-text__icon--filled {
+.navds-help-text__button:where(:hover, :focus, [aria-expanded="true"]) > .navds-help-text__icon--filled {
   display: inherit;
 }

package/link-panel.css

@@ -1,9 +1,7 @@
 :root,
 :host {
   --navds-link-panel-color-text: var(--navds-semantic-color-text);
-  --navds-link-panel-color-border-hover: var(
-    --navds-semantic-color-interaction-primary
-  );
+  --navds-link-panel-color-border-hover: var(--navds-semantic-color-interaction-primary);
   --navds-link-panel-color-title-hover: var(--navds-semantic-color-link);
 }
 

package/loader.css

@@ -3,9 +3,7 @@
   --navds-loader-color-foreground: var(--navds-global-color-gray-400);
   --navds-loader-color-background: rgb(0 0 0 / 0.05);
   --navds-loader-color-neutral-foreground: var(--navds-global-color-gray-400);
-  --navds-loader-color-interaction-foreground: var(
-    --navds-global-color-blue-500
-  );
+  --navds-loader-color-interaction-foreground: var(--navds-global-color-blue-500);
   --navds-loader-color-inverted-foreground: var(--navds-global-color-white);
   --navds-loader-color-inverted-background: rgb(255 255 255 / 0.25);
   --navds-loader-color-transparent-background: transparent;

package/modal.css

@@ -1,8 +1,6 @@
 :root,
 :host {
-  --navds-modal-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-modal-color-background: var(--navds-semantic-color-component-background-light);
   --navds-modal-color-overlay: rgb(38 38 38 / 0.7);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-css",
-  "version": "1.3.27",
+  "version": "1.3.29",
   "description": "Css for NAV Designsystem components",
   "author": "NAV Designsystem team",
   "keywords": [
@@ -20,12 +20,12 @@
     "watch": "postcss --watch --use postcss-import -o dist/index.css index.css"
   },
   "devDependencies": {
-    "@navikt/ds-tokens": "^1.3.27",
+    "@navikt/ds-tokens": "^1.3.29",
     "normalize.css": "^8.0.1",
     "postcss": "^8.3.6",
     "postcss-cli": "^8.3.1",
     "postcss-combine-duplicated-selectors": "10.0.3",
     "postcss-import": "^14.0.2"
   },
-  "gitHead": "917abc8b9cfb6343efb6f63537630406e5571cbd"
+  "gitHead": "b9ae29f7e42b0183eeef42ffc8c6efdf4277c782"
 }

package/pagination.css

@@ -1,11 +1,7 @@
 :root,
 :host {
-  --navds-pagination-color-background-selected: var(
-    --navds-semantic-color-interaction-primary-selected
-  );
-  --navds-pagination-color-text-selected: var(
-    --navds-semantic-color-text-inverted
-  );
+  --navds-pagination-color-background-selected: var(--navds-semantic-color-interaction-primary-selected);
+  --navds-pagination-color-text-selected: var(--navds-semantic-color-text-inverted);
 }
 
 .navds-pagination__list {
@@ -46,8 +42,7 @@
 }
 
 .navds-pagination__item[aria-current="true"]:focus {
-  box-shadow: inset 0 0 0 1px var(--navds-button-color-tertiary-border-active),
-    var(--navds-shadow-focus);
+  box-shadow: inset 0 0 0 1px var(--navds-button-color-tertiary-border-active), var(--navds-shadow-focus);
 }
 
 .navds-pagination__prev-next {
@@ -56,14 +51,12 @@
   gap: var(--navds-spacing-1);
 }
 
-.navds-pagination--small
-  .navds-pagination__prev-next:where(.navds-pagination--prev-next--with-text) {
+.navds-pagination--small .navds-pagination__prev-next:where(.navds-pagination--prev-next--with-text) {
   padding-left: 0.375rem;
   padding-right: 0.375rem;
 }
 
-.navds-pagination--xsmall
-  .navds-pagination__prev-next:where(.navds-pagination--prev-next--with-text) {
+.navds-pagination--xsmall .navds-pagination__prev-next:where(.navds-pagination--prev-next--with-text) {
   padding-left: 0.125rem;
   padding-right: 0.125rem;
 }

package/panel.css

@@ -1,8 +1,6 @@
 :root,
 :host {
-  --navds-panel-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-panel-color-background: var(--navds-semantic-color-component-background-light);
   --navds-panel-color-border: var(--navds-semantic-color-border-muted);
 }
 

package/popover.css

@@ -1,8 +1,6 @@
 :root,
 :host {
-  --navds-popover-color-background: var(
-    --navds-semantic-color-component-background-light
-  );
+  --navds-popover-color-background: var(--navds-semantic-color-component-background-light);
   --navds-popover-color-border: var(--navds-semantic-color-border-muted);
 }