@fremtind/jokul 1.4.1 → 1.5.1

package/styles/core/_color-tokens.scss

@@ -1,78 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Wed, 18 Dec 2024 12:25:37 GMT
- */
-
-@use "jkl";
-
-@include jkl.light-mode-variables {
-    --jkl-color-background-page: #{jkl.$color-brand-sand};
-    --jkl-color-background-page-variant: #{jkl.$color-brand-snohvit};
-    --jkl-color-background-container: #{jkl.$color-brand-snohvit};
-    --jkl-color-background-container-low: #{jkl.$color-brand-dis};
-    --jkl-color-background-container-high: #{jkl.$color-brand-hvit};
-    --jkl-color-background-container-inverted: #{jkl.$color-brand-granitt};
-    --jkl-color-background-container-subdued: #{jkl.$color-brand-svaberg};
-    --jkl-color-background-input-base: rgb(0 0 0 / 0%);
-    --jkl-color-background-input-focus: #{jkl.$color-brand-hvit};
-    --jkl-color-background-action: #{jkl.$color-brand-granitt};
-    --jkl-color-background-interactive: rgb(0 0 0 / 0%);
-    --jkl-color-background-interactive-hover: #{jkl.$color-brand-dis};
-    --jkl-color-background-interactive-selected: #{jkl.$color-brand-varde};
-    --jkl-color-background-alert-neutral: #{jkl.$color-brand-varde};
-    --jkl-color-background-alert-info: #{jkl.$color-functional-info};
-    --jkl-color-background-alert-success: #{jkl.$color-functional-success};
-    --jkl-color-background-alert-warning: #{jkl.$color-functional-warning};
-    --jkl-color-background-alert-error: #{jkl.$color-functional-error};
-    --jkl-color-text-default: #{jkl.$color-brand-granitt};
-    --jkl-color-text-subdued: #{jkl.$color-brand-stein};
-    --jkl-color-text-inverted: #{jkl.$color-brand-snohvit};
-    --jkl-color-text-on-action: #{jkl.$color-brand-snohvit};
-    --jkl-color-text-interactive: #{jkl.$color-brand-granitt};
-    --jkl-color-text-interactive-hover: #{jkl.$color-brand-stein};
-    --jkl-color-text-on-alert: #{jkl.$color-brand-granitt};
-    --jkl-color-text-on-alert-subdued: #{jkl.$color-brand-fjellgra};
-    --jkl-color-border-action: #{jkl.$color-brand-granitt};
-    --jkl-color-border-input: #{jkl.$color-brand-stein};
-    --jkl-color-border-input-focus: #{jkl.$color-brand-granitt};
-    --jkl-color-border-separator: #{jkl.$color-brand-svaberg};
-    --jkl-color-border-separator-strong: #{jkl.$color-brand-stein};
-    --jkl-color-border-separator-hover: #{jkl.$color-brand-granitt};
-    --jkl-color-border-subdued: #{jkl.$color-brand-svaberg};
-}
-
-@include jkl.dark-mode-variables {
-    --jkl-color-background-page: #{jkl.$color-brand-granitt};
-    --jkl-color-background-page-variant: #{jkl.$color-brand-granitt};
-    --jkl-color-background-container: #{jkl.$color-brand-skifer};
-    --jkl-color-background-container-low: #{jkl.$color-brand-svart};
-    --jkl-color-background-container-high: #{jkl.$color-brand-skifer};
-    --jkl-color-background-container-inverted: #{jkl.$color-brand-snohvit};
-    --jkl-color-background-container-subdued: #{jkl.$color-brand-stein};
-    --jkl-color-background-input-base: rgb(0 0 0 / 0%);
-    --jkl-color-background-input-focus: #{jkl.$color-brand-skifer};
-    --jkl-color-background-action: #{jkl.$color-brand-snohvit};
-    --jkl-color-background-interactive: rgb(0 0 0 / 0%);
-    --jkl-color-background-interactive-hover: #{jkl.$color-brand-fjellgra};
-    --jkl-color-background-interactive-selected: #{jkl.$color-brand-stein};
-    --jkl-color-background-alert-neutral: #{jkl.$color-brand-varde};
-    --jkl-color-background-alert-info: #{jkl.$color-functional-info-dark};
-    --jkl-color-background-alert-success: #{jkl.$color-functional-success-dark};
-    --jkl-color-background-alert-warning: #{jkl.$color-functional-warning-dark};
-    --jkl-color-background-alert-error: #{jkl.$color-functional-error-dark};
-    --jkl-color-text-default: #{jkl.$color-brand-snohvit};
-    --jkl-color-text-subdued: #{jkl.$color-brand-svaberg};
-    --jkl-color-text-inverted: #{jkl.$color-brand-granitt};
-    --jkl-color-text-on-action: #{jkl.$color-brand-granitt};
-    --jkl-color-text-interactive: #{jkl.$color-brand-snohvit};
-    --jkl-color-text-interactive-hover: #{jkl.$color-brand-svaberg};
-    --jkl-color-text-on-alert: #{jkl.$color-brand-granitt};
-    --jkl-color-text-on-alert-subdued: #{jkl.$color-brand-fjellgra};
-    --jkl-color-border-action: #{jkl.$color-brand-snohvit};
-    --jkl-color-border-input: #{jkl.$color-brand-svaberg};
-    --jkl-color-border-input-focus: #{jkl.$color-brand-snohvit};
-    --jkl-color-border-separator: #{jkl.$color-brand-stein};
-    --jkl-color-border-separator-strong: #{jkl.$color-brand-svaberg};
-    --jkl-color-border-separator-hover: #{jkl.$color-brand-snohvit};
-    --jkl-color-border-subdued: #{jkl.$color-brand-stein};
-}

