@fremtind/jokul 5.0.0-next.1 → 5.0.0-next.3

package/styles/components.scss

@@ -1,52 +1,53 @@
-@use "components/autosuggest" as autosuggest;
-@use "components/breadcrumb" as breadcrumb;
-@use "components/button" as button;
-@use "components/card" as card;
-@use "components/checkbox" as checkbox;
-@use "components/checkbox-panel" as checkbox-panel;
-@use "components/chip" as chip;
-@use "components/combobox" as combobox;
-@use "components/cookie-consent" as cookie-consent;
-@use "components/countdown" as countdown;
-@use "components/datepicker" as datepicker;
-@use "components/description-list" as description-list;
-@use "components/expander" as expander;
-@use "components/feedback" as feedback;
-@use "components/file" as file;
-@use "components/file-input" as file-input;
-@use "components/icon" as icon;
-@use "components/icon-button" as icon-button;
-@use "components/image" as image;
-@use "components/input-group" as input-group;
-@use "components/link" as link;
-@use "components/link-list" as link-list;
-@use "components/list" as list;
-@use "components/loader" as loader;
-@use "components/logo" as logo;
-@use "components/menu" as menu;
-@use "components/message" as message;
-@use "components/modal" as modal;
-@use "components/nav-link" as nav-link;
-@use "components/beta/nav-link" as nav-link-beta;
-@use "components/pagination" as pagination;
-@use "components/popover" as popover;
-@use "components/progress-bar" as progress-bar;
-@use "components/radio-button" as radio-button;
-@use "components/radio-panel" as radio-panel;
-@use "components/select" as select;
-@use "components/beta/select" as select-beta;
-@use "components/search" as search;
-@use "components/segmented-control" as segmented-control;
-@use "components/summary-table" as summary-table;
-@use "components/system-message" as system-message;
-@use "components/table" as table;
-@use "components/table-of-contents" as table-of-contents;
-@use "components/tabs" as tabs;
-@use "components/tag" as tag;
-@use "components/text-area" as text-area;
-@use "components/text-input" as text-input;
-@use "components/toast" as toast;
-@use "components/toggle-switch" as toggle-switch;
-@use "components/tooltip" as tooltip;
-@use "components/help" as help;
-@use "components/flex" as flex;
+@use "./components/autosuggest" as autosuggest;
+@use "./components/breadcrumb" as breadcrumb;
+@use "./components/button" as button;
+@use "./components/card" as card;
+@use "./components/checkbox" as checkbox;
+@use "./components/checkbox-panel" as checkbox-panel;
+@use "./components/chip" as chip;
+@use "./components/combobox" as combobox;
+@use "./components/cookie-consent" as cookie-consent;
+@use "./components/countdown" as countdown;
+@use "./components/datepicker" as datepicker;
+@use "./components/description-list" as description-list;
+@use "./components/expander" as expander;
+@use "./components/feedback" as feedback;
+@use "./components/file" as file;
+@use "./components/file-input" as file-input;
+@use "./components/icon" as icon;
+@use "./components/icon-button" as icon-button;
+@use "./components/image" as image;
+@use "./components/input-group" as input-group;
+@use "./components/link" as link;
+@use "./components/link-list" as link-list;
+@use "./components/list" as list;
+@use "./components/loader" as loader;
+@use "./components/logo" as logo;
+@use "./components/menu" as menu;
+@use "./components/message" as message;
+@use "./components/modal" as modal;
+@use "./components/nav-link" as nav-link;
+@use "./components/beta/nav-link" as nav-link-beta;
+@use "./components/pagination" as pagination;
+@use "./components/popover" as popover;
+@use "./components/progress-bar" as progress-bar;
+@use "./components/radio-button" as radio-button;
+@use "./components/radio-panel" as radio-panel;
+@use "./components/select" as select;
+@use "./components/beta/select" as select-beta;
+@use "./components/search" as search;
+@use "./components/segmented-control" as segmented-control;
+@use "./components/summary-table" as summary-table;
+@use "./components/system-message" as system-message;
+@use "./components/table" as table;
+@use "./components/table-of-contents" as table-of-contents;
+@use "./components/tabs" as tabs;
+@use "./components/tag" as tag;
+@use "./components/text-area" as text-area;
+@use "./components/text-input" as text-input;
+@use "./components/toast" as toast;
+@use "./components/toggle-switch" as toggle-switch;
+@use "./components/tooltip" as tooltip;
+@use "./components/typography" as typography;
+@use "./components/help" as help;
+@use "./components/flex" as flex;

package/styles/core/jkl/_tokens.scss

