@digdir/designsystemet-css
Version:
CSS for Designsystemet
1 lines • 11.5 kB
CSS
@theme{--font-sans:var(--ds-font-family);--radius-lg:var(--ds-border-radius-lg);--radius-md:var(--ds-border-radius-md);--radius-sm:var(--ds-border-radius-sm);--radius-xl:var(--ds-border-radius-xl);--color-accent-background-default:var(--ds-color-accent-background-default);--color-accent-background-tinted:var(--ds-color-accent-background-tinted);--color-accent-base-active:var(--ds-color-accent-base-active);--color-accent-base-contrast-default:var(--ds-color-accent-base-contrast-default);--color-accent-base-contrast-subtle:var(--ds-color-accent-base-contrast-subtle);--color-accent-base-default:var(--ds-color-accent-base-default);--color-accent-base-hover:var(--ds-color-accent-base-hover);--color-accent-border-default:var(--ds-color-accent-border-default);--color-accent-border-strong:var(--ds-color-accent-border-strong);--color-accent-border-subtle:var(--ds-color-accent-border-subtle);--color-accent-surface-active:var(--ds-color-accent-surface-active);--color-accent-surface-default:var(--ds-color-accent-surface-default);--color-accent-surface-hover:var(--ds-color-accent-surface-hover);--color-accent-surface-tinted:var(--ds-color-accent-surface-tinted);--color-accent-text-default:var(--ds-color-accent-text-default);--color-accent-text-subtle:var(--ds-color-accent-text-subtle);--color-background-default:var(--ds-color-background-default);--color-background-tinted:var(--ds-color-background-tinted);--color-base-active:var(--ds-color-base-active);--color-base-contrast-default:var(--ds-color-base-contrast-default);--color-base-contrast-subtle:var(--ds-color-base-contrast-subtle);--color-base-default:var(--ds-color-base-default);--color-base-hover:var(--ds-color-base-hover);--color-border-default:var(--ds-color-border-default);--color-border-strong:var(--ds-color-border-strong);--color-border-subtle:var(--ds-color-border-subtle);--color-brand1-background-default:var(--ds-color-brand1-background-default);--color-brand1-background-tinted:var(--ds-color-brand1-background-tinted);--color-brand1-base-active:var(--ds-color-brand1-base-active);--color-brand1-base-contrast-default:var(--ds-color-brand1-base-contrast-default);--color-brand1-base-contrast-subtle:var(--ds-color-brand1-base-contrast-subtle);--color-brand1-base-default:var(--ds-color-brand1-base-default);--color-brand1-base-hover:var(--ds-color-brand1-base-hover);--color-brand1-border-default:var(--ds-color-brand1-border-default);--color-brand1-border-strong:var(--ds-color-brand1-border-strong);--color-brand1-border-subtle:var(--ds-color-brand1-border-subtle);--color-brand1-surface-active:var(--ds-color-brand1-surface-active);--color-brand1-surface-default:var(--ds-color-brand1-surface-default);--color-brand1-surface-hover:var(--ds-color-brand1-surface-hover);--color-brand1-surface-tinted:var(--ds-color-brand1-surface-tinted);--color-brand1-text-default:var(--ds-color-brand1-text-default);--color-brand1-text-subtle:var(--ds-color-brand1-text-subtle);--color-brand2-background-default:var(--ds-color-brand2-background-default);--color-brand2-background-tinted:var(--ds-color-brand2-background-tinted);--color-brand2-base-active:var(--ds-color-brand2-base-active);--color-brand2-base-contrast-default:var(--ds-color-brand2-base-contrast-default);--color-brand2-base-contrast-subtle:var(--ds-color-brand2-base-contrast-subtle);--color-brand2-base-default:var(--ds-color-brand2-base-default);--color-brand2-base-hover:var(--ds-color-brand2-base-hover);--color-brand2-border-default:var(--ds-color-brand2-border-default);--color-brand2-border-strong:var(--ds-color-brand2-border-strong);--color-brand2-border-subtle:var(--ds-color-brand2-border-subtle);--color-brand2-surface-active:var(--ds-color-brand2-surface-active);--color-brand2-surface-default:var(--ds-color-brand2-surface-default);--color-brand2-surface-hover:var(--ds-color-brand2-surface-hover);--color-brand2-surface-tinted:var(--ds-color-brand2-surface-tinted);--color-brand2-text-default:var(--ds-color-brand2-text-default);--color-brand2-text-subtle:var(--ds-color-brand2-text-subtle);--color-danger-background-default:var(--ds-color-danger-background-default);--color-danger-background-tinted:var(--ds-color-danger-background-tinted);--color-danger-base-active:var(--ds-color-danger-base-active);--color-danger-base-contrast-default:var(--ds-color-danger-base-contrast-default);--color-danger-base-contrast-subtle:var(--ds-color-danger-base-contrast-subtle);--color-danger-base-default:var(--ds-color-danger-base-default);--color-danger-base-hover:var(--ds-color-danger-base-hover);--color-danger-border-default:var(--ds-color-danger-border-default);--color-danger-border-strong:var(--ds-color-danger-border-strong);--color-danger-border-subtle:var(--ds-color-danger-border-subtle);--color-danger-surface-active:var(--ds-color-danger-surface-active);--color-danger-surface-default:var(--ds-color-danger-surface-default);--color-danger-surface-hover:var(--ds-color-danger-surface-hover);--color-danger-surface-tinted:var(--ds-color-danger-surface-tinted);--color-danger-text-default:var(--ds-color-danger-text-default);--color-danger-text-subtle:var(--ds-color-danger-text-subtle);--color-info-background-default:var(--ds-color-info-background-default);--color-info-background-tinted:var(--ds-color-info-background-tinted);--color-info-base-active:var(--ds-color-info-base-active);--color-info-base-contrast-default:var(--ds-color-info-base-contrast-default);--color-info-base-contrast-subtle:var(--ds-color-info-base-contrast-subtle);--color-info-base-default:var(--ds-color-info-base-default);--color-info-base-hover:var(--ds-color-info-base-hover);--color-info-border-default:var(--ds-color-info-border-default);--color-info-border-strong:var(--ds-color-info-border-strong);--color-info-border-subtle:var(--ds-color-info-border-subtle);--color-info-surface-active:var(--ds-color-info-surface-active);--color-info-surface-default:var(--ds-color-info-surface-default);--color-info-surface-hover:var(--ds-color-info-surface-hover);--color-info-surface-tinted:var(--ds-color-info-surface-tinted);--color-info-text-default:var(--ds-color-info-text-default);--color-info-text-subtle:var(--ds-color-info-text-subtle);--color-neutral-background-default:var(--ds-color-neutral-background-default);--color-neutral-background-tinted:var(--ds-color-neutral-background-tinted);--color-neutral-base-active:var(--ds-color-neutral-base-active);--color-neutral-base-contrast-default:var(--ds-color-neutral-base-contrast-default);--color-neutral-base-contrast-subtle:var(--ds-color-neutral-base-contrast-subtle);--color-neutral-base-default:var(--ds-color-neutral-base-default);--color-neutral-base-hover:var(--ds-color-neutral-base-hover);--color-neutral-border-default:var(--ds-color-neutral-border-default);--color-neutral-border-strong:var(--ds-color-neutral-border-strong);--color-neutral-border-subtle:var(--ds-color-neutral-border-subtle);--color-neutral-surface-active:var(--ds-color-neutral-surface-active);--color-neutral-surface-default:var(--ds-color-neutral-surface-default);--color-neutral-surface-hover:var(--ds-color-neutral-surface-hover);--color-neutral-surface-tinted:var(--ds-color-neutral-surface-tinted);--color-neutral-text-default:var(--ds-color-neutral-text-default);--color-neutral-text-subtle:var(--ds-color-neutral-text-subtle);--color-success-background-default:var(--ds-color-success-background-default);--color-success-background-tinted:var(--ds-color-success-background-tinted);--color-success-base-active:var(--ds-color-success-base-active);--color-success-base-contrast-default:var(--ds-color-success-base-contrast-default);--color-success-base-contrast-subtle:var(--ds-color-success-base-contrast-subtle);--color-success-base-default:var(--ds-color-success-base-default);--color-success-base-hover:var(--ds-color-success-base-hover);--color-success-border-default:var(--ds-color-success-border-default);--color-success-border-strong:var(--ds-color-success-border-strong);--color-success-border-subtle:var(--ds-color-success-border-subtle);--color-success-surface-active:var(--ds-color-success-surface-active);--color-success-surface-default:var(--ds-color-success-surface-default);--color-success-surface-hover:var(--ds-color-success-surface-hover);--color-success-surface-tinted:var(--ds-color-success-surface-tinted);--color-success-text-default:var(--ds-color-success-text-default);--color-success-text-subtle:var(--ds-color-success-text-subtle);--color-surface-active:var(--ds-color-surface-active);--color-surface-default:var(--ds-color-surface-default);--color-surface-hover:var(--ds-color-surface-hover);--color-surface-tinted:var(--ds-color-surface-tinted);--color-text-default:var(--ds-color-text-default);--color-text-subtle:var(--ds-color-text-subtle);--color-warning-background-default:var(--ds-color-warning-background-default);--color-warning-background-tinted:var(--ds-color-warning-background-tinted);--color-warning-base-active:var(--ds-color-warning-base-active);--color-warning-base-contrast-default:var(--ds-color-warning-base-contrast-default);--color-warning-base-contrast-subtle:var(--ds-color-warning-base-contrast-subtle);--color-warning-base-default:var(--ds-color-warning-base-default);--color-warning-base-hover:var(--ds-color-warning-base-hover);--color-warning-border-default:var(--ds-color-warning-border-default);--color-warning-border-strong:var(--ds-color-warning-border-strong);--color-warning-border-subtle:var(--ds-color-warning-border-subtle);--color-warning-surface-active:var(--ds-color-warning-surface-active);--color-warning-surface-default:var(--ds-color-warning-surface-default);--color-warning-surface-hover:var(--ds-color-warning-surface-hover);--color-warning-surface-tinted:var(--ds-color-warning-surface-tinted);--color-warning-text-default:var(--ds-color-warning-text-default);--color-warning-text-subtle:var(--ds-color-warning-text-subtle);--font-weight-medium:var(--ds-font-weight-medium);--font-weight-regular:var(--ds-font-weight-regular);--font-weight-semibold:var(--ds-font-weight-semibold);--spacing-0:var(--ds-size-0);--spacing-1:var(--ds-size-1);--spacing-2:var(--ds-size-2);--spacing-3:var(--ds-size-3);--spacing-4:var(--ds-size-4);--spacing-5:var(--ds-size-5);--spacing-6:var(--ds-size-6);--spacing-7:var(--ds-size-7);--spacing-8:var(--ds-size-8);--spacing-9:var(--ds-size-9);--spacing-10:var(--ds-size-10);--spacing-11:var(--ds-size-11);--spacing-12:var(--ds-size-12);--spacing-13:var(--ds-size-13);--spacing-14:var(--ds-size-14);--spacing-15:var(--ds-size-15);--spacing-18:var(--ds-size-18);--spacing-22:var(--ds-size-22);--spacing-26:var(--ds-size-26);--spacing-30:var(--ds-size-30)}[data-color]{--color-background-default:var(--ds-color-background-default);--color-background-tinted:var(--ds-color-background-tinted);--color-surface-default:var(--ds-color-surface-default);--color-surface-tinted:var(--ds-color-surface-tinted);--color-surface-hover:var(--ds-color-surface-hover);--color-surface-active:var(--ds-color-surface-active);--color-border-subtle:var(--ds-color-border-subtle);--color-border-default:var(--ds-color-border-default);--color-border-strong:var(--ds-color-border-strong);--color-text-subtle:var(--ds-color-text-subtle);--color-text-default:var(--ds-color-text-default);--color-base-default:var(--ds-color-base-default);--color-base-hover:var(--ds-color-base-hover);--color-base-active:var(--ds-color-base-active);--color-base-contrast-subtle:var(--ds-color-base-contrast-subtle);--color-base-contrast-default:var(--ds-color-base-contrast-default)}