@cds/core 6.10.0 → 6.11.0
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/accordion/accordion-header.element.scss.js +1 -1
- package/accordion/accordion-panel.element.scss.js +1 -1
- package/global.css +12 -8
- package/global.min.css +1 -1
- package/grid/row/grid-row.element.scss.js +1 -1
- package/internal/utils/global.js +1 -1
- package/navigation/navigation-item.element.scss.js +1 -1
- package/package.json +1 -1
- package/select/select.global.scss.js +1 -1
- package/selection-panels/shared/selection-panel.element.scss.js +1 -1
- package/styles/module.tokens.css +12 -8
- package/styles/module.tokens.min.css +1 -1
- package/styles/theme.dark.css +7 -4
- package/styles/theme.dark.min.css +1 -1
- package/tokens/tokens.android.xml +14 -10
- package/tokens/tokens.d.ts +4 -0
- package/tokens/tokens.ios.swift +14 -10
- package/tokens/tokens.js +4 -0
- package/tokens/tokens.json +43 -17
- package/tokens/tokens.scss +4 -0
- package/tree-view/tree-item.element.scss.js +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{css as o}from"lit";var a=o`:host{--color:var(--cds-alias-object-interaction-color, var(--cds-global-color-construction-700, #3a4d55));--background:var(--cds-alias-object-container-background-tint, var(--cds-global-color-construction-50, #f1f6f8));--font-size:var(--cds-global-typography-secondary-font-size, calc(13 * 1rem / var(--cds-global-base, 20)));--font-weight:var(--cds-global-typography-secondary-font-weight, 400);--padding:calc(var(--cds-global-space-5, calc(8 * 1rem / var(--cds-global-base, 20))) + var(--cds-global-space-2, calc(2 * 1rem / var(--cds-global-base, 20))));--box-shadow:0;--icon-visibility:visible;--icon-margin:0;cursor:pointer;width:100%;contain:inherit}.private-host{background:var(--background);padding:var(--padding);cursor:inherit;border:0;font-size:var(--font-size);font-weight:var(--font-weight);color:var(--color);box-shadow:var(--box-shadow)}.expand-button{visibility:var(--icon-visibility);margin:var(--icon-margin)}:host(:hover){--color:var(--cds-alias-object-interaction-color-hover, var(--cds-global-color-construction-1000, #1b2b32));--background:var(--cds-alias-object-interaction-background-hover, var(--cds-global-color-
|
|
1
|
+
import{css as o}from"lit";var a=o`:host{--color:var(--cds-alias-object-interaction-color, var(--cds-global-color-construction-700, #3a4d55));--background:var(--cds-alias-object-container-background-tint, var(--cds-global-color-construction-50, #f1f6f8));--font-size:var(--cds-global-typography-secondary-font-size, calc(13 * 1rem / var(--cds-global-base, 20)));--font-weight:var(--cds-global-typography-secondary-font-weight, 400);--padding:calc(var(--cds-global-space-5, calc(8 * 1rem / var(--cds-global-base, 20))) + var(--cds-global-space-2, calc(2 * 1rem / var(--cds-global-base, 20))));--box-shadow:0;--icon-visibility:visible;--icon-margin:0;cursor:pointer;width:100%;contain:inherit}.private-host{background:var(--background);padding:var(--padding);cursor:inherit;border:0;font-size:var(--font-size);font-weight:var(--font-weight);color:var(--color);box-shadow:var(--box-shadow)}.expand-button{visibility:var(--icon-visibility);margin:var(--icon-margin)}:host(:hover){--color:var(--cds-alias-object-interaction-color-hover, var(--cds-global-color-construction-1000, #1b2b32));--background:var(--cds-alias-object-interaction-background-hover, var(--cds-global-color-construction-50, #f1f6f8))}:host(:active){--color:var(--cds-alias-object-interaction-color-active, var(--cds-global-color-construction-1000, #1b2b32));--background:var(--cds-alias-object-interaction-background-active, var(--cds-global-color-construction-100, #e3eaed))}`;export{a as default};
|
|
2
2
|
//# sourceMappingURL=accordion-header.element.scss.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{css as o}from"lit";var a=o`:host{--animation-duration:var(--cds-global-animation-duration-secondary, 0.3s);--animation-easing:var(--cds-global-animation-easing-primary, cubic-bezier(0, 0.99, 0, 0.99));contain:inherit}.accordion-header-button{background:var(--cds-alias-object-opacity-0,rgba(0,0,0,0));border:0;padding:0;width:100%}.accordion-content{overflow-y:hidden}:host([cds-motion=off]) .accordion-content{height:0}:host([cds-motion=off][expanded]) .accordion-content{height:auto}:host([cds-motion][_cds-animation-status=ready]:not([cds-motion=off])) .accordion-content{height:0}:host([cds-motion][expanded][_cds-animation-status=ready]:not([cds-motion=off])) .accordion-content{height:auto!important;transform:none}:host([expanded]) .accordion-content{box-shadow:0 calc(-1*var(--border-width)) 0 0 var(--border-color);margin-top:var(--border-width)}:host([expanded]) ::slotted(cds-accordion-header){--background:var(--cds-alias-object-interaction-background-selected, var(--cds-global-color-blue-
|
|
1
|
+
import{css as o}from"lit";var a=o`:host{--animation-duration:var(--cds-global-animation-duration-secondary, 0.3s);--animation-easing:var(--cds-global-animation-easing-primary, cubic-bezier(0, 0.99, 0, 0.99));contain:inherit}.accordion-header-button{background:var(--cds-alias-object-opacity-0,rgba(0,0,0,0));border:0;padding:0;width:100%}.accordion-content{overflow-y:hidden}:host([cds-motion=off]) .accordion-content{height:0}:host([cds-motion=off][expanded]) .accordion-content{height:auto}:host([cds-motion][_cds-animation-status=ready]:not([cds-motion=off])) .accordion-content{height:0}:host([cds-motion][expanded][_cds-animation-status=ready]:not([cds-motion=off])) .accordion-content{height:auto!important;transform:none}:host([expanded]) .accordion-content{box-shadow:0 calc(-1*var(--border-width)) 0 0 var(--border-color);margin-top:var(--border-width)}:host([expanded]) ::slotted(cds-accordion-header){--background:var(--cds-alias-object-interaction-background-selected, var(--cds-global-color-blue-75, #e0f6ff))}:host([disabled]) ::slotted(cds-accordion-header){--background:var(--cds-alias-object-container-background-tint, var(--cds-global-color-construction-50, #f1f6f8));--color:var(--cds-alias-object-interaction-color-disabled, var(--cds-global-color-construction-300, #aeb8bc));cursor:not-allowed}`;export{a as default};
|
|
2
2
|
//# sourceMappingURL=accordion-panel.element.scss.js.map
|
package/global.css
CHANGED
|
@@ -85,8 +85,8 @@
|
|
|
85
85
|
--cds-global-color-red-600: hsl(9, 100%, 59%);
|
|
86
86
|
--cds-global-color-red-700: hsl(9, 100%, 44%);
|
|
87
87
|
--cds-global-color-red-800: hsl(9, 100%, 38%);
|
|
88
|
-
--cds-global-color-red-900: hsl(9, 100%,
|
|
89
|
-
--cds-global-color-red-1000: hsl(
|
|
88
|
+
--cds-global-color-red-900: hsl(9, 100%, 28%);
|
|
89
|
+
--cds-global-color-red-1000: hsl(9, 100%, 22%);
|
|
90
90
|
--cds-global-color-ochre-50: hsl(41, 100%, 96%);
|
|
91
91
|
--cds-global-color-ochre-100: hsl(41, 100%, 92%);
|
|
92
92
|
--cds-global-color-ochre-200: hsl(41, 100%, 86%);
|
|
@@ -140,8 +140,8 @@
|
|
|
140
140
|
--cds-global-color-jade-600: hsl(160, 69%, 36%);
|
|
141
141
|
--cds-global-color-jade-700: hsl(160, 64%, 30%);
|
|
142
142
|
--cds-global-color-jade-800: hsl(160, 100%, 21%);
|
|
143
|
-
--cds-global-color-jade-900: hsl(160, 70%,
|
|
144
|
-
--cds-global-color-jade-1000: hsl(160, 69%,
|
|
143
|
+
--cds-global-color-jade-900: hsl(160, 70%, 18%);
|
|
144
|
+
--cds-global-color-jade-1000: hsl(160, 69%, 14%);
|
|
145
145
|
--cds-global-color-yellow-50: hsl(50, 100%, 95%);
|
|
146
146
|
--cds-global-color-yellow-100: hsl(50, 100%, 84%);
|
|
147
147
|
--cds-global-color-yellow-200: hsl(50, 100%, 73%);
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
--cds-global-color-yellow-700: hsl(40, 100%, 37%);
|
|
153
153
|
--cds-global-color-yellow-800: hsl(40, 100%, 26%);
|
|
154
154
|
--cds-global-color-yellow-900: hsl(40, 100%, 18%);
|
|
155
|
-
--cds-global-color-yellow-1000: hsl(40,
|
|
155
|
+
--cds-global-color-yellow-1000: hsl(40, 100%, 13%);
|
|
156
156
|
--cds-global-color-lime-50: hsl(66, 100%, 94%);
|
|
157
157
|
--cds-global-color-lime-100: hsl(66, 95%, 83%);
|
|
158
158
|
--cds-global-color-lime-200: hsl(66, 85%, 70%);
|
|
@@ -264,6 +264,7 @@
|
|
|
264
264
|
--cds-global-color-construction-800: hsl(198, 23%, 23%);
|
|
265
265
|
--cds-global-color-construction-900: hsl(198, 28%, 18%);
|
|
266
266
|
--cds-global-color-construction-1000: hsl(198, 30%, 15%);
|
|
267
|
+
--cds-global-color-construction-1100: hsl(200, 31%, 13%);
|
|
267
268
|
--cds-global-color-gray-0: hsl(0, 0%, 100%);
|
|
268
269
|
--cds-global-color-gray-50: hsl(0, 0%, 98%);
|
|
269
270
|
--cds-global-color-gray-100: hsl(0, 0%, 95%);
|
|
@@ -395,9 +396,11 @@
|
|
|
395
396
|
--cds-alias-object-interaction-touch-target: calc(36 * (1rem / var(--cds-global-base)));
|
|
396
397
|
--cds-alias-object-interaction-border-color: var(--cds-global-color-construction-500);
|
|
397
398
|
--cds-alias-object-interaction-background: var(--cds-global-color-white);
|
|
398
|
-
--cds-alias-object-interaction-background-hover: var(--cds-global-color-
|
|
399
|
-
--cds-alias-object-interaction-background-active: var(--cds-global-color-
|
|
400
|
-
--cds-alias-object-interaction-background-selected: var(--cds-global-color-blue-
|
|
399
|
+
--cds-alias-object-interaction-background-hover: var(--cds-global-color-construction-50);
|
|
400
|
+
--cds-alias-object-interaction-background-active: var(--cds-global-color-construction-100);
|
|
401
|
+
--cds-alias-object-interaction-background-selected: var(--cds-global-color-blue-75);
|
|
402
|
+
--cds-alias-object-interaction-background-selected-hover: var(--cds-global-color-construction-100);
|
|
403
|
+
--cds-alias-object-interaction-background-selected-active: var(--cds-global-color-construction-200);
|
|
401
404
|
--cds-alias-object-interaction-background-disabled: var(--cds-global-color-white);
|
|
402
405
|
--cds-alias-object-interaction-background-highlight: var(--cds-global-color-blue-700);
|
|
403
406
|
--cds-alias-object-interaction-color: var(--cds-global-color-construction-700);
|
|
@@ -432,6 +435,7 @@
|
|
|
432
435
|
--cds-alias-object-container-background-inverse: var(--cds-global-color-construction-200);
|
|
433
436
|
--cds-alias-object-container-background-inverse-tint: var(--cds-global-color-construction-100);
|
|
434
437
|
--cds-alias-object-container-background-inverse-shade: var(--cds-global-color-construction-300);
|
|
438
|
+
--cds-alias-object-container-backdrop-background: hsla(0, 0%, 100%, 0.6);
|
|
435
439
|
--cds-alias-object-container-border-color: var(--cds-global-color-construction-200);
|
|
436
440
|
--cds-alias-status-info: var(--cds-global-color-blue-700);
|
|
437
441
|
--cds-alias-status-info-tint: var(--cds-global-color-blue-50);
|