@@ -0,0 +1,59 @@
+
+// Do not edit directly, this file was auto-generated.
+
+
+$unit-10: var(--jkl-unit-base);
+$unit-15: calc(var(--jkl-unit-base) * 1.5);
+$unit-20: calc(var(--jkl-unit-base) * 2);
+$unit-25: calc(var(--jkl-unit-base) * 2.5);
+$unit-30: calc(var(--jkl-unit-base) * 3);
+$unit-40: calc(var(--jkl-unit-base) * 4);
+$unit-50: calc(var(--jkl-unit-base) * 5);
+$unit-60: calc(var(--jkl-unit-base) * 6);
+$unit-70: calc(var(--jkl-unit-base) * 7);
+$unit-80: calc(var(--jkl-unit-base) * 8);
+$unit-90: calc(var(--jkl-unit-base) * 9);
+$unit-130: calc(var(--jkl-unit-base) * 13);
+$unit-210: calc(var(--jkl-unit-base) * 21);
+$unit-base: 0.5rem;
+$unit-02: calc(var(--jkl-unit-base) * .25);
+$unit-05: calc(var(--jkl-unit-base) * .5);
+$spacing-none: 0;
+$spacing-xxs: calc(var(--jkl-unit-base) * .5);
+$spacing-xs: var(--jkl-unit-base);
+$spacing-s: calc(var(--jkl-unit-base) * 2);
+$spacing-m: calc(var(--jkl-unit-base) * 3);
+$spacing-l: calc(var(--jkl-unit-base) * 5);
+$spacing-xl: calc(var(--jkl-unit-base) * 8);
+$spacing-2xl: calc(var(--jkl-unit-base) * 13);
+
+// Dynamiske variabler for farge, via referanse til CSS-variabler
+$color-background-page: var(--jkl-color-background-page);
+$color-background-surface-default: var(--jkl-color-background-surface-default);
+$color-background-surface-highlight: var(--jkl-color-background-surface-highlight);
+$color-background-surface-on-surface: var(--jkl-color-background-surface-on-surface);
+$color-background-surface-moderate: var(--jkl-color-background-surface-moderate);
+$color-background-surface-knockout: var(--jkl-color-background-surface-knockout);
+$color-background-surface-error: var(--jkl-color-background-surface-error);
+$color-background-surface-warning: var(--jkl-color-background-surface-warning);
+$color-background-surface-info: var(--jkl-color-background-surface-info);
+$color-background-surface-succes: var(--jkl-color-background-surface-succes);
+$color-border-subdued: var(--jkl-color-border-subdued);
+$color-border-strong: var(--jkl-color-border-strong);
+$color-border-strongest: var(--jkl-color-border-strongest);
+$color-border-knockout: var(--jkl-color-border-knockout);
+$color-border-info: var(--jkl-color-border-info);
+$color-border-success: var(--jkl-color-border-success);
+$color-border-error: var(--jkl-color-border-error);
+$color-border-warning: var(--jkl-color-border-warning);
+$color-text-default: var(--jkl-color-text-default);
+$color-text-subdued: var(--jkl-color-text-subdued);
+$color-text-knockout: var(--jkl-color-text-knockout);
+$color-text-info: var(--jkl-color-text-info);
+$color-text-info-strong: var(--jkl-color-text-info-strong);
+$color-text-success: var(--jkl-color-text-success);
+$color-text-success-strong: var(--jkl-color-text-success-strong);
+$color-text-error: var(--jkl-color-text-error);
+$color-text-error-strong: var(--jkl-color-text-error-strong);
+$color-text-warning: var(--jkl-color-text-warning);
+$color-text-warning-strong: var(--jkl-color-text-warning-strong);

package/styles/core/jkl/legacy/_dynamic-colors.scss

@@ -0,0 +1,40 @@
+
+// Do not edit directly, this file was auto-generated.
+
+
+
+
+// Dynamiske variabler for farge, via referanse til CSS-variabler
+$color-background-page: var(--jkl-color-background-page);
+$color-background-page-variant: var(--jkl-color-background-page-variant);
+$color-background-container: var(--jkl-color-background-container);
+$color-background-container-low: var(--jkl-color-background-container-low);
+$color-background-container-high: var(--jkl-color-background-container-high);
+$color-background-container-inverted: var(--jkl-color-background-container-inverted);
+$color-background-container-subdued: var(--jkl-color-background-container-subdued);
+$color-background-input-base: var(--jkl-color-background-input-base);
+$color-background-input-focus: var(--jkl-color-background-input-focus);
+$color-background-action: var(--jkl-color-background-action);
+$color-background-interactive: var(--jkl-color-background-interactive);
+$color-background-interactive-hover: var(--jkl-color-background-interactive-hover);
+$color-background-interactive-selected: var(--jkl-color-background-interactive-selected);
+$color-background-alert-neutral: var(--jkl-color-background-alert-neutral);
+$color-background-alert-info: var(--jkl-color-background-alert-info);
+$color-background-alert-success: var(--jkl-color-background-alert-success);
+$color-background-alert-warning: var(--jkl-color-background-alert-warning);
+$color-background-alert-error: var(--jkl-color-background-alert-error);
+$color-text-default: var(--jkl-color-text-default);
+$color-text-subdued: var(--jkl-color-text-subdued);
+$color-text-inverted: var(--jkl-color-text-inverted);
+$color-text-on-action: var(--jkl-color-text-on-action);
+$color-text-interactive: var(--jkl-color-text-interactive);
+$color-text-interactive-hover: var(--jkl-color-text-interactive-hover);
+$color-text-on-alert: var(--jkl-color-text-on-alert);
+$color-text-on-alert-subdued: var(--jkl-color-text-on-alert-subdued);
+$color-border-action: var(--jkl-color-border-action);
+$color-border-input: var(--jkl-color-border-input);
+$color-border-input-focus: var(--jkl-color-border-input-focus);
+$color-border-separator: var(--jkl-color-border-separator);
+$color-border-separator-strong: var(--jkl-color-border-separator-strong);
+$color-border-separator-hover: var(--jkl-color-border-separator-hover);
+$color-border-subdued: var(--jkl-color-border-subdued);