@skf-design-system/ui-components 1.0.2-beta.6 → 1.0.2-beta.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +18 -0
- package/dist/components/alert/alert.component.d.ts +3 -2
- package/dist/components/alert/alert.component.js +39 -33
- package/dist/components/button/button.styles.js +3 -3
- package/dist/components/checkbox/checkbox.component.d.ts +6 -5
- package/dist/components/checkbox/checkbox.component.js +77 -76
- package/dist/components/checkbox/checkbox.styles.js +1 -1
- package/dist/components/datepicker/datepicker-calendar.component.d.ts +4 -0
- package/dist/components/datepicker/datepicker-calendar.component.js +134 -127
- package/dist/components/datepicker/datepicker-popup.component.d.ts +4 -0
- package/dist/components/datepicker/datepicker-popup.component.js +100 -88
- package/dist/components/datepicker/datepicker.component.d.ts +4 -2
- package/dist/components/datepicker/datepicker.component.js +150 -140
- package/dist/components/dialog/dialog.component.d.ts +3 -2
- package/dist/components/dialog/dialog.component.js +39 -37
- package/dist/components/divider/divider.component.js +13 -13
- package/dist/components/divider/divider.styles.js +2 -2
- package/dist/components/drawer/drawer.component.d.ts +3 -2
- package/dist/components/drawer/drawer.component.js +37 -35
- package/dist/components/drawer/drawer.styles.js +1 -1
- package/dist/components/header/header.component.d.ts +4 -2
- package/dist/components/header/header.component.js +66 -57
- package/dist/components/header/header.styles.js +2 -2
- package/dist/components/icon/icon.component.js +26 -16
- package/dist/components/icon/icon.styles.js +4 -4
- package/dist/components/input/input.component.d.ts +4 -8
- package/dist/components/input/input.component.js +146 -147
- package/dist/components/input/input.controllers.d.ts +0 -1
- package/dist/components/input/input.controllers.js +12 -12
- package/dist/components/link/link.component.js +19 -12
- package/dist/components/link/link.styles.js +11 -3
- package/dist/components/loader/loader.component.d.ts +0 -2
- package/dist/components/loader/loader.component.js +27 -30
- package/dist/components/loader/loader.styles.js +1 -1
- package/dist/components/menu/menu-item.styles.js +8 -7
- package/dist/components/menu/menu.component.d.ts +4 -1
- package/dist/components/nav/nav.component.d.ts +3 -0
- package/dist/components/nav/nav.component.js +38 -33
- package/dist/components/popover/popover.component.d.ts +6 -3
- package/dist/components/progress/progress.styles.js +3 -3
- package/dist/components/radio/radio.component.d.ts +4 -2
- package/dist/components/radio/radio.component.js +91 -83
- package/dist/components/radio/radio.styles.js +1 -1
- package/dist/components/segmented-button/segmented-button-item.component.js +1 -1
- package/dist/components/segmented-button/segmented-button-item.styles.js +1 -1
- package/dist/components/select/select-option.component.d.ts +2 -2
- package/dist/components/select/select-option.component.js +16 -19
- package/dist/components/select/select.component.d.ts +13 -9
- package/dist/components/select/select.component.js +169 -144
- package/dist/components/stepper/stepper-item.styles.js +4 -4
- package/dist/components/switch/switch.component.d.ts +4 -2
- package/dist/components/switch/switch.component.js +64 -56
- package/dist/components/switch/switch.styles.js +1 -1
- package/dist/components/tabs/tab.styles.js +2 -2
- package/dist/components/tag/tag.component.d.ts +3 -0
- package/dist/components/tag/tag.component.js +50 -41
- package/dist/components/textarea/textarea.component.d.ts +4 -2
- package/dist/components/textarea/textarea.component.js +126 -118
- package/dist/components/tooltip/tooltip.component.d.ts +8 -2
- package/dist/components/tooltip/tooltip.component.js +3 -0
- package/dist/custom-elements.json +734 -372
- package/dist/internal/base-classes/popover/popover.base.d.ts +21 -2
- package/dist/internal/base-classes/popover/popover.base.js +10 -12
- package/dist/internal/components/formBase.d.ts +1 -0
- package/dist/internal/components/formBase.js +11 -19
- package/dist/internal/controllers/popover.controller.d.ts +2 -0
- package/dist/internal/helpers/uuid.d.ts +8 -10
- package/dist/internal/helpers/uuid.js +4 -11
- package/dist/internal/helpers/watch.d.ts +1 -1
- package/dist/internal/templates/asterisk.d.ts +1 -1
- package/dist/internal/templates/asterisk.js +4 -4
- package/dist/styles/global-alt.css +1 -1
- package/dist/styles/global.css +1 -1
- package/dist/translations/en.d.ts +3 -0
- package/dist/translations/en.js +27 -0
- package/dist/translations/es.d.ts +3 -0
- package/dist/translations/es.js +27 -0
- package/dist/translations/index.d.ts +4 -0
- package/dist/translations/pt.d.ts +3 -0
- package/dist/translations/pt.js +27 -0
- package/dist/translations/sv.d.ts +3 -0
- package/dist/translations/sv.js +27 -0
- package/dist/types/jsx/custom-element-jsx.d.ts +1823 -846
- package/dist/types/vue/index.d.ts +59 -47
- package/dist/utilities/localize.d.ts +28 -0
- package/dist/utilities/localize.js +13 -0
- package/dist/vscode.html-custom-data.json +75 -80
- package/dist/web-types.json +205 -169
- package/package.json +27 -34
- package/custom-elements.json +0 -25490
@@ -2,19 +2,38 @@ import { type Placement } from '@floating-ui/dom';
|
|
2
2
|
import { SkfElement } from '../../components/skf-element.js';
|
3
3
|
import { PopoverController } from '../../controllers/popover.controller.js';
|
4
4
|
import { type CSSResultGroup } from 'lit';
|
5
|
+
/**
|
6
|
+
* @description - Base class for popover components.
|
7
|
+
* This class provides common functionality for popovers, such as handling open/close states, positioning, and event management.
|
8
|
+
* It should be extended by specific popover components like `SkfPopover`, `SkfTooltip`, etc.
|
9
|
+
*
|
10
|
+
* @event {CustomEvent} skf-opened - Fired when the popover is opened
|
11
|
+
* @event {CustomEvent} skf-closed - Fired when the popover is closed
|
12
|
+
*
|
13
|
+
* @slot - The popover content
|
14
|
+
*/
|
5
15
|
export declare class SkfPopoverBase extends SkfElement {
|
6
16
|
static styles: CSSResultGroup;
|
7
17
|
static classMap: {};
|
18
|
+
/** @internal - The popover element, aka `this` */
|
8
19
|
$popover: this;
|
20
|
+
/** Where the popover is positioned relative to the anchor element if it fits */
|
9
21
|
placement: Placement;
|
22
|
+
/** The variant of the popover extending this base class */
|
10
23
|
variant: 'menu' | 'popup' | 'tooltip';
|
24
|
+
/** The id of the element the popover will be anchored to */
|
11
25
|
anchor?: string;
|
26
|
+
/** Whether the popover is currently open */
|
12
27
|
isOpen: boolean;
|
28
|
+
/** @internal - Gap between popover and anchor */
|
13
29
|
offset: number;
|
30
|
+
/** @internal - Element that triggered the popover */
|
14
31
|
$anchor?: Element | HTMLElement | null;
|
32
|
+
/** If true, displays an arrow on the popover */
|
15
33
|
arrow: boolean;
|
16
|
-
/** @internal */
|
34
|
+
/** @internal - the event that triggers the popover */
|
17
35
|
triggerEvent: 'mouseenter' | 'click';
|
36
|
+
/** @internal - Reference to the arrow element */
|
18
37
|
$arrow: HTMLElement;
|
19
38
|
protected abortEventsController: AbortController;
|
20
39
|
protected signal: AbortSignal;
|
@@ -24,7 +43,7 @@ export declare class SkfPopoverBase extends SkfElement {
|
|
24
43
|
protected _toggleOpen: (newValue?: boolean) => void;
|
25
44
|
private _handleToggle;
|
26
45
|
handleToggleOpen: () => Promise<void>;
|
27
|
-
handleAnchorEl(): void
|
46
|
+
handleAnchorEl(): Promise<void>;
|
28
47
|
handleAnchorChange: () => Promise<void>;
|
29
48
|
reposition: () => Promise<void>;
|
30
49
|
handleEscapeKey: (e: KeyboardEvent) => void;
|
@@ -41,17 +41,17 @@ const s = (p = class extends S {
|
|
41
41
|
left: `${String(o)}px`,
|
42
42
|
top: `${String(i)}px`
|
43
43
|
}), this.arrow) {
|
44
|
-
const d = this.placement.split("-")[0], l = { top: "bottom", right: "left", bottom: "top", left: "right" }[d] ?? "", g = (n = e.flip) == null ? void 0 : n.index, v = (a = e.arrow) == null ? void 0 : a.x, b = (h = e.arrow) == null ? void 0 : h.y,
|
44
|
+
const d = this.placement.split("-")[0], l = { top: "bottom", right: "left", bottom: "top", left: "right" }[d] ?? "", g = (n = e.flip) == null ? void 0 : n.index, v = (a = e.arrow) == null ? void 0 : a.x, b = (h = e.arrow) == null ? void 0 : h.y, w = typeof v == "number" ? `${String(v)}px` : "", E = typeof b == "number" ? `${String(b)}px` : "", $ = {
|
45
45
|
bottom: 45,
|
46
46
|
right: 135,
|
47
47
|
top: 225,
|
48
48
|
left: 315
|
49
49
|
};
|
50
50
|
Object.assign(this.$arrow.style, {
|
51
|
-
top:
|
52
|
-
[this.placement.includes("left") ? "right" : "left"]:
|
51
|
+
top: E,
|
52
|
+
[this.placement.includes("left") ? "right" : "left"]: w,
|
53
53
|
[g ? d : l]: "calc(var(--_skf-popover-arrow-size) * -1)",
|
54
|
-
rotate: `${(
|
54
|
+
rotate: `${($[l] + (g ? 180 : 0)).toString()}deg`
|
55
55
|
});
|
56
56
|
}
|
57
57
|
}, this.handleEscapeKey = (t) => {
|
@@ -63,12 +63,14 @@ const s = (p = class extends S {
|
|
63
63
|
};
|
64
64
|
}
|
65
65
|
connectedCallback() {
|
66
|
-
super.connectedCallback(), this.setAttribute("popover", "")
|
66
|
+
super.connectedCallback(), this.setAttribute("popover", ""), this.addEventListener("toggle", (t) => {
|
67
|
+
this._handleToggle(t);
|
68
|
+
});
|
67
69
|
}
|
68
70
|
disconnectedCallback() {
|
69
71
|
super.disconnectedCallback(), this.abortEventsController.abort();
|
70
72
|
}
|
71
|
-
handleAnchorEl() {
|
73
|
+
async handleAnchorEl() {
|
72
74
|
if (!this.$anchor) return;
|
73
75
|
const t = this._containsFocusableElement(this);
|
74
76
|
this.$anchor.addEventListener(
|
@@ -85,7 +87,7 @@ const s = (p = class extends S {
|
|
85
87
|
t && i || this.close();
|
86
88
|
},
|
87
89
|
{ signal: this.signal }
|
88
|
-
), this.$popover.id = _(this.$anchor.id), ["popup", "menu"].includes(this.variant) && (this.$anchor.setAttribute("aria-haspopup", "true"), this.setAttribute("aria-labelledby", this.$anchor.id)), ["menu"].includes(this.variant) && this.$anchor.setAttribute("aria-controls", this.$popover.id), ["popup"].includes(this.variant) && t && (this.role = "dialog"), ["tooltip"].includes(this.variant) && this.$anchor.addEventListener("focusin", this.open, { signal: this.signal });
|
90
|
+
), this.$popover.id = await _(this.$anchor.id), ["popup", "menu"].includes(this.variant) && (this.$anchor.setAttribute("aria-haspopup", "true"), this.setAttribute("aria-labelledby", this.$anchor.id)), ["menu"].includes(this.variant) && this.$anchor.setAttribute("aria-controls", this.$popover.id), ["popup"].includes(this.variant) && t && (this.role = "dialog"), ["tooltip"].includes(this.variant) && this.$anchor.addEventListener("focusin", this.open, { signal: this.signal });
|
89
91
|
}
|
90
92
|
/** @internal add additional open tasks here in UI component */
|
91
93
|
openExtended() {
|
@@ -104,11 +106,7 @@ const s = (p = class extends S {
|
|
104
106
|
render() {
|
105
107
|
var t;
|
106
108
|
return ["popup", "menu"].includes(this.variant) && ((t = this.$anchor) == null || t.setAttribute("aria-expanded", this.isOpen ? "true" : "false")), y`
|
107
|
-
<div
|
108
|
-
@toggle=${this._handleToggle}
|
109
|
-
class=${T({ popover: !0, ...p.classMap })}
|
110
|
-
id="root"
|
111
|
-
>
|
109
|
+
<div class=${T({ popover: !0, ...p.classMap })} id="root">
|
112
110
|
<slot></slot>
|
113
111
|
${this.arrow ? y`<div id="arrow"></div>` : F}
|
114
112
|
</div>
|
@@ -37,6 +37,7 @@ export declare class FormBase extends SkfElement {
|
|
37
37
|
/** If true, sets disabled state */
|
38
38
|
set disabled(isDisabled: boolean);
|
39
39
|
get disabled(): boolean;
|
40
|
+
/** If true, sets disabled state */
|
40
41
|
set required(isRequired: boolean);
|
41
42
|
get required(): boolean;
|
42
43
|
set nativeValidation(nativeValidation: boolean);
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { LitElement as c } from "lit";
|
2
|
-
import { property as
|
2
|
+
import { property as l } from "lit/decorators.js";
|
3
3
|
import { SkfElement as u } from "./skf-element.js";
|
4
|
-
var p = Object.defineProperty, _ = Object.getOwnPropertyDescriptor,
|
5
|
-
for (var i = _(t, e), n =
|
6
|
-
(
|
4
|
+
var p = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, o = (d, t, e, r) => {
|
5
|
+
for (var i = _(t, e), n = d.length - 1, h; n >= 0; n--)
|
6
|
+
(h = d[n]) && (i = h(t, e, i) || i);
|
7
7
|
return i && p(t, e, i), i;
|
8
8
|
};
|
9
9
|
const a = class a extends u {
|
@@ -18,17 +18,6 @@ const a = class a extends u {
|
|
18
18
|
disconnectedCallback() {
|
19
19
|
super.disconnectedCallback(), this._internals.form && this._internals.form.removeEventListener("reset", this._dispatchResetEvent);
|
20
20
|
}
|
21
|
-
// @property()
|
22
|
-
// set autocomplete(value: string) {
|
23
|
-
// if (value) {
|
24
|
-
// this.autocomplete = value;
|
25
|
-
// this._internals.ariaAutoComplete = value;
|
26
|
-
// }
|
27
|
-
// }
|
28
|
-
// get autocomplete() {
|
29
|
-
// return this.autocomplete;
|
30
|
-
// }
|
31
|
-
/** If true, sets disabled state */
|
32
21
|
set disabled(t) {
|
33
22
|
this._disabled = t, this._internals.ariaDisabled = String(t);
|
34
23
|
}
|
@@ -96,11 +85,14 @@ const a = class a extends u {
|
|
96
85
|
};
|
97
86
|
a.formAssociated = !0, a.shadowRootOptions = { ...c.shadowRootOptions, delegatesFocus: !0 };
|
98
87
|
let s = a;
|
99
|
-
|
100
|
-
|
88
|
+
o([
|
89
|
+
l({ type: Boolean })
|
90
|
+
], s.prototype, "disabled");
|
91
|
+
o([
|
92
|
+
l({ type: Boolean })
|
101
93
|
], s.prototype, "required");
|
102
|
-
|
103
|
-
|
94
|
+
o([
|
95
|
+
l({ type: Boolean, attribute: "native-validation" })
|
104
96
|
], s.prototype, "nativeValidation");
|
105
97
|
export {
|
106
98
|
s as FormBase
|
@@ -7,9 +7,11 @@ interface ControllerHostProps {
|
|
7
7
|
$anchor?: Element | HTMLElement | null;
|
8
8
|
$popover?: Element | HTMLElement | null;
|
9
9
|
reposition: () => Promise<void>;
|
10
|
+
_toggleOpen: (open: boolean) => void;
|
10
11
|
}
|
11
12
|
export declare class PopoverController implements ReactiveController {
|
12
13
|
host?: ReactiveControllerHost & Partial<ControllerHostProps>;
|
14
|
+
intersectionObserver: IntersectionObserver | undefined;
|
13
15
|
private cleanup;
|
14
16
|
private active;
|
15
17
|
private autoStart;
|
@@ -1,15 +1,13 @@
|
|
1
1
|
/**
|
2
|
-
* Generate a unique id based on a string
|
2
|
+
* Generate a unique id based on a string using the Crypto API
|
3
3
|
*
|
4
4
|
* @param str - string to base hash on
|
5
|
-
* @returns string - a unique prefixed id
|
6
|
-
*/
|
7
|
-
export declare function uuid(str: string): string;
|
8
|
-
/**
|
9
|
-
* @describe - cyrb53 - A simple hash function for strings
|
5
|
+
* @returns Promise<string> - a unique prefixed id
|
10
6
|
*
|
11
|
-
* @
|
12
|
-
*
|
13
|
-
*
|
7
|
+
* @usage
|
8
|
+
* ```typescript
|
9
|
+
* const uniqueId = await uuid('my-element-id');
|
10
|
+
* console.log(uniqueId); // skf-uuid-123456789abc
|
11
|
+
* ```
|
14
12
|
*/
|
15
|
-
export declare
|
13
|
+
export declare function uuid(str: string): Promise<string>;
|
@@ -1,14 +1,7 @@
|
|
1
|
-
function r
|
2
|
-
const
|
3
|
-
return `skf-uuid-${
|
1
|
+
async function c(r) {
|
2
|
+
const t = new TextEncoder().encode(r), e = await crypto.subtle.digest("SHA-256", t);
|
3
|
+
return `skf-uuid-${Array.from(new Uint8Array(e)).map((n) => n.toString(16).padStart(2, "0")).join("").slice(0, 12)}`;
|
4
4
|
}
|
5
|
-
const n = (u, i = 0) => {
|
6
|
-
let t = 3735928559 ^ i, h = 1103547991 ^ i;
|
7
|
-
for (let l = 0, a; l < u.length; l++)
|
8
|
-
a = u.charCodeAt(l), t = Math.imul(t ^ a, 2654435761), h = Math.imul(h ^ a, 1597334677);
|
9
|
-
return t = Math.imul(t ^ t >>> 16, 2246822507), t ^= Math.imul(h ^ h >>> 13, 3266489909), h = Math.imul(h ^ h >>> 16, 2246822507), h ^= Math.imul(t ^ t >>> 13, 3266489909), 4294967296 * (2097151 & h) + (t >>> 0);
|
10
|
-
};
|
11
5
|
export {
|
12
|
-
|
13
|
-
r as uuid
|
6
|
+
c as uuid
|
14
7
|
};
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import type { LitElement } from 'lit';
|
2
|
-
type UpdateHandler = (property: string, prev?: unknown, next?: unknown) => void
|
2
|
+
type UpdateHandler = (property: string, prev?: unknown, next?: unknown) => void | Promise<void>;
|
3
3
|
type NonUndefined<A> = A extends undefined ? never : A;
|
4
4
|
type UpdateHandlerFunctionKeys<T extends object> = {
|
5
5
|
[K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;
|
@@ -1 +1 @@
|
|
1
|
-
export declare function Asterisk(label
|
1
|
+
export declare function Asterisk(label: string, className?: string): import("lit").TemplateResult<1>;
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { html as r } from "lit";
|
2
|
-
import { ifDefined as
|
3
|
-
function t(
|
2
|
+
import { ifDefined as a } from "lit/directives/if-defined.js";
|
3
|
+
function t(s, i) {
|
4
4
|
return r`
|
5
|
-
<span class="visually-hidden">(${
|
6
|
-
<span aria-hidden="true" class=${
|
5
|
+
<span class="visually-hidden">(${s})</span>
|
6
|
+
<span aria-hidden="true" class=${a(i)} id="asterisk">*</span>
|
7
7
|
`;
|
8
8
|
}
|
9
9
|
export {
|
@@ -1 +1 @@
|
|
1
|
-
@charset "UTF-8";:host,:where(:root){--skf-color-green-lightest: #e5f3ecff;--skf-color-green-base: #048942ff;--skf-color-green-dark: #097c42ff;--skf-color-green-darker: #106b41ff;--skf-color-blue-lighest: #e7eefbff;--skf-color-blue-base: #4f84e0ff;--skf-color-blue-dark: #4978c8ff;--skf-color-blue-darker: #4167a8ff;--skf-color-yellow-lightest: #fff9e7ff;--skf-color-yellow-base: #ffca15ff;--skf-color-yellow-darker: #dfb31bff;--skf-color-yellow-darkest: #b49524ff;--skf-color-orange-lightest: #fff2e5ff;--skf-color-orange-base: #ff8004ff;--skf-color-orange-darker: #df740dff;--skf-color-orange-darkest: #b46518ff;--skf-color-red-lightest: #f9e5e5ff;--skf-color-red-base: #cc0000ff;--skf-color-red-darker: #b3080aff;--skf-color-red-darkest: #921217ff;--skf-color-neutral-lightest: #f6f6f6ff;--skf-color-neutral-lighter: #ebeceeff;--skf-color-neutral-light: #d5d8dcff;--skf-color-neutral-base: #c7cad0ff;--skf-color-neutral-dark: #aaafb8ff;--skf-color-neutral-darker: #808895ff;--skf-color-neutral-darkest: #676f7cff;--skf-color-neutral-black: #273342ff;--skf-color-neutral-white: #ffffffff;--skf-color-brand-base: #0f58d6ff;--skf-color-brand-lightest: #d9e4f8ff;--skf-color-brand-lighter: #c5d7f5ff;--skf-color-brand-dark: #084abdff;--skf-color-neutral-transparent: #ffffff00;--skf-color-neutral-opacity: #12111199;--skf-color-brand-darker: #0b3e96ff}:host,:where(:root){--skf-size-1: .0625rem;--skf-size-2: .125rem;--skf-size-4: .25rem;--skf-size-8: .5rem;--skf-size-12: .75rem;--skf-size-16: 1rem;--skf-size-20: 1.25rem;--skf-size-24: 1.5rem;--skf-size-32: 2rem;--skf-size-44: 2.75rem;--skf-size-48: 3rem;--skf-size-56: 3.5rem}:host,:where(:root){--skf-type-scale-10: .625rem;--skf-type-scale-12: .75rem;--skf-type-scale-14: .875rem;--skf-type-scale-16: 1rem;--skf-type-scale-18: 1.125rem;--skf-type-scale-20: 1.25rem;--skf-type-scale-22: 1.375rem;--skf-type-scale-24: 1.5rem;--skf-type-scale-28: 1.75rem;--skf-type-scale-32: 2rem;--skf-type-scale-36: 2.25rem;--skf-type-scale-40: 2.5rem;--skf-type-scale-46: 2.875rem;--skf-type-scale-50: 3.125rem;--skf-type-scale-56: 3.5rem;--skf-type-scale-64: 4rem;--skf-type-scale-72: 4.5rem;--skf-type-scale-90: 5.625rem;--skf-type-scale-124: 7.75rem}:host,:where(:root){--skf-bg-color-neutral-1: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-light) );--skf-bg-color-neutral-2: var(--skf-color-neutral-lighter);--skf-bg-color-neutral-3: var(--skf-color-neutral-light);--skf-bg-color-neutral-4: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-bg-color-neutral-5: var(--skf-color-neutral-dark);--skf-bg-color-neutral-6: var(--skf-color-neutral-darker);--skf-bg-color-neutral-7: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-white) );--skf-bg-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-text-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-lightest) );--skf-text-color-secondary: var(--skf-color-neutral-darkest);--skf-text-color-tertiary: var(--skf-color-neutral-dark);--skf-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-text-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-icon-size-xs: var(--skf-size-16);--skf-icon-size-sm: var(--skf-size-20);--skf-icon-size-md: var(--skf-size-24);--skf-icon-size-lg: var(--skf-size-32)}:host,:where(:root){--skf-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-icon-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-icon-color-secondary: var(--skf-color-neutral-darkest)}:host,:where(:root){--skf-border-color-emphasised: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-border-color-primary: var(--skf-color-neutral-dark);--skf-border-color-secondary: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-border-color-tertiary: var(--skf-color-neutral-light);--skf-border-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) )}:host,:where(:root){--skf-border-width-md: var(--skf-size-2);--skf-border-width-lg: var(--skf-size-4);--skf-border-width-sm: var(--skf-size-1)}:host,:where(:root){--skf-border-radius-md: var(--skf-size-8);--skf-border-radius-lg: var(--skf-size-16);--skf-border-radius-sm: var(--skf-size-2)}:host,:where(:root){--skf-interactive-bg-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-lightest) );--skf-interactive-bg-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-bg-color-primary-active: var(--skf-color-brand-darker);--skf-interactive-bg-color-secondary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-bg-color-secondary-hover: var(--skf-color-brand-lightest);--skf-interactive-bg-color-secondary-active: var(--skf-color-brand-lighter);--skf-interactive-bg-color-tertiary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-lightest) );--skf-interactive-bg-color-destructive: light-dark( var(--skf-color-red-base), var(--skf-color-red-base) );--skf-interactive-bg-color-destructive-hover: var(--skf-color-red-darker);--skf-interactive-bg-color-destructive-active: var(--skf-color-red-darkest);--skf-interactive-bg-color-disabled: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-hover: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-active: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-lightest) );--skf-interactive-text-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-text-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-text-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-text-color-primary-active: var(--skf-color-brand-dark);--skf-interactive-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-text-color-inverse-hover: var(--skf-color-neutral-lightest);--skf-interactive-text-color-inverse-active: var(--skf-color-neutral-lightest);--skf-interactive-border-color-focus: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-border-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-border-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-border-color-primary: var(--skf-color-neutral-dark);--skf-interactive-border-color-primary-active: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-interactive-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-icon-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-icon-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-icon-color-inverse-hover: var(--skf-color-neutral-lightest)}:host,:where(:root){--skf-severity-bg-color-success: var(--skf-color-green-lightest);--skf-severity-bg-color-info: light-dark( var(--skf-color-blue-lighest), var(--skf-color-blue-lighest) );--skf-severity-bg-color-warning: var(--skf-color-orange-lightest);--skf-severity-bg-color-alert: var(--skf-color-yellow-lightest);--skf-severity-bg-color-error: var(--skf-color-red-lightest)}:host,:where(:root){--skf-severity-fg-color-success: light-dark( var(--skf-color-green-base), var(--skf-color-green-base) );--skf-severity-fg-color-info: light-dark(var(--skf-color-blue-base), var(--skf-color-blue-base));--skf-severity-fg-color-warning: light-dark( var(--skf-color-orange-base), var(--skf-color-orange-base) );--skf-severity-fg-color-error: light-dark(var(--skf-color-red-base), var(--skf-color-red-base));--skf-severity-fg-color-alert: light-dark( var(--skf-color-yellow-base), var(--skf-color-yellow-base) )}:host,:where(:root){--skf-spacing-25: var(--skf-size-4);--skf-spacing-50: var(--skf-size-8);--skf-spacing-75: var(--skf-size-12);--skf-spacing-100: var(--skf-size-16);--skf-spacing-125: var(--skf-size-20);--skf-spacing-150: var(--skf-size-24);--skf-spacing-200: var(--skf-size-32);--skf-spacing-250: var(--skf-size-44);--skf-spacing-300: var(--skf-size-48);--skf-spacing-400: var(--skf-size-56)}:host,:where(:root){--skf-font-size-25: var(--skf-type-scale-10);--skf-font-size-50: var(--skf-type-scale-12);--skf-font-size-75: var(--skf-type-scale-14);--skf-font-size-100: var(--skf-type-scale-16);--skf-font-size-200: var(--skf-type-scale-18);--skf-font-size-300: var(--skf-type-scale-20);--skf-font-size-400: var(--skf-type-scale-22);--skf-font-size-500: var(--skf-type-scale-24);--skf-font-size-600: var(--skf-type-scale-28);--skf-font-size-700: var(--skf-type-scale-32);--skf-font-size-800: var(--skf-type-scale-36);--skf-font-size-900: var(--skf-type-scale-40);--skf-font-size-1000: var(--skf-type-scale-46);--skf-font-size-1100: var(--skf-type-scale-50);--skf-font-size-1200: var(--skf-type-scale-56);--skf-font-size-1300: var(--skf-type-scale-64);--skf-font-size-1400: var(--skf-type-scale-72);--skf-font-size-1500: var(--skf-type-scale-90);--skf-font-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-font-weight-light: 100;--skf-font-weight-regular: 400;--skf-font-weight-medium: 500;--skf-font-weight-bold: 700}:host,:where(:root){--skf-font-family-sans: SKFSans}:host,:where(:root){--skf-line-height-25: var(--skf-type-scale-10);--skf-line-height-50: var(--skf-type-scale-12);--skf-line-height-75: var(--skf-type-scale-14);--skf-line-height-100: var(--skf-type-scale-16);--skf-line-height-200: var(--skf-type-scale-18);--skf-line-height-300: var(--skf-type-scale-20);--skf-line-height-400: var(--skf-type-scale-22);--skf-line-height-500: var(--skf-type-scale-24);--skf-line-height-600: var(--skf-type-scale-28);--skf-line-height-700: var(--skf-type-scale-32);--skf-line-height-800: var(--skf-type-scale-36);--skf-line-height-900: var(--skf-type-scale-40);--skf-line-height-1000: var(--skf-type-scale-46);--skf-line-height-1100: var(--skf-type-scale-50);--skf-line-height-1200: var(--skf-type-scale-56);--skf-line-height-1300: var(--skf-type-scale-64);--skf-line-height-1400: var(--skf-type-scale-72);--skf-line-height-1500: var(--skf-type-scale-90);--skf-line-height-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-motion-duration-fast: 200;--skf-motion-duration-normal: 300;--skf-motion-duration-slow: 400}:host,:where(:root){--skf-motion-easing-ease-in: ease-in;--skf-motion-easing-ease-out: ease-out}:host,:where(:root){--skf-shadow-xl: 0 10px 15px -3px #0000001a;--skf-shadow-md: 0 1px 3px 0 #0000001a;--skf-shadow-sm: 0 1px 2px 0 #0000000d;--skf-shadow-lg: 0 4px 6px -1px #0000001a}:host,:where(:root){--skf-logo-primary: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-logo-secondary: light-dark(var(--skf-color-neutral-black), var(--skf-color-neutral-black));--skf-logo-inverse: light-dark(var(--skf-color-neutral-white), var(--skf-color-neutral-white))}body{color:var(--skf-text-color-primary);font:var(--skf-font-size-100) / var(--skf-line-height-300) var(--skf-font-family-sans);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body:has(skf-dialog[open]){overflow:hidden}
|
1
|
+
@charset "UTF-8";:host,:where(:root){--skf-color-green-lightest: #e5f3ecff;--skf-color-green-base: #048942ff;--skf-color-green-dark: #097c42ff;--skf-color-green-darker: #106b41ff;--skf-color-blue-lightest: #e7eefbff;--skf-color-blue-base: #4f84e0ff;--skf-color-blue-dark: #4978c8ff;--skf-color-blue-darker: #4167a8ff;--skf-color-yellow-lightest: #fff9e7ff;--skf-color-yellow-base: #ffca15ff;--skf-color-yellow-darker: #dfb31bff;--skf-color-yellow-darkest: #b49524ff;--skf-color-orange-lightest: #fff2e5ff;--skf-color-orange-base: #ff8004ff;--skf-color-orange-darker: #df740dff;--skf-color-orange-darkest: #b46518ff;--skf-color-red-lightest: #f9e5e5ff;--skf-color-red-base: #cc0000ff;--skf-color-red-darker: #b3080aff;--skf-color-red-darkest: #921217ff;--skf-color-neutral-lightest: #f6f6f6ff;--skf-color-neutral-lighter: #ebeceeff;--skf-color-neutral-light: #d5d8dcff;--skf-color-neutral-base: #c7cad0ff;--skf-color-neutral-dark: #aaafb8ff;--skf-color-neutral-darker: #808895ff;--skf-color-neutral-darkest: #676f7cff;--skf-color-neutral-black: #273342ff;--skf-color-neutral-white: #ffffffff;--skf-color-brand-base: #0f58d6ff;--skf-color-brand-lightest: #d9e4f8ff;--skf-color-brand-lighter: #c5d7f5ff;--skf-color-brand-dark: #084abdff;--skf-color-neutral-transparent: #ffffff00;--skf-color-neutral-opacity: #12111199;--skf-color-brand-darker: #0b3e96ff;--skf-color-purple-base: #781e93ff;--skf-color-purple-light: #f1e8f4ff}:host,:where(:root){--skf-size-1: .0625rem;--skf-size-2: .125rem;--skf-size-4: .25rem;--skf-size-8: .5rem;--skf-size-12: .75rem;--skf-size-16: 1rem;--skf-size-20: 1.25rem;--skf-size-24: 1.5rem;--skf-size-32: 2rem;--skf-size-44: 2.75rem;--skf-size-48: 3rem;--skf-size-56: 3.5rem}:host,:where(:root){--skf-type-scale-10: .625rem;--skf-type-scale-12: .75rem;--skf-type-scale-14: .875rem;--skf-type-scale-16: 1rem;--skf-type-scale-18: 1.125rem;--skf-type-scale-20: 1.25rem;--skf-type-scale-22: 1.375rem;--skf-type-scale-24: 1.5rem;--skf-type-scale-28: 1.75rem;--skf-type-scale-32: 2rem;--skf-type-scale-36: 2.25rem;--skf-type-scale-40: 2.5rem;--skf-type-scale-46: 2.875rem;--skf-type-scale-50: 3.125rem;--skf-type-scale-56: 3.5rem;--skf-type-scale-64: 4rem;--skf-type-scale-72: 4.5rem;--skf-type-scale-90: 5.625rem;--skf-type-scale-124: 7.75rem}:host,:where(:root){--skf-bg-color-neutral-1: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-light) );--skf-bg-color-neutral-2: var(--skf-color-neutral-lighter);--skf-bg-color-neutral-3: var(--skf-color-neutral-light);--skf-bg-color-neutral-4: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-bg-color-neutral-5: var(--skf-color-neutral-dark);--skf-bg-color-neutral-6: var(--skf-color-neutral-darker);--skf-bg-color-neutral-7: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-white) );--skf-bg-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-text-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-lightest) );--skf-text-color-secondary: var(--skf-color-neutral-darkest);--skf-text-color-tertiary: var(--skf-color-neutral-dark);--skf-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-text-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-icon-size-xs: var(--skf-size-16);--skf-icon-size-sm: var(--skf-size-20);--skf-icon-size-md: var(--skf-size-24);--skf-icon-size-lg: var(--skf-size-32)}:host,:where(:root){--skf-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-icon-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-icon-color-secondary: var(--skf-color-neutral-darkest);--skf-icon-color-purple: light-dark(var(--skf-color-purple-base), var(--skf-color-purple-base))}:host,:where(:root){--skf-border-color-emphasized: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-border-color-primary: var(--skf-color-neutral-dark);--skf-border-color-secondary: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-border-color-tertiary: var(--skf-color-neutral-light);--skf-border-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) )}:host,:where(:root){--skf-border-width-md: var(--skf-size-2);--skf-border-width-lg: var(--skf-size-4);--skf-border-width-sm: var(--skf-size-1)}:host,:where(:root){--skf-border-radius-md: var(--skf-size-8);--skf-border-radius-lg: var(--skf-size-16);--skf-border-radius-sm: var(--skf-size-2)}:host,:where(:root){--skf-interactive-bg-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-lightest) );--skf-interactive-bg-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-bg-color-primary-active: var(--skf-color-brand-darker);--skf-interactive-bg-color-secondary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-bg-color-secondary-hover: var(--skf-color-brand-lightest);--skf-interactive-bg-color-secondary-active: var(--skf-color-brand-lighter);--skf-interactive-bg-color-tertiary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-lightest) );--skf-interactive-bg-color-destructive: light-dark( var(--skf-color-red-base), var(--skf-color-red-base) );--skf-interactive-bg-color-destructive-hover: var(--skf-color-red-darker);--skf-interactive-bg-color-destructive-active: var(--skf-color-red-darkest);--skf-interactive-bg-color-disabled: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-hover: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-active: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-lightest) );--skf-interactive-text-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-text-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-text-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-text-color-primary-active: var(--skf-color-brand-dark);--skf-interactive-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-text-color-inverse-hover: var(--skf-color-neutral-lightest);--skf-interactive-text-color-inverse-active: var(--skf-color-neutral-lightest);--skf-interactive-border-color-focus: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-border-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-border-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-border-color-primary: var(--skf-color-neutral-dark);--skf-interactive-border-color-primary-active: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-interactive-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-icon-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-icon-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-icon-color-inverse-hover: var(--skf-color-neutral-lightest)}:host,:where(:root){--skf-severity-bg-color-success: var(--skf-color-green-lightest);--skf-severity-bg-color-info: var(--skf-color-blue-lightest);--skf-severity-bg-color-warning: var(--skf-color-orange-lightest);--skf-severity-bg-color-alert: var(--skf-color-yellow-lightest);--skf-severity-bg-color-error: var(--skf-color-red-lightest)}:host,:where(:root){--skf-severity-fg-color-success: light-dark( var(--skf-color-green-base), var(--skf-color-green-base) );--skf-severity-fg-color-info: light-dark(var(--skf-color-blue-base), var(--skf-color-blue-base));--skf-severity-fg-color-warning: light-dark( var(--skf-color-orange-base), var(--skf-color-orange-base) );--skf-severity-fg-color-error: light-dark(var(--skf-color-red-base), var(--skf-color-red-base));--skf-severity-fg-color-alert: light-dark( var(--skf-color-yellow-base), var(--skf-color-yellow-base) )}:host,:where(:root){--skf-spacing-25: var(--skf-size-4);--skf-spacing-50: var(--skf-size-8);--skf-spacing-75: var(--skf-size-12);--skf-spacing-100: var(--skf-size-16);--skf-spacing-125: var(--skf-size-20);--skf-spacing-150: var(--skf-size-24);--skf-spacing-200: var(--skf-size-32);--skf-spacing-250: var(--skf-size-44);--skf-spacing-300: var(--skf-size-48);--skf-spacing-400: var(--skf-size-56)}:host,:where(:root){--skf-font-size-25: var(--skf-type-scale-10);--skf-font-size-50: var(--skf-type-scale-12);--skf-font-size-75: var(--skf-type-scale-14);--skf-font-size-100: var(--skf-type-scale-16);--skf-font-size-200: var(--skf-type-scale-18);--skf-font-size-300: var(--skf-type-scale-20);--skf-font-size-400: var(--skf-type-scale-22);--skf-font-size-500: var(--skf-type-scale-24);--skf-font-size-600: var(--skf-type-scale-28);--skf-font-size-700: var(--skf-type-scale-32);--skf-font-size-800: var(--skf-type-scale-36);--skf-font-size-900: var(--skf-type-scale-40);--skf-font-size-1000: var(--skf-type-scale-46);--skf-font-size-1100: var(--skf-type-scale-50);--skf-font-size-1200: var(--skf-type-scale-56);--skf-font-size-1300: var(--skf-type-scale-64);--skf-font-size-1400: var(--skf-type-scale-72);--skf-font-size-1500: var(--skf-type-scale-90);--skf-font-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-font-weight-light: 100;--skf-font-weight-regular: 400;--skf-font-weight-medium: 500;--skf-font-weight-bold: 700}:host,:where(:root){--skf-font-family-sans: SKFSans}:host,:where(:root){--skf-line-height-25: var(--skf-type-scale-10);--skf-line-height-50: var(--skf-type-scale-12);--skf-line-height-75: var(--skf-type-scale-14);--skf-line-height-100: var(--skf-type-scale-16);--skf-line-height-200: var(--skf-type-scale-18);--skf-line-height-300: var(--skf-type-scale-20);--skf-line-height-400: var(--skf-type-scale-22);--skf-line-height-500: var(--skf-type-scale-24);--skf-line-height-600: var(--skf-type-scale-28);--skf-line-height-700: var(--skf-type-scale-32);--skf-line-height-800: var(--skf-type-scale-36);--skf-line-height-900: var(--skf-type-scale-40);--skf-line-height-1000: var(--skf-type-scale-46);--skf-line-height-1100: var(--skf-type-scale-50);--skf-line-height-1200: var(--skf-type-scale-56);--skf-line-height-1300: var(--skf-type-scale-64);--skf-line-height-1400: var(--skf-type-scale-72);--skf-line-height-1500: var(--skf-type-scale-90);--skf-line-height-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-motion-duration-fast: 200;--skf-motion-duration-normal: 300;--skf-motion-duration-slow: 400}:host,:where(:root){--skf-motion-easing-ease-in: ease-in;--skf-motion-easing-ease-out: ease-out}:host,:where(:root){--skf-shadow-xl: 0 10px 15px -3px #0000001a;--skf-shadow-md: 0 1px 3px 0 #0000001a;--skf-shadow-sm: 0 1px 2px 0 #0000000d;--skf-shadow-lg: 0 4px 6px -1px #0000001a}:host,:where(:root){--skf-logo-primary: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-logo-secondary: light-dark(var(--skf-color-neutral-black), var(--skf-color-neutral-black));--skf-logo-inverse: light-dark(var(--skf-color-neutral-white), var(--skf-color-neutral-white))}body{color:var(--skf-text-color-primary);font:var(--skf-font-size-100) / var(--skf-line-height-300) var(--skf-font-family-sans);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body:has(skf-dialog[open]){overflow:hidden}
|
package/dist/styles/global.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
@charset "UTF-8";@font-face{font-family:SKFSans;src:url(https://fonts.skf.com/SKFSans-Regular.woff)}@font-face{font-family:SKFSans;font-style:italic;src:url(https://fonts.skf.com/SKFSans-Italic.woff)}@font-face{font-family:SKFSans;font-weight:100;src:url(https://fonts.skf.com/SKFSans-Light.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:100;src:url(https://fonts.skf.com/SKFSans-LightItalic.woff)}@font-face{font-family:SKFSans;font-weight:500;src:url(https://fonts.skf.com/SKFSans-Medium.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:500;src:url(https://fonts.skf.com/SKFSans-MediumItalic.woff)}@font-face{font-family:SKFSans;font-weight:700;src:url(https://fonts.skf.com/SKFSans-Bold.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:700;src:url(https://fonts.skf.com/SKFSans-BoldItalic.woff)}:host,:where(:root){--skf-color-green-lightest: #e5f3ecff;--skf-color-green-base: #048942ff;--skf-color-green-dark: #097c42ff;--skf-color-green-darker: #106b41ff;--skf-color-blue-lighest: #e7eefbff;--skf-color-blue-base: #4f84e0ff;--skf-color-blue-dark: #4978c8ff;--skf-color-blue-darker: #4167a8ff;--skf-color-yellow-lightest: #fff9e7ff;--skf-color-yellow-base: #ffca15ff;--skf-color-yellow-darker: #dfb31bff;--skf-color-yellow-darkest: #b49524ff;--skf-color-orange-lightest: #fff2e5ff;--skf-color-orange-base: #ff8004ff;--skf-color-orange-darker: #df740dff;--skf-color-orange-darkest: #b46518ff;--skf-color-red-lightest: #f9e5e5ff;--skf-color-red-base: #cc0000ff;--skf-color-red-darker: #b3080aff;--skf-color-red-darkest: #921217ff;--skf-color-neutral-lightest: #f6f6f6ff;--skf-color-neutral-lighter: #ebeceeff;--skf-color-neutral-light: #d5d8dcff;--skf-color-neutral-base: #c7cad0ff;--skf-color-neutral-dark: #aaafb8ff;--skf-color-neutral-darker: #808895ff;--skf-color-neutral-darkest: #676f7cff;--skf-color-neutral-black: #273342ff;--skf-color-neutral-white: #ffffffff;--skf-color-brand-base: #0f58d6ff;--skf-color-brand-lightest: #d9e4f8ff;--skf-color-brand-lighter: #c5d7f5ff;--skf-color-brand-dark: #084abdff;--skf-color-neutral-transparent: #ffffff00;--skf-color-neutral-opacity: #12111199;--skf-color-brand-darker: #0b3e96ff}:host,:where(:root){--skf-size-1: .0625rem;--skf-size-2: .125rem;--skf-size-4: .25rem;--skf-size-8: .5rem;--skf-size-12: .75rem;--skf-size-16: 1rem;--skf-size-20: 1.25rem;--skf-size-24: 1.5rem;--skf-size-32: 2rem;--skf-size-44: 2.75rem;--skf-size-48: 3rem;--skf-size-56: 3.5rem}:host,:where(:root){--skf-type-scale-10: .625rem;--skf-type-scale-12: .75rem;--skf-type-scale-14: .875rem;--skf-type-scale-16: 1rem;--skf-type-scale-18: 1.125rem;--skf-type-scale-20: 1.25rem;--skf-type-scale-22: 1.375rem;--skf-type-scale-24: 1.5rem;--skf-type-scale-28: 1.75rem;--skf-type-scale-32: 2rem;--skf-type-scale-36: 2.25rem;--skf-type-scale-40: 2.5rem;--skf-type-scale-46: 2.875rem;--skf-type-scale-50: 3.125rem;--skf-type-scale-56: 3.5rem;--skf-type-scale-64: 4rem;--skf-type-scale-72: 4.5rem;--skf-type-scale-90: 5.625rem;--skf-type-scale-124: 7.75rem}:host,:where(:root){--skf-bg-color-neutral-1: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-light) );--skf-bg-color-neutral-2: var(--skf-color-neutral-lighter);--skf-bg-color-neutral-3: var(--skf-color-neutral-light);--skf-bg-color-neutral-4: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-bg-color-neutral-5: var(--skf-color-neutral-dark);--skf-bg-color-neutral-6: var(--skf-color-neutral-darker);--skf-bg-color-neutral-7: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-white) );--skf-bg-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-text-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-lightest) );--skf-text-color-secondary: var(--skf-color-neutral-darkest);--skf-text-color-tertiary: var(--skf-color-neutral-dark);--skf-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-text-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-icon-size-xs: var(--skf-size-16);--skf-icon-size-sm: var(--skf-size-20);--skf-icon-size-md: var(--skf-size-24);--skf-icon-size-lg: var(--skf-size-32)}:host,:where(:root){--skf-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-icon-color-emphasised: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-icon-color-secondary: var(--skf-color-neutral-darkest)}:host,:where(:root){--skf-border-color-emphasised: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-border-color-primary: var(--skf-color-neutral-dark);--skf-border-color-secondary: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-border-color-tertiary: var(--skf-color-neutral-light);--skf-border-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) )}:host,:where(:root){--skf-border-width-md: var(--skf-size-2);--skf-border-width-lg: var(--skf-size-4);--skf-border-width-sm: var(--skf-size-1)}:host,:where(:root){--skf-border-radius-md: var(--skf-size-8);--skf-border-radius-lg: var(--skf-size-16);--skf-border-radius-sm: var(--skf-size-2)}:host,:where(:root){--skf-interactive-bg-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-lightest) );--skf-interactive-bg-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-bg-color-primary-active: var(--skf-color-brand-darker);--skf-interactive-bg-color-secondary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-bg-color-secondary-hover: var(--skf-color-brand-lightest);--skf-interactive-bg-color-secondary-active: var(--skf-color-brand-lighter);--skf-interactive-bg-color-tertiary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-lightest) );--skf-interactive-bg-color-destructive: light-dark( var(--skf-color-red-base), var(--skf-color-red-base) );--skf-interactive-bg-color-destructive-hover: var(--skf-color-red-darker);--skf-interactive-bg-color-destructive-active: var(--skf-color-red-darkest);--skf-interactive-bg-color-disabled: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-hover: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-active: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-lightest) );--skf-interactive-text-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-text-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-text-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-text-color-primary-active: var(--skf-color-brand-dark);--skf-interactive-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-text-color-inverse-hover: var(--skf-color-neutral-lightest);--skf-interactive-text-color-inverse-active: var(--skf-color-neutral-lightest);--skf-interactive-border-color-focus: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-border-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-border-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-border-color-primary: var(--skf-color-neutral-dark);--skf-interactive-border-color-primary-active: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-interactive-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-icon-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-icon-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-icon-color-inverse-hover: var(--skf-color-neutral-lightest)}:host,:where(:root){--skf-severity-bg-color-success: var(--skf-color-green-lightest);--skf-severity-bg-color-info: light-dark( var(--skf-color-blue-lighest), var(--skf-color-blue-lighest) );--skf-severity-bg-color-warning: var(--skf-color-orange-lightest);--skf-severity-bg-color-alert: var(--skf-color-yellow-lightest);--skf-severity-bg-color-error: var(--skf-color-red-lightest)}:host,:where(:root){--skf-severity-fg-color-success: light-dark( var(--skf-color-green-base), var(--skf-color-green-base) );--skf-severity-fg-color-info: light-dark(var(--skf-color-blue-base), var(--skf-color-blue-base));--skf-severity-fg-color-warning: light-dark( var(--skf-color-orange-base), var(--skf-color-orange-base) );--skf-severity-fg-color-error: light-dark(var(--skf-color-red-base), var(--skf-color-red-base));--skf-severity-fg-color-alert: light-dark( var(--skf-color-yellow-base), var(--skf-color-yellow-base) )}:host,:where(:root){--skf-spacing-25: var(--skf-size-4);--skf-spacing-50: var(--skf-size-8);--skf-spacing-75: var(--skf-size-12);--skf-spacing-100: var(--skf-size-16);--skf-spacing-125: var(--skf-size-20);--skf-spacing-150: var(--skf-size-24);--skf-spacing-200: var(--skf-size-32);--skf-spacing-250: var(--skf-size-44);--skf-spacing-300: var(--skf-size-48);--skf-spacing-400: var(--skf-size-56)}:host,:where(:root){--skf-font-size-25: var(--skf-type-scale-10);--skf-font-size-50: var(--skf-type-scale-12);--skf-font-size-75: var(--skf-type-scale-14);--skf-font-size-100: var(--skf-type-scale-16);--skf-font-size-200: var(--skf-type-scale-18);--skf-font-size-300: var(--skf-type-scale-20);--skf-font-size-400: var(--skf-type-scale-22);--skf-font-size-500: var(--skf-type-scale-24);--skf-font-size-600: var(--skf-type-scale-28);--skf-font-size-700: var(--skf-type-scale-32);--skf-font-size-800: var(--skf-type-scale-36);--skf-font-size-900: var(--skf-type-scale-40);--skf-font-size-1000: var(--skf-type-scale-46);--skf-font-size-1100: var(--skf-type-scale-50);--skf-font-size-1200: var(--skf-type-scale-56);--skf-font-size-1300: var(--skf-type-scale-64);--skf-font-size-1400: var(--skf-type-scale-72);--skf-font-size-1500: var(--skf-type-scale-90);--skf-font-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-font-weight-light: 100;--skf-font-weight-regular: 400;--skf-font-weight-medium: 500;--skf-font-weight-bold: 700}:host,:where(:root){--skf-font-family-sans: SKFSans}:host,:where(:root){--skf-line-height-25: var(--skf-type-scale-10);--skf-line-height-50: var(--skf-type-scale-12);--skf-line-height-75: var(--skf-type-scale-14);--skf-line-height-100: var(--skf-type-scale-16);--skf-line-height-200: var(--skf-type-scale-18);--skf-line-height-300: var(--skf-type-scale-20);--skf-line-height-400: var(--skf-type-scale-22);--skf-line-height-500: var(--skf-type-scale-24);--skf-line-height-600: var(--skf-type-scale-28);--skf-line-height-700: var(--skf-type-scale-32);--skf-line-height-800: var(--skf-type-scale-36);--skf-line-height-900: var(--skf-type-scale-40);--skf-line-height-1000: var(--skf-type-scale-46);--skf-line-height-1100: var(--skf-type-scale-50);--skf-line-height-1200: var(--skf-type-scale-56);--skf-line-height-1300: var(--skf-type-scale-64);--skf-line-height-1400: var(--skf-type-scale-72);--skf-line-height-1500: var(--skf-type-scale-90);--skf-line-height-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-motion-duration-fast: 200;--skf-motion-duration-normal: 300;--skf-motion-duration-slow: 400}:host,:where(:root){--skf-motion-easing-ease-in: ease-in;--skf-motion-easing-ease-out: ease-out}:host,:where(:root){--skf-shadow-xl: 0 10px 15px -3px #0000001a;--skf-shadow-md: 0 1px 3px 0 #0000001a;--skf-shadow-sm: 0 1px 2px 0 #0000000d;--skf-shadow-lg: 0 4px 6px -1px #0000001a}:host,:where(:root){--skf-logo-primary: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-logo-secondary: light-dark(var(--skf-color-neutral-black), var(--skf-color-neutral-black));--skf-logo-inverse: light-dark(var(--skf-color-neutral-white), var(--skf-color-neutral-white))}body{color:var(--skf-text-color-primary);font:var(--skf-font-size-100) / var(--skf-line-height-300) var(--skf-font-family-sans);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body:has(skf-dialog[open]){overflow:hidden}
|
1
|
+
@charset "UTF-8";@font-face{font-family:SKFSans;src:url(https://fonts.skf.com/SKFSans-Regular.woff)}@font-face{font-family:SKFSans;font-style:italic;src:url(https://fonts.skf.com/SKFSans-Italic.woff)}@font-face{font-family:SKFSans;font-weight:100;src:url(https://fonts.skf.com/SKFSans-Light.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:100;src:url(https://fonts.skf.com/SKFSans-LightItalic.woff)}@font-face{font-family:SKFSans;font-weight:500;src:url(https://fonts.skf.com/SKFSans-Medium.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:500;src:url(https://fonts.skf.com/SKFSans-MediumItalic.woff)}@font-face{font-family:SKFSans;font-weight:700;src:url(https://fonts.skf.com/SKFSans-Bold.woff)}@font-face{font-family:SKFSans;font-style:italic;font-weight:700;src:url(https://fonts.skf.com/SKFSans-BoldItalic.woff)}:host,:where(:root){--skf-color-green-lightest: #e5f3ecff;--skf-color-green-base: #048942ff;--skf-color-green-dark: #097c42ff;--skf-color-green-darker: #106b41ff;--skf-color-blue-lightest: #e7eefbff;--skf-color-blue-base: #4f84e0ff;--skf-color-blue-dark: #4978c8ff;--skf-color-blue-darker: #4167a8ff;--skf-color-yellow-lightest: #fff9e7ff;--skf-color-yellow-base: #ffca15ff;--skf-color-yellow-darker: #dfb31bff;--skf-color-yellow-darkest: #b49524ff;--skf-color-orange-lightest: #fff2e5ff;--skf-color-orange-base: #ff8004ff;--skf-color-orange-darker: #df740dff;--skf-color-orange-darkest: #b46518ff;--skf-color-red-lightest: #f9e5e5ff;--skf-color-red-base: #cc0000ff;--skf-color-red-darker: #b3080aff;--skf-color-red-darkest: #921217ff;--skf-color-neutral-lightest: #f6f6f6ff;--skf-color-neutral-lighter: #ebeceeff;--skf-color-neutral-light: #d5d8dcff;--skf-color-neutral-base: #c7cad0ff;--skf-color-neutral-dark: #aaafb8ff;--skf-color-neutral-darker: #808895ff;--skf-color-neutral-darkest: #676f7cff;--skf-color-neutral-black: #273342ff;--skf-color-neutral-white: #ffffffff;--skf-color-brand-base: #0f58d6ff;--skf-color-brand-lightest: #d9e4f8ff;--skf-color-brand-lighter: #c5d7f5ff;--skf-color-brand-dark: #084abdff;--skf-color-neutral-transparent: #ffffff00;--skf-color-neutral-opacity: #12111199;--skf-color-brand-darker: #0b3e96ff;--skf-color-purple-base: #781e93ff;--skf-color-purple-light: #f1e8f4ff}:host,:where(:root){--skf-size-1: .0625rem;--skf-size-2: .125rem;--skf-size-4: .25rem;--skf-size-8: .5rem;--skf-size-12: .75rem;--skf-size-16: 1rem;--skf-size-20: 1.25rem;--skf-size-24: 1.5rem;--skf-size-32: 2rem;--skf-size-44: 2.75rem;--skf-size-48: 3rem;--skf-size-56: 3.5rem}:host,:where(:root){--skf-type-scale-10: .625rem;--skf-type-scale-12: .75rem;--skf-type-scale-14: .875rem;--skf-type-scale-16: 1rem;--skf-type-scale-18: 1.125rem;--skf-type-scale-20: 1.25rem;--skf-type-scale-22: 1.375rem;--skf-type-scale-24: 1.5rem;--skf-type-scale-28: 1.75rem;--skf-type-scale-32: 2rem;--skf-type-scale-36: 2.25rem;--skf-type-scale-40: 2.5rem;--skf-type-scale-46: 2.875rem;--skf-type-scale-50: 3.125rem;--skf-type-scale-56: 3.5rem;--skf-type-scale-64: 4rem;--skf-type-scale-72: 4.5rem;--skf-type-scale-90: 5.625rem;--skf-type-scale-124: 7.75rem}:host,:where(:root){--skf-bg-color-neutral-1: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-light) );--skf-bg-color-neutral-2: var(--skf-color-neutral-lighter);--skf-bg-color-neutral-3: var(--skf-color-neutral-light);--skf-bg-color-neutral-4: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-bg-color-neutral-5: var(--skf-color-neutral-dark);--skf-bg-color-neutral-6: var(--skf-color-neutral-darker);--skf-bg-color-neutral-7: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-white) );--skf-bg-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-text-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-lightest) );--skf-text-color-secondary: var(--skf-color-neutral-darkest);--skf-text-color-tertiary: var(--skf-color-neutral-dark);--skf-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-text-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base))}:host,:where(:root){--skf-icon-size-xs: var(--skf-size-16);--skf-icon-size-sm: var(--skf-size-20);--skf-icon-size-md: var(--skf-size-24);--skf-icon-size-lg: var(--skf-size-32)}:host,:where(:root){--skf-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-icon-color-emphasized: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-icon-color-secondary: var(--skf-color-neutral-darkest);--skf-icon-color-purple: light-dark(var(--skf-color-purple-base), var(--skf-color-purple-base))}:host,:where(:root){--skf-border-color-emphasized: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-border-color-primary: var(--skf-color-neutral-dark);--skf-border-color-secondary: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-base) );--skf-border-color-tertiary: var(--skf-color-neutral-light);--skf-border-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) )}:host,:where(:root){--skf-border-width-md: var(--skf-size-2);--skf-border-width-lg: var(--skf-size-4);--skf-border-width-sm: var(--skf-size-1)}:host,:where(:root){--skf-border-radius-md: var(--skf-size-8);--skf-border-radius-lg: var(--skf-size-16);--skf-border-radius-sm: var(--skf-size-2)}:host,:where(:root){--skf-interactive-bg-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-lightest) );--skf-interactive-bg-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-bg-color-primary-active: var(--skf-color-brand-darker);--skf-interactive-bg-color-secondary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-bg-color-secondary-hover: var(--skf-color-brand-lightest);--skf-interactive-bg-color-secondary-active: var(--skf-color-brand-lighter);--skf-interactive-bg-color-tertiary: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-lightest) );--skf-interactive-bg-color-destructive: light-dark( var(--skf-color-red-base), var(--skf-color-red-base) );--skf-interactive-bg-color-destructive-hover: var(--skf-color-red-darker);--skf-interactive-bg-color-destructive-active: var(--skf-color-red-darkest);--skf-interactive-bg-color-disabled: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-hover: var(--skf-color-neutral-lighter);--skf-interactive-bg-color-tertiary-active: light-dark( var(--skf-color-neutral-base), var(--skf-color-neutral-lightest) );--skf-interactive-text-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-text-color-primary: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-text-color-primary-hover: var(--skf-color-brand-dark);--skf-interactive-text-color-primary-active: var(--skf-color-brand-dark);--skf-interactive-text-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-text-color-inverse-hover: var(--skf-color-neutral-lightest);--skf-interactive-text-color-inverse-active: var(--skf-color-neutral-lightest);--skf-interactive-border-color-focus: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-border-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-border-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-border-color-primary: var(--skf-color-neutral-dark);--skf-interactive-border-color-primary-active: light-dark( var(--skf-color-brand-base), var(--skf-color-brand-base) );--skf-interactive-icon-color-primary: light-dark( var(--skf-color-neutral-black), var(--skf-color-neutral-black) );--skf-interactive-icon-color-inverse: light-dark( var(--skf-color-neutral-white), var(--skf-color-neutral-white) );--skf-interactive-icon-color-disabled: var(--skf-color-neutral-darker);--skf-interactive-icon-color-primary-hover: var(--skf-color-neutral-darkest);--skf-interactive-icon-color-inverse-hover: var(--skf-color-neutral-lightest)}:host,:where(:root){--skf-severity-bg-color-success: var(--skf-color-green-lightest);--skf-severity-bg-color-info: var(--skf-color-blue-lightest);--skf-severity-bg-color-warning: var(--skf-color-orange-lightest);--skf-severity-bg-color-alert: var(--skf-color-yellow-lightest);--skf-severity-bg-color-error: var(--skf-color-red-lightest)}:host,:where(:root){--skf-severity-fg-color-success: light-dark( var(--skf-color-green-base), var(--skf-color-green-base) );--skf-severity-fg-color-info: light-dark(var(--skf-color-blue-base), var(--skf-color-blue-base));--skf-severity-fg-color-warning: light-dark( var(--skf-color-orange-base), var(--skf-color-orange-base) );--skf-severity-fg-color-error: light-dark(var(--skf-color-red-base), var(--skf-color-red-base));--skf-severity-fg-color-alert: light-dark( var(--skf-color-yellow-base), var(--skf-color-yellow-base) )}:host,:where(:root){--skf-spacing-25: var(--skf-size-4);--skf-spacing-50: var(--skf-size-8);--skf-spacing-75: var(--skf-size-12);--skf-spacing-100: var(--skf-size-16);--skf-spacing-125: var(--skf-size-20);--skf-spacing-150: var(--skf-size-24);--skf-spacing-200: var(--skf-size-32);--skf-spacing-250: var(--skf-size-44);--skf-spacing-300: var(--skf-size-48);--skf-spacing-400: var(--skf-size-56)}:host,:where(:root){--skf-font-size-25: var(--skf-type-scale-10);--skf-font-size-50: var(--skf-type-scale-12);--skf-font-size-75: var(--skf-type-scale-14);--skf-font-size-100: var(--skf-type-scale-16);--skf-font-size-200: var(--skf-type-scale-18);--skf-font-size-300: var(--skf-type-scale-20);--skf-font-size-400: var(--skf-type-scale-22);--skf-font-size-500: var(--skf-type-scale-24);--skf-font-size-600: var(--skf-type-scale-28);--skf-font-size-700: var(--skf-type-scale-32);--skf-font-size-800: var(--skf-type-scale-36);--skf-font-size-900: var(--skf-type-scale-40);--skf-font-size-1000: var(--skf-type-scale-46);--skf-font-size-1100: var(--skf-type-scale-50);--skf-font-size-1200: var(--skf-type-scale-56);--skf-font-size-1300: var(--skf-type-scale-64);--skf-font-size-1400: var(--skf-type-scale-72);--skf-font-size-1500: var(--skf-type-scale-90);--skf-font-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-font-weight-light: 100;--skf-font-weight-regular: 400;--skf-font-weight-medium: 500;--skf-font-weight-bold: 700}:host,:where(:root){--skf-font-family-sans: SKFSans}:host,:where(:root){--skf-line-height-25: var(--skf-type-scale-10);--skf-line-height-50: var(--skf-type-scale-12);--skf-line-height-75: var(--skf-type-scale-14);--skf-line-height-100: var(--skf-type-scale-16);--skf-line-height-200: var(--skf-type-scale-18);--skf-line-height-300: var(--skf-type-scale-20);--skf-line-height-400: var(--skf-type-scale-22);--skf-line-height-500: var(--skf-type-scale-24);--skf-line-height-600: var(--skf-type-scale-28);--skf-line-height-700: var(--skf-type-scale-32);--skf-line-height-800: var(--skf-type-scale-36);--skf-line-height-900: var(--skf-type-scale-40);--skf-line-height-1000: var(--skf-type-scale-46);--skf-line-height-1100: var(--skf-type-scale-50);--skf-line-height-1200: var(--skf-type-scale-56);--skf-line-height-1300: var(--skf-type-scale-64);--skf-line-height-1400: var(--skf-type-scale-72);--skf-line-height-1500: var(--skf-type-scale-90);--skf-line-height-size-1600: var(--skf-type-scale-124)}:host,:where(:root){--skf-motion-duration-fast: 200;--skf-motion-duration-normal: 300;--skf-motion-duration-slow: 400}:host,:where(:root){--skf-motion-easing-ease-in: ease-in;--skf-motion-easing-ease-out: ease-out}:host,:where(:root){--skf-shadow-xl: 0 10px 15px -3px #0000001a;--skf-shadow-md: 0 1px 3px 0 #0000001a;--skf-shadow-sm: 0 1px 2px 0 #0000000d;--skf-shadow-lg: 0 4px 6px -1px #0000001a}:host,:where(:root){--skf-logo-primary: light-dark(var(--skf-color-brand-base), var(--skf-color-brand-base));--skf-logo-secondary: light-dark(var(--skf-color-neutral-black), var(--skf-color-neutral-black));--skf-logo-inverse: light-dark(var(--skf-color-neutral-white), var(--skf-color-neutral-white))}body{color:var(--skf-text-color-primary);font:var(--skf-font-size-100) / var(--skf-line-height-300) var(--skf-font-family-sans);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body:has(skf-dialog[open]){overflow:hidden}
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import "../utilities/localize.js";
|
2
|
+
import { registerTranslation as o } from "@shoelace-style/localize";
|
3
|
+
const t = {
|
4
|
+
$code: "en",
|
5
|
+
$name: "English",
|
6
|
+
$dir: "ltr",
|
7
|
+
choose: "Choose",
|
8
|
+
clearEntry: "Clear entry",
|
9
|
+
close: "Close",
|
10
|
+
hidePassword: "Hide password",
|
11
|
+
itemsSelected: (e) => `${e.toString()} items selected`,
|
12
|
+
loading: "Loading",
|
13
|
+
mainNavigation: "Main navigation",
|
14
|
+
nextMonth: "Next month",
|
15
|
+
nextYear: "Next year",
|
16
|
+
previousMonth: "Previous month",
|
17
|
+
previousYear: "Previous year",
|
18
|
+
required: "Required",
|
19
|
+
selectedDay: "Selected day",
|
20
|
+
showMenu: "Show menu",
|
21
|
+
showPassword: "Show password",
|
22
|
+
today: "Today"
|
23
|
+
};
|
24
|
+
o(t);
|
25
|
+
export {
|
26
|
+
t as default
|
27
|
+
};
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import "../utilities/localize.js";
|
2
|
+
import { registerTranslation as r } from "@shoelace-style/localize";
|
3
|
+
const o = {
|
4
|
+
$code: "es",
|
5
|
+
$name: "Spanish",
|
6
|
+
$dir: "ltr",
|
7
|
+
choose: "Elegir",
|
8
|
+
clearEntry: "Borrar entrada",
|
9
|
+
close: "Cerrar",
|
10
|
+
hidePassword: "Ocultar contraseña",
|
11
|
+
itemsSelected: (e) => `${e.toString()} elementos seleccionados`,
|
12
|
+
loading: "Cargando",
|
13
|
+
mainNavigation: "Navegación principal",
|
14
|
+
nextMonth: "Próximo mes",
|
15
|
+
nextYear: "Próximo año",
|
16
|
+
previousMonth: "Mes anterior",
|
17
|
+
previousYear: "Año anterior",
|
18
|
+
required: "Requerido",
|
19
|
+
selectedDay: "Día seleccionado",
|
20
|
+
showMenu: "Mostrar menú",
|
21
|
+
showPassword: "Mostrar contraseña",
|
22
|
+
today: "Hoy"
|
23
|
+
};
|
24
|
+
r(o);
|
25
|
+
export {
|
26
|
+
o as default
|
27
|
+
};
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import "../utilities/localize.js";
|
2
|
+
import { registerTranslation as o } from "@shoelace-style/localize";
|
3
|
+
const r = {
|
4
|
+
$code: "pt",
|
5
|
+
$name: "Português",
|
6
|
+
$dir: "ltr",
|
7
|
+
choose: "Escolher",
|
8
|
+
clearEntry: "Limpar entrada",
|
9
|
+
close: "Fechar",
|
10
|
+
hidePassword: "Esconder a senha",
|
11
|
+
itemsSelected: (e) => `${e.toString()} itens selecionados`,
|
12
|
+
loading: "Carregando",
|
13
|
+
mainNavigation: "Navegação principal",
|
14
|
+
nextMonth: "Próximo mês",
|
15
|
+
nextYear: "Próximo ano",
|
16
|
+
previousMonth: "Mês anterior",
|
17
|
+
previousYear: "Ano anterior",
|
18
|
+
required: "Obrigatório",
|
19
|
+
selectedDay: "Dia selecionado",
|
20
|
+
showMenu: "Mostrar menu",
|
21
|
+
showPassword: "Mostrar senha",
|
22
|
+
today: "Hoje"
|
23
|
+
};
|
24
|
+
o(r);
|
25
|
+
export {
|
26
|
+
r as default
|
27
|
+
};
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import "../utilities/localize.js";
|
2
|
+
import { registerTranslation as a } from "@shoelace-style/localize";
|
3
|
+
const n = {
|
4
|
+
$code: "sv",
|
5
|
+
$name: "Svenska",
|
6
|
+
$dir: "ltr",
|
7
|
+
choose: "Välj",
|
8
|
+
clearEntry: "Rensa inmatning",
|
9
|
+
close: "Stäng",
|
10
|
+
hidePassword: "Dölj lösenord",
|
11
|
+
itemsSelected: (e) => `${e.toString()} valda objekt`,
|
12
|
+
loading: "Läser in",
|
13
|
+
mainNavigation: "Huvudnavigering",
|
14
|
+
nextMonth: "Nästa månad",
|
15
|
+
nextYear: "Nästa år",
|
16
|
+
previousMonth: "Föregående månad",
|
17
|
+
previousYear: "Föregående år",
|
18
|
+
required: "Obligatoriskt",
|
19
|
+
selectedDay: "Vald dag",
|
20
|
+
showMenu: "Visa meny",
|
21
|
+
showPassword: "Visa lösenord",
|
22
|
+
today: "Idag"
|
23
|
+
};
|
24
|
+
a(n);
|
25
|
+
export {
|
26
|
+
n as default
|
27
|
+
};
|