package/styles/core/_headings.scss

@@ -1,29 +0,0 @@
-@use "jkl";
-
-.jkl-title {
-    @include jkl.text-style("title");
-}
-
-.jkl-title-small {
-    @include jkl.text-style("title-small");
-}
-
-.jkl-heading-1 {
-    @include jkl.text-style("heading-1");
-}
-
-.jkl-heading-2 {
-    @include jkl.text-style("heading-2");
-}
-
-.jkl-heading-3 {
-    @include jkl.text-style("heading-3");
-}
-
-.jkl-heading-4 {
-    @include jkl.text-style("heading-4");
-}
-
-.jkl-heading-5 {
-    @include jkl.text-style("heading-5");
-}

package/styles/core/_index.scss

@@ -1,9 +0,0 @@
-@forward "normalize";
-@forward "reset";
-@forward "tokens";
-@forward "legacy-tokens";
-@forward "color-tokens";
-@forward "headings";
-@forward "paragraphs";
-@forward "spacing";
-@forward "screen-reader";

package/styles/core/_legacy-tokens.scss

@@ -1,38 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Wed, 18 Dec 2024 12:25:37 GMT
- */
-
-:root {
-    --jkl-color-svart: #000000;
-    --jkl-color-granitt: #1b1917;
-    --jkl-color-skifer: #313030;
-    --jkl-color-fjellgra: #444141;
-    --jkl-color-stein: #636060;
-    --jkl-color-svaberg: #c8c5c3;
-    --jkl-color-varde: #e0dbd4;
-    --jkl-color-dis: #ece9e5;
-    --jkl-color-sand: #f4f2ef;
-    --jkl-color-snohvit: #f9f9f9;
-    --jkl-color-hvit: #ffffff;
-    --jkl-color-suksess: #acd3b5;
-    --jkl-color-suksess-dark: #94b79b;
-    --jkl-color-feil: #f6b3b3;
-    --jkl-color-feil-dark: #de9e9e;
-    --jkl-color-info: #d3d3f6;
-    --jkl-color-info-dark: #a9a9ca;
-    --jkl-color-advarsel: #efdd9e;
-    --jkl-color-advarsel-dark: #decc8d;
-    --jkl-spacing-0: 0;
-    --jkl-spacing-2: 0.125rem;
-    --jkl-spacing-4: 0.25rem;
-    --jkl-spacing-8: 0.5rem;
-    --jkl-spacing-12: 0.75rem;
-    --jkl-spacing-16: 1rem;
-    --jkl-spacing-24: 1.5rem;
-    --jkl-spacing-32: 2rem;
-    --jkl-spacing-40: 2.5rem;
-    --jkl-spacing-64: 4rem;
-    --jkl-spacing-104: 6.5rem;
-    --jkl-spacing-168: 10.5rem;
-}

package/styles/core/_normalize.scss

