@kofile/gds-foundations 1.0.0-alpha.17 → 1.0.0-alpha.19
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/build/css/.DS_Store +0 -0
- package/build/css/components/badge.module.css +6 -0
- package/build/css/components/card.module.css +3 -6
- package/build/css/components/dialog.module.css +52 -0
- package/build/css/components/field-message.module.css +0 -1
- package/build/css/components/input.module.css +20 -3
- package/build/css/components/segmented-controller.module.css +9 -0
- package/build/css/components/select.module.css +23 -2
- package/build/css/components/tabs.module.css +5 -9
- package/build/css/index.css +0 -1
- package/build/css/themes/dialog/dark.css +5 -0
- package/build/css/themes/dialog/light.css +5 -0
- package/build/css/themes/global.css +38 -2
- package/build/css/themes/select/dark.css +2 -0
- package/build/css/themes/select/light.css +2 -0
- package/build/minified/badge.module.css +1 -0
- package/build/minified/button.module.css +33 -0
- package/build/minified/card.module.css +1 -0
- package/build/minified/checkbox.module.css +7 -0
- package/build/minified/dark.css +1 -0
- package/build/minified/dialog.module.css +21 -0
- package/build/minified/field-message.module.css +1 -0
- package/build/minified/form-label.module.css +1 -0
- package/build/minified/global.css +1 -0
- package/build/minified/index.css +1 -0
- package/build/minified/input.module.css +33 -0
- package/build/minified/label.module.css +1 -0
- package/build/minified/light.css +1 -0
- package/build/minified/link.module.css +1 -0
- package/build/minified/list-callout-group.module.css +1 -0
- package/build/minified/list-callout.module.css +1 -0
- package/build/minified/list-group.module.css +1 -0
- package/build/minified/list-item.module.css +1 -0
- package/build/minified/loader.module.css +1 -0
- package/build/minified/radio-group.module.css +21 -0
- package/build/minified/segmented-controller.module.css +57 -0
- package/build/minified/select.module.css +55 -0
- package/build/minified/switch.module.css +3 -0
- package/build/minified/table.module.css +65 -0
- package/build/minified/tabs.module.css +9 -0
- package/package.json +3 -11
- package/build/css/tokens-global.css +0 -342
- package/build/css/utilities/background-color.css +0 -445
- package/build/css/utilities/border-color.css +0 -284
- package/build/css/utilities/border-radius.css +0 -455
- package/build/css/utilities/border-style.css +0 -18
- package/build/css/utilities/border-width.css +0 -127
- package/build/css/utilities/box-sizing.css +0 -7
- package/build/css/utilities/color.css +0 -290
- package/build/css/utilities/cursor.css +0 -31
- package/build/css/utilities/display.css +0 -63
- package/build/css/utilities/flex-shrink.css +0 -6
- package/build/css/utilities/flex.css +0 -198
- package/build/css/utilities/font.css +0 -131
- package/build/css/utilities/gap.css +0 -104
- package/build/css/utilities/grid-auto-columns.css +0 -12
- package/build/css/utilities/grid-template-columns.css +0 -42
- package/build/css/utilities/height.css +0 -168
- package/build/css/utilities/index.css +0 -33
- package/build/css/utilities/margin.css +0 -299
- package/build/css/utilities/max-height.css +0 -123
- package/build/css/utilities/max-width.css +0 -69
- package/build/css/utilities/min-height.css +0 -18
- package/build/css/utilities/min-width.css +0 -15
- package/build/css/utilities/object-fit.css +0 -15
- package/build/css/utilities/object-position.css +0 -27
- package/build/css/utilities/overflow.css +0 -45
- package/build/css/utilities/padding.css +0 -288
- package/build/css/utilities/position.css +0 -1297
- package/build/css/utilities/shadow.css +0 -15
- package/build/css/utilities/text-align.css +0 -18
- package/build/css/utilities/text-overflow.css +0 -13
- package/build/css/utilities/text-transform.css +0 -12
- package/build/css/utilities/vertical-align.css +0 -31
- package/build/css/utilities/white-space.css +0 -23
- package/build/css/utilities/width.css +0 -201
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
.root{display:flex;width:var(--input-elements-root-size-xl-width)}.root:focus-within{border-radius:var(--input-elements-text-field-size-xl-border-radius);box-shadow:0 0 0 6px rgba(12,87,205,.16)}.input{background-color:var(
|
|
2
|
+
--input-light-elements-text-field-color-background-primary-default
|
|
3
|
+
);border-color:var(
|
|
4
|
+
--input-light-elements-text-field-color-border-primary-default
|
|
5
|
+
);border-radius:var(--input-elements-text-field-size-xl-border-radius);border-style:solid;border-width:var(--input-elements-text-field-size-xl-border-width);box-sizing:border-box;color:var(--input-light-elements-color-text-primary-default);font:var(--input-elements-text-field-size-xl-typography);max-height:var(--input-elements-text-field-size-xl-height);outline:none;padding-block:var(--input-elements-text-field-size-xl-padding-block);padding-inline:var(--input-elements-text-field-size-xl-padding-inline);width:100%}.input[data-size=lg]{border-radius:var(--input-elements-text-field-size-lg-border-radius);font:var(--input-elements-text-field-size-lg-typography);height:var(--input-elements-text-field-size-lg-height);padding-block:var(--input-elements-text-field-size-lg-padding-block);padding-inline-start:var(
|
|
6
|
+
--input-elements-text-field-size-lg-padding-inline-start
|
|
7
|
+
)}.input[data-size=lg]+.icon{height:var(--input-elements-icon-size-lg-height)}.input[data-size=md]{border-radius:var(--input-elements-text-field-size-md-border-radius);font:var(--input-elements-text-field-size-md-typography);height:var(--input-elements-text-field-size-md-height);padding-block:var(--input-elements-text-field-size-md-padding-block);padding-inline-start:var(
|
|
8
|
+
--input-elements-text-field-size-md-padding-inline-start
|
|
9
|
+
)}.input[data-size=md]+.icon{height:var(--input-elements-icon-size-md-height)}.root[data-altbackground=true] .icon,.root[data-altbackground=true] .input{background-color:var(
|
|
10
|
+
--input-light-elements-text-field-color-background-altbackground-default
|
|
11
|
+
)}.input[data-error=true]::placeholder{color:var(--input-light-elements-text-field-color-text-error-placeholder)}.icon[data-error=true],.input[data-error=true]{background-color:var(
|
|
12
|
+
--input-light-elements-text-field-color-background-error-default
|
|
13
|
+
);border-color:var(
|
|
14
|
+
--input-light-elements-text-field-color-border-error-default
|
|
15
|
+
)}.root[data-error=true]:focus-within{border-radius:var(--input-elements-text-field-size-xl-border-radius);box-shadow:0 0 0 6px rgba(209,40,40,.24)}.icon[aria-disabled=true],.input[data-disabled=true]{opacity:var(--input-disabled-opacity);pointer-events:none}.icon{align-items:center;background-color:var(
|
|
16
|
+
--input-light-elements-icon-color-background-primary-default
|
|
17
|
+
);border-color:var(--input-light-elements-icon-color-border-primary-default);border-radius:var(--input-elements-icon-size-xl-border-radius);border-style:solid;border-width:var(--input-elements-icon-size-xl-border-width);box-sizing:border-box;color:var(--input-light-elements-icon-color-text-primary-default);display:flex;height:var(--input-elements-icon-size-xl-height);justify-content:center;padding-inline-end:var(--input-elements-icon-size-xl-padding-block-end);padding-inline-start:var(--input-elements-icon-size-xl-padding-block-start)}.icon[data-size=md]{border-radius:var(--input-elements-icon-size-md-border-radius);height:var(--input-elements-icon-size-md-height)}.icon[data-size=lg]{border-radius:var(--input-elements-icon-size-lg-border-radius);height:var(--input-elements-icon-size-lg-height)}.addon{align-items:center;background-color:var(
|
|
18
|
+
--input-light-elements-addon-color-background-primary-default
|
|
19
|
+
);border-color:var(--input-light-elements-addon-color-border-primary-default);border-radius:var(--input-elements-addon-size-xl-border-radius);border-style:solid;border-width:var(--input-elements-addon-size-xl-border-width);color:var(--input-light-elements-addon-color-text-primary-default);display:flex;height:var(--input-elements-addon-size-xl-height);padding-inline:var(--input-elements-addon-size-xl-padding-inline);z-index:10}.addon[data-size=md]{border-radius:var(--input-elements-addon-size-md-border-radius);height:var(--input-elements-addon-size-md-height)}.addon[data-size=lg]{border-radius:var(--input-elements-addon-size-lg-border-radius);height:var(--input-elements-addon-size-lg-height)}.root[data-mode=dark][data-altbackground=true] .icon,.root[data-mode=dark][data-altbackground=true] .input{background-color:var(
|
|
20
|
+
--input-dark-elements-text-field-color-background-altbackground-default
|
|
21
|
+
)}.root[data-mode=dark]:focus-within{box-shadow:0 0 0 6px rgba(12,87,205,.24)}.root[data-mode=dark][data-error=true]:focus-within{box-shadow:0 0 0 6px rgba(209,40,40,.24)}.icon[data-mode=dark][data-error=true],.input[data-mode=dark][data-error=true]{background-color:var(
|
|
22
|
+
--input-dark-elements-text-field-color-background-error-default
|
|
23
|
+
);border-color:var(
|
|
24
|
+
--input-dark-elements-text-field-color-border-error-default
|
|
25
|
+
)}.input[data-mode=dark],.input[data-mode=dark]+.icon{background-color:var(
|
|
26
|
+
--input-dark-elements-text-field-color-background-primary-default
|
|
27
|
+
);border-color:var(
|
|
28
|
+
--input-dark-elements-text-field-color-border-primary-default
|
|
29
|
+
);color:var(--input-dark-elements-text-field-color-text-primary-default)}.input[data-mode=dark]::placeholder{color:var(--input-dark-elements-text-field-color-text-error-placeholder)}.icon[data-mode=dark]{background-color:var(
|
|
30
|
+
--input-dark-elements-icon-color-background-primary-default
|
|
31
|
+
);border-color:var(--input-dark-elements-icon-color-border-primary-default);color:var(--input-dark-elements-icon-color-text-primary-default)}.addon[data-mode=dark]{background-color:var(
|
|
32
|
+
--input-dark-elements-addon-color-background-primary-default
|
|
33
|
+
);border-color:var(--input-dark-elements-addon-color-border-primary-default)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.label{all:unset;box-sizing:border-box;color:var(--label-light-color-text-primary-default);cursor:default;font:var(--label-size-md-typography)}.label[aria-disabled=true]{cursor:not-allowed;opacity:var(--label-opacity-disabled);pointer-events:none}.label[data-size=sm]{font:var(--label-size-sm-typography)}.label[data-mode=dark]{color:var(--label-dark-color-text-primary-default)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import "./global.css";@import "./badge/light.css";@import "./button/light.css";@import "./checkbox/light.css";@import "./checkbox-tile/light.css";@import "./field-message/light.css";@import "./form-label/light.css";@import "./input/light.css";@import "./label/light.css";@import "./link/light.css";@import "./radio-group/light.css";@import "./radio-group-tile/light.css";@import "./select/light.css";@import "./switch/light.css";@import "./table/light.css";@import "./tabs/light.css";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.link{all:unset;align-items:center;box-sizing:border-box;color:var(--link-light-color-text-primary-default);cursor:pointer;display:inline-flex;font:var(--link-size-xl-typography);gap:var(--link-gap-default);text-decoration:underline;vertical-align:top}.link:hover{color:var(--link-light-color-text-primary-hover)}.link:active{color:var(--link-light-color-text-primary-active)}.link[data-size="3xs"]{font:var(--link-size-3xs-typography)}.link[data-size="2xs"]{font:var(--link-size-2xs-typography)}.link[data-size=xs]{font:var(--link-size-xs-typography)}.link[data-size=sm]{font:var(--link-size-sm-typography)}.link[data-size=md]{font:var(--link-size-md-typography)}.link[data-size=lg]{font:var(--link-size-lg-typography)}.link[data-size=xl]{font:var(--link-size-xl-typography)}.link[data-weight=regular]{font-weight:var(--link-weight-regular)}.link[data-mode=dark]{color:var(--link-dark-color-text-primary-default)}.link[data-mode=dark]:hover{color:var(--link-dark-color-text-primary-hover)}.link[data-mode=dark]:active{color:var(--link-dark-color-text-primary-active)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ul{all:unset}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.li{all:unset;color:var(--list-item-light-color-text-primary-default)}.li[data-mode=dark]{color:var(--list-item-dark-color-text-primary-default)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ul{all:unset}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.li{all:unset;color:var(--list-item-light-color-text-primary-default)}.li[data-mode=dark]{color:var(--list-item-dark-color-text-primary-default)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.loader{animation:spin 1s linear infinite;border:var(--loader-size-lg-border-width) solid var(--loader-light-color-border-primary-default);border-radius:var(--loader-size-lg-border-radius);border-top:var(--loader-size-lg-border-width) solid var(--loader-light-color-border-top-primary-default);height:var(--loader-size-lg-height);width:var(--loader-size-lg-width)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
.root{display:flex}.root[data-orientation=vertical]{display:grid;row-gap:var(--spacing-xs)}.item{background-color:var(--radio-group-light-color-background-primary-default);border-color:var(--radio-group-light-color-border-primary-default);border-radius:var(--radio-group-size-md-border-radius);border-style:solid;border-width:var(--radio-group-size-md-border-width);display:inline;height:var(--radio-group-size-md-height);min-width:var(--radio-group-size-md-min-width);width:var(--radio-group-size-md-width)}.item:focus-visible{outline:var(--radio-group-outline-primary-width) solid var(--radio-group-outline-primary-fill);outline-offset:var(--radio-group-outline-primary-offset)}.item[aria-checked=true]{background-color:var(--radio-group-light-color-background-primary-active)}.item[data-size=sm]{height:var(--radio-group-size-sm-height);min-width:var(--radio-group-size-sm-min-width);width:var(--radio-group-size-sm-width)}.item[data-error=true]{background-color:var(--radio-group-light-color-background-danger-default);border-color:var(--radio-group-light-color-border-danger-default)}.item[data-disabled]{cursor:not-allowed;opacity:var(--radio-group-opacity-disabled);pointer-events:none}.item[data-mode=dark]{background-color:var(--radio-group-dark-color-background-primary-default);border-color:var(--radio-group-dark-color-border-primary-default)}.item[data-mode=dark][aria-checked=true]{background-color:var(--radio-group-dark-color-background-primary-active);border-color:var(--radio-group-dark-color-border-primary-active)}.item[data-mode=dark][data-error=true]{background-color:var(--radio-group-dark-color-background-danger-default);border-color:var(--radio-group-dark-color-border-danger-default)}.indicator{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.indicator:after{background-color:var(--color-neutral-lightest);border-radius:var(--radio-group-elements-indicator-size-md-border-radius);box-shadow:var(--radio-group-elements-indicator-shadow);content:"";display:block;height:var(--radio-group-elements-indicator-size-md-height);width:var(--radio-group-elements-indicator-size-md-width)}.indicator[data-size=sm]:after{border-radius:var(--radio-group-elements-indicator-size-sm-border-radius)}.tile{align-items:center;background-color:var(
|
|
2
|
+
--radio-group-tile-light-color-background-primary-default
|
|
3
|
+
);border:var(--radio-group-tile-size-md-border-width) solid var(--radio-group-tile-light-color-border-primary-default);border-radius:var(--radio-group-tile-size-md-border-radius);box-sizing:border-box;padding-block:var(--radio-group-tile-size-md-padding-block);padding-inline:var(--radio-group-tile-size-md-padding-inline)}.tile[data-altbackground=true]{background-color:var(
|
|
4
|
+
--radio-group-tile-light-color-background-altbackground-default
|
|
5
|
+
);border-color:var(
|
|
6
|
+
--radio-group-tile-light-color-border-altbackground-default
|
|
7
|
+
)}.tile:has(.root[data-state=checked]){background-color:var(
|
|
8
|
+
--radio-group-tile-light-color-background-primary-active
|
|
9
|
+
)}.tile[data-state=checked]{background-color:var(
|
|
10
|
+
--radio-group-tile-light-color-background-primary-active
|
|
11
|
+
);border-color:var(--radio-group-tile-light-color-border-primary-active)}.tile:not([data-state=checked]):hover{background-color:var(
|
|
12
|
+
--radio-group-tile-light-color-background-primary-hover
|
|
13
|
+
);border-color:var(--radio-group-tile-light-color-border-primary-hover)}.tile[data-mode=dark]{background-color:var(
|
|
14
|
+
--radio-group-tile-dark-color-background-primary-default
|
|
15
|
+
)}.tile[data-altbackground=checked][data-mode=dark]{background-color:var(
|
|
16
|
+
--radio-group-tile-dark-color-background-altbackground-default
|
|
17
|
+
)}.tile[data-mode=dark]:has(.root[data-state=checked]){background-color:var(
|
|
18
|
+
--radio-group-tile-dark-color-background-primary-active
|
|
19
|
+
)}.tile[data-mode=dark]:hover{background-color:var(--radio-group-tile-dark-color-background-primary-hover)}.tile[data-mode=dark][data-state=checked],.tile[data-mode=dark][data-state=checked]:hover{background-color:var(
|
|
20
|
+
--radio-group-tile-dark-color-background-primary-active
|
|
21
|
+
)}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
.root{flex-direction:column}.list,.root{display:flex}.list{border:var(--segmented-controller-elements-list-size-lg-border-width) solid var(--segmented-controller-light-elements-list-color-border-primary-default);border-radius:var(
|
|
2
|
+
--segmented-controller-elements-list-size-lg-border-radius
|
|
3
|
+
);box-sizing:border-box;column-gap:1px;width:fit-content}.trigger{align-items:center;background-color:var(
|
|
4
|
+
--segmented-controller-light-elements-trigger-color-background-primary-default
|
|
5
|
+
);color:var(--segmented-controller-trigger-color);cursor:pointer;display:flex;font:var(--segmented-controller-elements-trigger-size-lg-typography);justify-content:center;padding-block:var(
|
|
6
|
+
--segmented-controller-elements-trigger-size-lg-padding-block
|
|
7
|
+
);padding-inline:var(
|
|
8
|
+
--segmented-controller-elements-trigger-size-lg-padding-inline
|
|
9
|
+
)}.trigger:hover{color:var(
|
|
10
|
+
--segmented-controller-light-elements-trigger-color-text-primary-hover
|
|
11
|
+
)}.trigger:first-child{border-bottom-left-radius:var(
|
|
12
|
+
--segmented-controller-elements-trigger-size-lg-border-radius
|
|
13
|
+
);border-top-left-radius:var(
|
|
14
|
+
--segmented-controller-elements-trigger-size-lg-border-radius
|
|
15
|
+
)}.trigger:last-child{border-bottom-right-radius:var(
|
|
16
|
+
--segmented-controller-elements-trigger-size-lg-border-radius
|
|
17
|
+
);border-top-right-radius:var(
|
|
18
|
+
--segmented-controller-elements-trigger-size-lg-border-radius
|
|
19
|
+
)}.trigger[data-state=active]{background-color:var(
|
|
20
|
+
--segmented-controller-light-elements-trigger-color-background-primary-active
|
|
21
|
+
);border:1px solid var(--color-primary-300);border-radius:6px;box-sizing:border-box;color:var(
|
|
22
|
+
--segmented-controller-light-elements-trigger-color-text-primary-active
|
|
23
|
+
);margin:-1px}.trigger[data-size=md]{font:var(--segmented-controller-elements-trigger-size-md-typography);padding-block:var(
|
|
24
|
+
--segmented-controller-elements-trigger-size-md-padding-block
|
|
25
|
+
);padding-inline:var(
|
|
26
|
+
--segmented-controller-elements-trigger-size-md-padding-inline
|
|
27
|
+
)}.list[data-mode=dark]{background-color:var(
|
|
28
|
+
--segmented-controller-dark-elements-list-color-background-primary-default
|
|
29
|
+
);border:var(--segmented-controller-elements-list-size-lg-border-width) solid var(--segmented-controller-dark-elements-list-color-border-primary-default)}.trigger[data-mode=dark]{background-color:var(
|
|
30
|
+
--segmented-controller-dark-elements-trigger-color-background-primary-default
|
|
31
|
+
);border-color:var(
|
|
32
|
+
--segmented-controller-dark-elements-trigger-color-border-primary-default
|
|
33
|
+
);color:var(
|
|
34
|
+
--segmented-controller-dark-elements-trigger-color-text-primary-default
|
|
35
|
+
)}.trigger[data-mode=dark]:hover{color:var(
|
|
36
|
+
--segmented-controller-dark-elements-trigger-color-text-primary-hover
|
|
37
|
+
)}.trigger[data-mode=dark][data-state=active]{background-color:var(
|
|
38
|
+
--segmented-controller-dark-elements-trigger-color-background-primary-active
|
|
39
|
+
);border-color:var(
|
|
40
|
+
--segmented-controller-dark-elements-trigger-color-border-primary-active
|
|
41
|
+
);color:var(
|
|
42
|
+
--segmented-controller-dark-elements-trigger-color-text-primary-active
|
|
43
|
+
)}.content{background-color:var(
|
|
44
|
+
--segmented-controller-light-elements-trigger-color-background-primary-default
|
|
45
|
+
);border:var(--segmented-controller-elements-content-size-lg-border-width) solid var(
|
|
46
|
+
--segmented-controller-light-elements-content-color-border-primary-default
|
|
47
|
+
);border-radius:var(
|
|
48
|
+
--segmented-controller-elements-content-size-lg-border-radius
|
|
49
|
+
);flex-shrink:1;margin-top:var(
|
|
50
|
+
--segmented-controller-elements-content-size-lg-margin-block-start
|
|
51
|
+
);outline:none;padding:var(--segmented-controller-elements-content-size-lg-padding);width:auto}.content:focus{border:var(--segmented-controller-elements-content-size-lg-border-width) solid var(
|
|
52
|
+
--segmented-controller-light-elements-content-color-border-primary-default
|
|
53
|
+
)}.content[data-mode=dark]{background-color:var(
|
|
54
|
+
--segmented-controller-dark-elements-content-color-background-primary-default
|
|
55
|
+
);border-color:var(
|
|
56
|
+
--segmented-controller-dark-elements-content-color-border-primary-default
|
|
57
|
+
)}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
.trigger{align-items:center;background-color:var(
|
|
2
|
+
--select-light-elements-trigger-color-background-primary-default
|
|
3
|
+
);border-color:var(
|
|
4
|
+
--select-light-elements-trigger-color-border-primary-default
|
|
5
|
+
);border-radius:var(--select-elements-trigger-size-xl-border-radius);border-style:solid;border-width:var(--select-elements-trigger-size-xl-border-width);box-sizing:border-box;display:inline-flex;justify-content:space-between;max-height:var(--select-elements-trigger-size-xl-max-height);padding-block:var(--select-elements-trigger-size-xl-padding-block);padding-inline:var(--select-elements-trigger-size-xl-padding-inline);width:var(--select-elements-trigger-size-xl-width)}.trigger[data-disabled]{opacity:var(--select-elements-trigger-opacity-disabled);pointer-events:none;user-select:none}.trigger[data-altbackground=true]{background-color:var(
|
|
6
|
+
--select-light-elements-trigger-color-background-altbackground-default
|
|
7
|
+
)}.trigger[data-error=true]{background-color:var(
|
|
8
|
+
--select-light-elements-trigger-color-background-danger-default
|
|
9
|
+
);border-color:var(
|
|
10
|
+
--select-light-elements-trigger-color-border-danger-default
|
|
11
|
+
)}.trigger:focus-visible[data-error=true]{border-color:var(--select-light-elements-trigger-color-border-danger-focus);box-shadow:var(--select-light-elements-trigger-color-shadow-danger-focus)}.trigger:focus-visible{border-color:var(--select-light-elements-trigger-color-border-primary-focus);box-shadow:var(--select-light-elements-trigger-color-shadow-primary-focus)}.trigger[data-size=md]{max-height:var(--select-elements-trigger-size-md-max-height);padding-block:var(--select-elements-trigger-size-md-padding-block);padding-inline:var(--select-elements-trigger-size-md-padding-inline)}.trigger[data-size=lg]{max-height:var(--select-elements-trigger-size-lg-max-height);padding-block:var(--select-elements-trigger-size-lg-padding-block);padding-inline:var(--select-elements-trigger-size-lg-padding-inline)}.content{--select-dropdown-menu-width:var(--radix-dropdown-menu-width);background-color:var(
|
|
12
|
+
--select-light-elements-content-color-background-primary-default
|
|
13
|
+
);border-color:var(
|
|
14
|
+
--select-light-elements-content-color-border-primary-default
|
|
15
|
+
);border-radius:var(--select-elements-content-size-lg-border-radius);border-style:solid;border-width:var(--select-elements-content-size-lg-border-width);max-height:var(--select-elements-content-size-lg-max-height);max-width:var(--select-elements-content-size-lg-max-width);overflow-y:auto;position:relative;width:var(--radix-dropdown-menu-trigger-width);z-index:var(--select-elements-content-size-lg-z-index)}.content::-webkit-scrollbar{background-color:var(
|
|
16
|
+
--select-light-elements-content-scrollbar-color-background-primary-default
|
|
17
|
+
);border:var(--select-elements-content-scrollbar-size-lg-border-width) solid var(--select-light-elements-content-scrollbar-color-border-primary-default);border-radius:var(--select-elements-content-scrollbar-size-lg-border-radius);border-right:none;width:var(--select-elements-content-scrollbar-size-lg-width)}.content::-webkit-scrollbar-thumb{background-color:var(
|
|
18
|
+
--select-light-elements-content-scrollbar-thumb-color-background-primary-default
|
|
19
|
+
);border-color:var(
|
|
20
|
+
--select-light-elements-content-scrollbar-thumb-color-border-primary-default
|
|
21
|
+
);border-radius:var(--select-elements-content-scrollbar-size-lg-border-radius);border-style:solid;border-width:var(--select-elements-content-scrollbar-size-lg-border-width);height:var(--select-elements-content-scrollbar-thumb-size-lg-height)}.item{background-color:var(
|
|
22
|
+
--select-light-elements-menu-item-color-background-primary-default
|
|
23
|
+
);display:flex;gap:var(--select-elements-menu-item-gap-default);outline:none;padding-block:var(--select-elements-menu-item-size-lg-padding-block);padding-inline:var(--select-elements-menu-item-size-lg-padding-inline)}.item[data-disabled]{opacity:var(--select-elements-menu-item-opacity-disabled)}.item-checkbox[data-highlighted],.item-radio[data-highlighted],.item[data-highlighted],.sub-trigger[data-highlighted]{background-color:var(
|
|
24
|
+
--select-light-elements-menu-item-color-background-primary-hover
|
|
25
|
+
)}.item[aria-checked=true],.item[data-state=checked]{background-color:var(
|
|
26
|
+
--select-light-elements-menu-item-color-background-primary-active
|
|
27
|
+
)}.separator{background-color:var(
|
|
28
|
+
--select-light-elements-separtor-color-background-primary-default
|
|
29
|
+
);height:var(--select-elements-separator-size-lg-height)}.info{color:var(--select-light-elements-info-color-text-primary-default);font:var(--select-elements-info-size-lg-typography);margin:0 0 0 auto}.trigger[data-mode=dark]{background-color:var(
|
|
30
|
+
--select-dark-elements-trigger-color-background-primary-default
|
|
31
|
+
);border-color:var(
|
|
32
|
+
--select-dark-elements-trigger-color-border-primary-default
|
|
33
|
+
)}.trigger[data-mode=dark][data-altbackground=true]{background-color:var(
|
|
34
|
+
--select-dark-elements-trigger-color-background-altbackground-default
|
|
35
|
+
)}.trigger[data-mode=dark][data-error=true]{background-color:var(
|
|
36
|
+
--select-dark-elements-trigger-color-background-danger-default
|
|
37
|
+
);border-color:var(--select-dark-elements-trigger-color-border-danger-default)}.trigger:focus-visible[data-mode=dark][data-error=true]{border-color:var(--select-dark-elements-trigger-color-border-danger-focus);focus-color:var(--select-dark-elements-trigger-color-shadow-danger-focus)}.trigger[data-mode=dark]:focus-visible{border-color:var(--select-dark-elements-trigger-color-border-primary-focus);box-shadow:var(--select-dark-elements-trigger-color-shadow-primary-focus)}.content[data-mode=dark]{background-color:var(
|
|
38
|
+
--select-dark-elements-content-color-background-primary-default
|
|
39
|
+
);border-color:var(
|
|
40
|
+
--select-dark-elements-content-color-border-primary-default
|
|
41
|
+
)}.content[data-mode=dark]::-webkit-scrollbar{background-color:var(
|
|
42
|
+
--select-dark-elements-content-scrollbar-color-background-primary-default
|
|
43
|
+
);border-color:var(
|
|
44
|
+
--select-dark-elements-content-scrollbar-color-border-primary-default
|
|
45
|
+
)}.content[data-mode=dark]::-webkit-scrollbar-thumb{background-color:var(
|
|
46
|
+
--select-dark-elements-content-scrollbar-thumb-color-background-primary-default
|
|
47
|
+
);border-color:var(
|
|
48
|
+
--select-dark-elements-content-scrollbar-thumb-color-border-primary-default
|
|
49
|
+
)}.item[data-mode=dark]{background-color:var(
|
|
50
|
+
--select-dark-elements-menu-item-color-background-primary-default
|
|
51
|
+
);color:var(--select-dark-elements-menu-item-color-text-primary-default)}.item[data-disabled][data-mode=dark]{opacity:var(--select-elements-menu-item-opacity-disabled)}.item-checkbox[data-highlighted][data-mode=dark],.item-radio[data-highlighted][data-mode=dark],.item[data-highlighted][data-mode=dark],.sub-trigger[data-highlighted][data-mode=dark]{background-color:var(
|
|
52
|
+
--select-dark-elements-menu-item-color-background-primary-hover
|
|
53
|
+
)}.item[aria-checked=true][data-mode=dark],.item[data-state=checked][data-mode=dark]{background-color:var(
|
|
54
|
+
--select-dark-elements-menu-item-color-background-primary-active
|
|
55
|
+
)}.info[data-mode=dark]{color:var(--select-dark-elements-info-color-text-primary-default)}.icon{align-self:baseline;min-height:var(--select-elements-icon-size-md-min-height);min-width:var(--select-elements-icon-size-md-min-height)}.heading{color:var(--select-light-elements-heading-color-text-primary-default);display:inline-block;font:var(--select-elements-heading-size-sm-typography);padding-block:var(--select-elements-heading-size-sm-padding-block);padding-inline:var(--select-elements-heading-size-sm-padding-inline)}.heading[data-mode=dark]{color:var(--select-dark-elements-heading-color-text-primary-default)}.label{color:var(--select-light-elements-label-color-text-primary-default)}.label,.label[data-mode=dark]{font:var(--select-elements-label-size-sm-typography)}.label[data-mode=dark]{color:var(--select-dark-elements-label-color-text-primary-default)}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
.root{background-color:var(--switch-light-color-background-primary-default);border-color:var(--switch-light-color-border-primary-default);border-radius:var(--switch-size-md-border-radius);border-style:solid;border-width:var(--switch-size-md-border-width);box-sizing:border-box;cursor:pointer;height:var(--switch-size-md-height);transition:background-color .2s ease-in-out,border-color .2s ease-in-out;width:var(--switch-size-md-width)}.root:focus-visible{outline-color:var(--switch-outline-primary-fill);outline-offset:var(--switch-outline-primary-offset);outline-style:solid;outline-width:var(--switch-outline-primary-width)}.root:hover{background-color:var(--switch-light-color-background-primary-hover);cursor:pointer}.root:disabled{opacity:var(--switch-opacity-disabled);pointer-events:none}.root[data-state=checked]{background-color:var(--switch-light-color-background-primary-active);border-color:var(--switch-light-color-border-primary-active)}.root[data-size=sm]{height:var(--switch-size-sm-height);width:var(--switch-size-sm-width)}.thumb{background-color:var(
|
|
2
|
+
--switch-light-elements-thumb-color-background-primary-default
|
|
3
|
+
);border-color:var(--switch-light-elements-thumb-color-border-primary-default);border-radius:var(--switch-elements-thumb-size-md-border-radius);border-style:solid;border-width:var(--switch-elements-thumb-size-md-border-width);display:block;height:var(--switch-elements-thumb-size-md-height);transform:translateX(-1px) translateY(-1px);transition:transform .2s ease-in-out,border-color .2s ease-in-out;width:var(--switch-elements-thumb-size-md-width);will-change:transform}.thumb[data-state=checked]{border-color:var(--switch-light-elements-thumb-color-border-primary-active);transform:translateX(19px) translateY(-1px)}.thumb[data-size=sm]{height:var(--switch-elements-thumb-size-sm-height);width:var(--switch-elements-thumb-size-sm-width)}.thumb[data-size=sm][data-state=checked]{transform:translateX(16px) translateY(-1px)}.root[data-mode=dark]{background-color:var(--switch-color-background-primary-default);border-color:var(--switch-color-border-primary-default)}.root[data-mode=dark]:hover{background-color:var(--switch-color-background-primary-hover)}.root[data-mode=dark][data-state=checked]{background-color:var(--switch-color-background-primary-active);border-color:var(--switch-color-border-primary-active)}.root[data-mode=dark]:focus-visible{outline-color:var(--switch-color-outline-primary-fill)}.thumb[data-mode=dark][data-state=checked]{border-color:var(--switch-dark-elements-thumb-border-primary-active)}.thumb[data-mode=dark]{border-color:var(--switch-dark-elements-thumb-border-primary-default)}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
.table{border-collapse:separate;border-spacing:0;width:100%}.container{background-color:var(
|
|
2
|
+
--table-light-elements-container-color-background-primary-default
|
|
3
|
+
);border-color:var(
|
|
4
|
+
--table-light-elements-container-color-border-primary-default
|
|
5
|
+
);border-radius:var(--table-elements-container-size-2xl-border-radius);border-style:solid;border-width:var(--table-elements-container-size-2xl-border-width);max-height:var(--table-elements-container-size-2xl-max-height);min-height:auto;overflow:auto}.container::-webkit-scrollbar{background-color:var(
|
|
6
|
+
--table-light-elements-container-scrollbar-color-background-primary-default
|
|
7
|
+
);border-color:var(
|
|
8
|
+
--table-light-elements-container-scrollbar-color-border-primary-default
|
|
9
|
+
);border-radius:var(
|
|
10
|
+
--table-elements-container-scrollbar-size-2xl-border-radius
|
|
11
|
+
);border-style:solid;border-width:var(--table-elements-container-scrollbar-size-2xl-border-width);border-right:none;width:var(--table-elements-container-scrollbar-size-2xl-width)}.container::-webkit-scrollbar-thumb{background-color:var(
|
|
12
|
+
--table-light-elements-container-scrollbar-thumb-color-background-primary-default
|
|
13
|
+
);border-color:var(
|
|
14
|
+
--table-light-elements-container-scrollbar-thumb-color-border-primary-default
|
|
15
|
+
);border-radius:var(
|
|
16
|
+
--table-elements-container-scrollbar-size-2xl-border-radius
|
|
17
|
+
);border-style:solid;border-width:var(
|
|
18
|
+
--table-elements-container-scrollbar-thumb-size-2xl-border-width
|
|
19
|
+
);height:var(--table-elements-container-scrollbar-thumb-size-2xl-height)}.container[data-mode=dark]{background-color:var(
|
|
20
|
+
--table-dark-elements-container-color-background-primary-default
|
|
21
|
+
);border-color:var(
|
|
22
|
+
--table-dark-elements-container-color-border-primary-default
|
|
23
|
+
)}.container[data-mode=dark]::-webkit-scrollbar{background-color:var(
|
|
24
|
+
--table-dark-elements-container-scrollbar-color-background-primary-default
|
|
25
|
+
);border-color:var(
|
|
26
|
+
--table-dark-elements-container-scrollbar-color-border-primary-default
|
|
27
|
+
)}.container[data-mode=dark]::-webkit-scrollbar-thumb{background-color:var(
|
|
28
|
+
--table-dark-elements-container-scrollbar-thumb-color-background-primary-default
|
|
29
|
+
);border-color:var(
|
|
30
|
+
--table-dark-elements-container-scrollbar-thumb-color-border-primary-default
|
|
31
|
+
)}.tr{background-color:var(
|
|
32
|
+
--table-light-elements-tr-color-background-primary-default
|
|
33
|
+
);transition:background-color .2s ease-in-out}.tr:not(:last-child)>*{border-block-end:var(--table-elements-td-size-2xl-border-width) solid var(--table-light-elements-td-color-border-primary-default)}.tr[data-mode=dark]:not(:last-child)>*{border-block-end:var(--table-elements-td-size-2xl-border-width) solid var(--table-dark-elements-td-color-border-primary-default)}.tr:hover{background-color:var(
|
|
34
|
+
--table-light-elements-tr-color-background-primary-hover
|
|
35
|
+
)}.tr[data-mode=dark]{background-color:var(
|
|
36
|
+
--table-dark-elements-tr-color-background-primary-default
|
|
37
|
+
)}.tr[data-mode=dark]:hover{background-color:var(
|
|
38
|
+
--table-dark-elements-tr-color-background-primary-hover
|
|
39
|
+
)}.tr[data-striped]:nth-child(2n){background-color:var(
|
|
40
|
+
--table-light-elements-tr-color-background-striped-default
|
|
41
|
+
)}.tr[data-mode=dark][data-striped]:nth-child(2n){background-color:var(
|
|
42
|
+
--table-dark-elements-tr-color-background-striped-default
|
|
43
|
+
)}.tr[data-striped]:hover{background-color:var(
|
|
44
|
+
--table-light-elements-tr-color-background-striped-hover
|
|
45
|
+
)}.tr[data-mode=dark][data-striped]:hover{background-color:var(
|
|
46
|
+
--table-dark-elements-tr-color-background-striped-hover
|
|
47
|
+
)}.th{background-color:var(
|
|
48
|
+
--table-light-elements-th-color-background-primary-default
|
|
49
|
+
);border-bottom:var(--table-elements-th-size-xl-border-bottom-width) solid var(
|
|
50
|
+
--table-light-elements-th-color-border-bottom-primary-default
|
|
51
|
+
);color:var(--table-light-elements-th-color-text-primary-default);font:var(--table-elements-th-size-xl-typography);height:var(--table-elements-th-size-xl-max-height);padding-block-end:var(--table-elements-th-size-xl-padding-block-end);padding-block-start:var(--table-elements-th-size-xl-padding-block-start);padding-inline:var(--table-elements-th-size-xl-padding-inline);text-align:left}.th[data-mode=dark]{background-color:var(
|
|
52
|
+
--table-dark-elements-th-color-background-primary-default
|
|
53
|
+
);border-bottom-color:var(
|
|
54
|
+
--table-dark-elements-th-color-border-bottom-primary-default
|
|
55
|
+
);color:var(--table-dark-elements-th-color-text-primary-default)}.th[data-size="2xl"]{font:var(--table-elements-th-size-2xl-typography);height:var(--table-elements-th-size-2xl-max-height);padding-block-end:var(--table-elements-th-size-2xl-padding-block-end);padding-block-start:var(--table-elements-th-size-2xl-padding-block-start)}.th[data-background=none]{background-color:var(
|
|
56
|
+
--table-light-elements-th-color-background-altbackground-default
|
|
57
|
+
)}.th[data-align=center]{text-align:center}.th[data-align=right]{text-align:right}.th[data-mode=dark][data-background=none]{background-color:var(
|
|
58
|
+
--table-dark-elements-th-color-background-altbackground-default
|
|
59
|
+
)}.td{box-sizing:border-box;color:var(--table-light-elements-td-color-text-primary-default);font:var(--table-elements-td-size-2xl-typography);height:var(--table-elements-td-size-2xl-max-height);padding-inline:var(--table-elements-td-size-2xl-padding-inline)}.td[data-size=xl]{font:var(--table-elements-td-size-xl-typography);height:var(--table-elements-td-size-xl-max-height)}.td[data-size=lg]{font:var(--table-elements-td-size-lg-typography);height:var(--table-elements-td-size-lg-max-height);line-height:var(--line-heights-3xs);padding-inline-start:var(--table-elements-td-size-lg-padding-inline)}.td[data-mode=dark]{color:var(--table-dark-elements-td-color-text-primary-default)}.actions{align-items:center;background-color:var(
|
|
60
|
+
--table-light-elements-actions-color-background-primary-default
|
|
61
|
+
);border-color:var(
|
|
62
|
+
--table-light-elements-actions-color-border-primary-default
|
|
63
|
+
);border-radius:var(--table-elements-actions-2xl-border-radius);border-style:solid;border-width:var(--table-elements-actions-2xl-border-width);box-sizing:border-box;display:flex;height:var(--table-elements-actions-2xl-height);justify-content:flex-end;padding-inline-end:var(--table-elements-actions-2xl-padding-inline-end)}.actions[data-altbackground=true]{background-color:var(
|
|
64
|
+
--table-light-elements-actions-color-altbackground-primary-default
|
|
65
|
+
)}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
.root{flex-direction:column}.list,.root{display:flex}.list{column-gap:var(--tabs-elements-list-gap-default);flex-shrink:0}.list[data-border]{border-block-end-color:var(
|
|
2
|
+
--tabs-light-elements-list-color-border-primary-default
|
|
3
|
+
);border-block-end-style:solid;border-block-end-width:var(--tabs-elements-list-size-lg-border-bottom-width)}.list[data-mode=dark][data-border]{border-color:var(--tabs-dark-elements-list-color-border-primary-default)}.trigger{align-items:center;background-color:var(--tabs-trigger-background-color);border-block-end-color:var(
|
|
4
|
+
--tabs-light-elements-trigger-color-border-primary-default
|
|
5
|
+
);border-block-end-style:solid;border-block-end-width:var(--tabs-elements-trigger-size-lg-border-width);box-sizing:border-box;color:var(--tabs-trigger-color);cursor:pointer;display:flex;font:var(--tabs-elements-trigger-size-lg-typography);height:var(--tabs-elements-trigger-size-lg-max-height);justify-content:center;padding-block-end:var(--tabs-elements-trigger-size-lg-padding-block-end)}.trigger:hover{color:var(--tabs-light-elements-trigger-color-text-primary-hover)}.trigger[data-state=active]{border-color:var(--tabs-light-elements-trigger-color-border-primary-active);box-sizing:border-box;color:var(--tabs-light-elements-trigger-color-text-primary-active)}.trigger[data-size=xl]{font:var(--tabs-elements-trigger-size-xl-typography);height:var(--tabs-elements-trigger-size-xl-max-height)}.trigger[data-mode=dark]{color:var(--tabs-dark-elements-trigger-color-text-primary-default)}.trigger[data-mode=dark]:hover{color:var(--tabs-dark-elements-trigger-color-text-primary-hover)}.trigger[data-mode=dark][data-state=active]{color:var(--tabs-dark-elements-trigger-color-text-primary-active)}.content{background-color:var(
|
|
6
|
+
--tabs-light-elements-trigger-color-background-primary-default
|
|
7
|
+
);border:var(--tabs-elements-content-size-lg-border-width) solid var(--tabs-light-elements-content-color-border-primary-default);border-radius:var(--tabs-elements-content-size-lg-border-radius);flex-shrink:1;margin-top:var(--tabs-elements-content-size-lg-margin-block-start);outline:none;padding:var(--tabs-elements-content-size-lg-padding);width:auto}.content:focus{border:var(--tabs-elements-content-size-lg-border-width) solid var(--tabs-light-elements-content-color-border-primary-default)}.content[data-mode=dark]{background-color:var(
|
|
8
|
+
--tabs-dark-elements-content-color-background-primary-default
|
|
9
|
+
);border-color:var(--tabs-dark-elements-content-color-border-primary-default)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kofile/gds-foundations",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.19",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "build/css/index.css",
|
|
6
6
|
"exports": {
|
|
@@ -9,8 +9,8 @@
|
|
|
9
9
|
"require": "./build/css/animations/index.css"
|
|
10
10
|
},
|
|
11
11
|
".": {
|
|
12
|
-
"import": "./build/css/index.css",
|
|
13
|
-
"require": "./build/css/index.css"
|
|
12
|
+
"import": "./build/css/themes/index.css",
|
|
13
|
+
"require": "./build/css/themes/index.css"
|
|
14
14
|
},
|
|
15
15
|
"./font": {
|
|
16
16
|
"import": "./build/css/fonts.css",
|
|
@@ -44,14 +44,6 @@
|
|
|
44
44
|
"import": "./build/css/themes/global.css",
|
|
45
45
|
"require": "./build/css/themes/global.css"
|
|
46
46
|
},
|
|
47
|
-
"./tokens": {
|
|
48
|
-
"import": "./build/css/tokens-global.css",
|
|
49
|
-
"require": "./build/css/tokens-global.css"
|
|
50
|
-
},
|
|
51
|
-
"./utilities": {
|
|
52
|
-
"import": "./build/css/utilities/index.css",
|
|
53
|
-
"require": "./build/css/utilities/index.css"
|
|
54
|
-
},
|
|
55
47
|
"./components/badge.module.css": {
|
|
56
48
|
"import": "./build/css/components/badge.module.css",
|
|
57
49
|
"require": "./build/css/components/badge.module.css"
|