@@ -1,250 +0,0 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
-
-/* Document
-   ========================================================================== */
-
-/**
- * 1. Correct the line height in all browsers.
- * 2. Prevent adjustments of font size after orientation changes in iOS.
- */
-
-html {
-    line-height: 1.15; /* 1 */
-    -webkit-text-size-adjust: 100%; /* 2 */
-}
-
-/* Sections
-   ========================================================================== */
-
-/**
- * Remove the margin in all browsers.
- */
-
-body {
-    margin: 0;
-}
-
-/**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
- */
-
-h1 {
-    font-size: 2em;
-    margin: 0.67em 0;
-}
-
-/* Grouping content
-   ========================================================================== */
-
-/**
- * 1. Add the correct box sizing in Firefox.
- * 2. Show the overflow in Edge and IE.
- */
-
-hr {
-    box-sizing: content-box; /* 1 */
-    height: 0; /* 1 */
-    overflow: visible; /* 2 */
-}
-
-/**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
- */
-
-pre {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
-}
-
-/* Text-level semantics
-   ========================================================================== */
-
-/**
- * 1. Remove the bottom border in Chrome 57-
- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
- */
-
-abbr[title] {
-    border-bottom: none; /* 1 */
-    text-decoration: underline; /* 2 */
-    text-decoration: underline dotted; /* 2 */
-}
-
-/**
- * Add the correct font weight in Chrome, Edge, and Safari.
- */
-
-b,
-strong {
-    font-weight: bolder;
-}
-
-/**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
- */
-
-code,
-kbd,
-samp {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
-}
-
-/**
- * Add the correct font size in all browsers.
- */
-
-small {
-    font-size: 80%;
-}
-
-/**
- * Prevent `sub` and `sup` elements from affecting the line height in
- * all browsers.
- */
-
-sub,
-sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-}
-
-sub {
-    bottom: -0.25em;
-}
-
-sup {
-    top: -0.5em;
-}
-
-/* Forms
-   ========================================================================== */
-
-/**
- * 1. Change the font styles in all browsers.
- * 2. Remove the margin in Firefox and Safari.
- */
-
-button,
-input,
-optgroup,
-select,
-textarea {
-    font-family: inherit; /* 1 */
-    font-size: 100%; /* 1 */
-    line-height: 1.15; /* 1 */
-    margin: 0; /* 2 */
-}
-
-/**
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 1. Remove the inheritance of text transform in Firefox.
- */
-
-button,
-select {
-    /* 1 */
-    text-transform: none;
-}
-
-/**
- * Correct the inability to style clickable types in iOS and Safari.
- */
-
-button,
-[type="button"],
-[type="reset"],
-[type="submit"] {
-    -webkit-appearance: button;
-}
-
-/**
- * Correct the padding in Firefox.
- */
-
-fieldset {
-    padding: 0.35em 0.75em 0.625em;
-}
-
-/**
- * 1. Correct the text wrapping in Edge and IE.
- * 2. Remove the padding so developers are not caught out when they zero out
- *    `fieldset` elements in all browsers.
- */
-
-legend {
-    box-sizing: border-box; /* 1 */
-    display: table; /* 1 */
-    max-width: 100%; /* 1 */
-    padding: 0; /* 2 */
-    white-space: normal; /* 1 */
-}
-
-/**
- * Add the correct vertical alignment in Chrome, Firefox, and Opera.
- */
-
-progress {
-    vertical-align: baseline;
-}
-
-/**
- * Correct the cursor style of increment and decrement buttons in Chrome.
- */
-
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
-    height: auto;
-}
-
-/**
- * 1. Correct the odd appearance in Chrome and Safari.
- * 2. Correct the outline style in Safari.
- */
-
-[type="search"] {
-    -webkit-appearance: textfield; /* 1 */
-    outline-offset: -2px; /* 2 */
-}
-
-/**
- * Remove the inner padding in Chrome and Safari on macOS.
- */
-
-[type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
-}
-
-/**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
- */
-
-::-webkit-file-upload-button {
-    -webkit-appearance: button; /* 1 */
-    font: inherit; /* 2 */
-}
-
-/* Interactive
-   ========================================================================== */
-
-/*
- * Add the correct display in Edge, IE 10+, and Firefox.
- */
-
-details {
-    display: block;
-}
-
-/*
- * Add the correct display in all browsers.
- */
-
-summary {
-    display: list-item;
-}

package/styles/core/_paragraphs.scss

@@ -1,16 +0,0 @@
-@use "jkl";
-
-.jkl-body {
-    @include jkl.text-style("body");
-}
-
-.jkl-bold {
-    @include jkl.text-style("body") {
-        --jkl-icon-weight: #{jkl.$icon-weight-bold};
-        font-weight: jkl.$typography-weight-bold;
-    }
-}
-
-.jkl-small {
-    @include jkl.text-style("small");
-}

package/styles/core/_reset.scss

@@ -1,66 +0,0 @@
-/* Text blocks
-   ========================================================================== */
-
-/**
- * Remove default margins from all block-level text elements
- * such as `p` and headings
- */
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p {
-    margin: 0;
-}
-
-/* Forms
-   ========================================================================== */
-
-/**
- * Remove margins from fieldset element.
- */
-
-fieldset {
-    margin: 0;
-    border: 0;
-    padding: 0;
-    display: block;
-    line-height: 1;
-}
-
-/* Forms
-   ========================================================================== */
-
-/**
- * Remove borders from table elements.
- */
-
-table {
-    border-collapse: collapse;
-}
-
-/**
- * Remove margins from table elements.
- */
-
-table,
-thead,
-tbody,
-tr,
-td,
-th {
-    margin: 0;
-    padding: 0;
-}
-
-/*
- * https://css-tricks.com/the-hidden-attribute-is-visibly-weak/
- * tl;dr – hidden er en User Agent style, så hvis et element har noen som helst display som ikke er
- * hidden vil ikke hidden-attributtet gjøre noe som helst visuelt. Her gjør vi det til vår egen author style.
- */
-.jkl [hidden] {
-    display: none;
-}

package/styles/core/_screen-reader.scss

@@ -1,9 +0,0 @@
-@use "jkl";
-
-.jkl-sr-only {
-    @include jkl.screenreader-only;
-
-    &--focusable {
-        @include jkl.screenreader-only-focusable;
-    }
-}

package/styles/core/_spacing.scss

@@ -1,86 +0,0 @@
-@use "sass:list";
-@use "sass:map";
-@use "sass:string";
-@use "jkl/spacing";
-@use "jkl/screens";
-
-@function get-class-name($spacing-combination) {
-    $class-name: "jkl-spacing";
-
-    @each $spacing in $spacing-combination {
-        $class-name: "#{$class-name}-#{$spacing}";
-    }
-
-    @return $class-name;
-}
-
-// Sett CSS-variabler for alle spacing-kombinasjoner
-:root {
-    @each $spacing-combination in spacing.$combinations {
-        $_step: list.nth($spacing-combination, 1);
-
-        --#{get-class-name($spacing-combination)}: #{map.get(
-                spacing.$spacing,
-                $_step
-            )};
-    }
-
-    @include screens.from-medium-device {
-        @each $spacing-combination in spacing.$combinations {
-            @if list.length($spacing-combination) > 1 {
-                $_step: list.nth($spacing-combination, 2);
-
-                --#{get-class-name($spacing-combination)}: #{map.get(
-                        spacing.$spacing,
-                        $_step
-                    )};
-            }
-        }
-    }
-
-    @include screens.from-large-device {
-        @each $spacing-combination in spacing.$combinations {
-            @if list.length($spacing-combination) > 2 {
-                $_step: list.nth($spacing-combination, 3);
-
-                --#{get-class-name($spacing-combination)}: #{map.get(
-                        spacing.$spacing,
-                        $_step
-                    )};
-            }
-        }
-    }
-}
-
-// Lag nytteklasser for alle spacing-kombinasjoner og -posisjoner
-@each $spacing-combination in spacing.$combinations {
-    $_class-name: get-class-name($spacing-combination);
-    .#{$_class-name} {
-        &--all {
-            margin: var(--#{$_class-name});
-        }
-
-        @each $position in spacing.$positions {
-            &--#{$position} {
-                margin-#{$position}: var(--#{$_class-name});
-            }
-        }
-    }
-}
-
-// Lag nytteklasser for de gamle spacingene for å sikre bakoverkompatibilitet
-@each $spacing, $value in spacing.$spacing {
-    @if not list.index(spacing.$combinations, $spacing) {
-        .jkl-spacing-#{$spacing} {
-            &--all {
-                margin: $value;
-            }
-
-            @each $position in spacing.$positions {
-                &--#{$position} {
-                    margin-#{$position}: $value;
-                }
-            }
-        }
-    }
-}