@zohodesk/components 1.0.0-temp-254 → 1.0.0-temp-253.1
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 +3 -4
- package/assets/Appearance/dark/mode/Component_DarkMode.module.css +4 -4
- package/assets/Appearance/light/mode/Component_LightMode.module.css +6 -6
- package/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css +3 -3
- package/es/DropBox/DropBoxElement/DropBoxElement.js +21 -11
- package/es/DropBox/DropBoxElement/css/DropBoxElement.module.css +5 -3
- package/es/DropBox/DropBoxElement/props/propTypes.js +2 -1
- package/es/ResponsiveDropBox/ResponsiveDropBox.js +6 -7
- package/lib/DropBox/DropBoxElement/DropBoxElement.js +22 -11
- package/lib/DropBox/DropBoxElement/css/DropBoxElement.module.css +5 -3
- package/lib/DropBox/DropBoxElement/props/propTypes.js +2 -1
- package/lib/ResponsiveDropBox/ResponsiveDropBox.js +5 -6
- package/package.json +23 -21
- package/assets/Appearance/dark/themes/blue/blue_componentsCTA_DarkModifyCategory.module.css +0 -14
- package/assets/Appearance/dark/themes/green/green_componentsCTA_DarkModifyCategory.module.css +0 -14
- package/assets/Appearance/dark/themes/orange/orange_componentsCTA_DarkModifyCategory.module.css +0 -14
- package/assets/Appearance/dark/themes/red/red_componentsCTA_DarkModifyCategory.module.css +0 -14
- package/assets/Appearance/dark/themes/yellow/yellow_componentsCTA_DarkModifyCategory.module.css +0 -14
- package/assets/Appearance/light/themes/blue/blue_componentsCTA_LightModifyCategory.module.css +0 -14
- package/assets/Appearance/light/themes/green/green_componentsCTA_LightModifyCategory.module.css +0 -14
- package/assets/Appearance/light/themes/orange/orange_componentsCTA_LightModifyCategory.module.css +0 -14
- package/assets/Appearance/light/themes/red/red_componentsCTA_LightModifyCategory.module.css +0 -14
- package/assets/Appearance/light/themes/yellow/yellow_componentsCTA_LightModifyCategory.module.css +0 -14
- package/assets/Appearance/pureDark/themes/blue/blue_componentsCTA_PureDarkModifyCategory.module.css +0 -14
- package/assets/Appearance/pureDark/themes/green/green_componentsCTA_PureDarkModifyCategory.module.css +0 -14
- package/assets/Appearance/pureDark/themes/orange/orange_componentsCTA_PureDarkModifyCategory.module.css +0 -14
- package/assets/Appearance/pureDark/themes/red/red_componentsCTA_PureDarkModifyCategory.module.css +0 -14
- package/assets/Appearance/pureDark/themes/yellow/yellow_componentsCTA_PureDarkModifyCategory.module.css +0 -14
package/README.md
CHANGED
|
@@ -2,10 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development across projects.
|
|
4
4
|
|
|
5
|
-
# 1.6.x
|
|
6
|
-
|
|
7
|
-
- Updated `@zohodesk-private/color-variable-preprocessor` package version - CTA category overridden variables are now generated only for the necessary CTA variables using the `buildOverriddenCTACategories` function.
|
|
8
|
-
|
|
9
5
|
# 1.6.12
|
|
10
6
|
|
|
11
7
|
- v1/Button/_shared/SuccessTick/SuccessTick.module.css file renamed to SuccessTick_v1.module.css
|
|
@@ -25,6 +21,7 @@ Dot UI is a customizable React component library built to deliver a clean, acces
|
|
|
25
21
|
- Prefixless prop fallbacks are supported
|
|
26
22
|
- `tagName` config in **highlightText** has been renamed to `as`. (fallback supported)
|
|
27
23
|
|
|
24
|
+
|
|
28
25
|
# 1.6.7
|
|
29
26
|
|
|
30
27
|
- PX to variable conversion was not applied due to the CBT migration. The issue has now been fixed.
|
|
@@ -50,6 +47,7 @@ Dot UI is a customizable React component library built to deliver a clean, acces
|
|
|
50
47
|
### 🔒 Compatibility
|
|
51
48
|
- Requires `@zohodesk/dotkit` version `1.0.8` or above.
|
|
52
49
|
|
|
50
|
+
|
|
53
51
|
# 1.6.3
|
|
54
52
|
|
|
55
53
|
- Added customProps support to **AdvancedMultiSelect**.
|
|
@@ -143,6 +141,7 @@ Dot UI is a customizable React component library built to deliver a clean, acces
|
|
|
143
141
|
|
|
144
142
|
- Font Family Migrated to Font-weight across all css (Impacted)
|
|
145
143
|
|
|
144
|
+
|
|
146
145
|
# 1.4.23
|
|
147
146
|
|
|
148
147
|
- **Typography**
|
|
@@ -111,7 +111,7 @@
|
|
|
111
111
|
--zdt_tag_default_text:hsla(210, calc(var(--zd-saturation, 1) * 7.41%), calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
112
112
|
--zdt_tag_default_bg:var(--zdt_cta_grey_20_bg);
|
|
113
113
|
--zdt_tag_default_border:var(--dot_mirror);
|
|
114
|
-
--zdt_tag_default_hover_bg:var(--
|
|
114
|
+
--zdt_tag_default_hover_bg:var(--zdtm_cta_grey_35_bg_darker_lowest);
|
|
115
115
|
--zdt_tag_secondary_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
|
|
116
116
|
--zdt_tag_secondary_bg:hsla(217, calc(var(--zd-saturation, 1) * 12.16%), calc(29.02% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
117
117
|
--zdt_tag_secondary_hover_bg:hsla(216, calc(var(--zd-saturation, 1) * 9.93%), calc(29.61% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
--zdt_tag_danger_hover_bg:hsla(317, calc(var(--zd-saturation, 1) * 22.14%), calc(25.69% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
123
123
|
--zdt_tag_primary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
124
124
|
--zdt_tag_primary_hover_bg:var(--zdtm_cta_primary_hover_bg_default_inverse);
|
|
125
|
-
--zdt_tag_primary_border:var(--
|
|
125
|
+
--zdt_tag_primary_border:var(--zdtm_cta_primary_light_border_default_inverse_medium);
|
|
126
126
|
--zdt_tag_closeprimary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
127
127
|
--zdt_tag_default_danger_bg:var(--zdtm_cta_grey_15_bg_default_inverse_low);
|
|
128
128
|
--zdt_tag_active_default_bg:var(--zdt_cta_primary_light_bg);
|
|
@@ -311,7 +311,7 @@
|
|
|
311
311
|
--zdt_datetime_invalid_text:hsla(216, calc(var(--zd-saturation, 1) * 22.98%), calc(31.57% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
312
312
|
--zdt_datetime_invalid_hover_text:hsla(0, calc(var(--zd-saturation, 1) * 100.00%), calc(70.98% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
313
313
|
--zdt_datetime_invaliddate_text:hsla(0, calc(var(--zd-saturation, 1) * 71.91%), calc(53.92% + var(--zdc_default_inverse_lower)), calc( 0.3 + var(--zdc_alpha_low)));
|
|
314
|
-
--zdt_datetime_selected_bg:var(--
|
|
314
|
+
--zdt_datetime_selected_bg:var(--zdtm_cta_primary_bg_darker_low);
|
|
315
315
|
--zdt_datetime_today_border:var(--zdt_cta_primary_border);
|
|
316
316
|
--zdt_datetime_today_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
|
|
317
317
|
--zdt_datetime_text:hsla(220, calc(var(--zd-saturation, 1) * 10.45%), calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
@@ -345,7 +345,7 @@
|
|
|
345
345
|
|
|
346
346
|
/* tabs */
|
|
347
347
|
--zdt_tabs_alpha_bg:hsla(217, calc(var(--zd-saturation, 1) * 23.08%), calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
348
|
-
--zdt_tabs_alpha_border:var(--
|
|
348
|
+
--zdt_tabs_alpha_border:var(--zdtm_cta_grey_15_border_default_inverse_medium);
|
|
349
349
|
--zdt_tabs_alpha_box_shadow:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), 0.00%, 0.3);
|
|
350
350
|
--zdt_tabs_delta_border:var(--zdt_cta_primary_border);
|
|
351
351
|
--zdt_tabs_highlight_border:hsla(210, calc(var(--zd-saturation, 1) * 7.41%), calc(89.41% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
[data-mode='light']{
|
|
2
2
|
/* list common */
|
|
3
|
-
--dot_inputPlaceholder:var(--
|
|
3
|
+
--dot_inputPlaceholder:var(--zdtm_cta_grey_40_text_default_inverse);
|
|
4
4
|
--dot_inputDisable:hsla(218, calc(var(--zd-saturation, 1) * 9.76%), calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
5
5
|
--dot_inputLine:var(--zdt_cta_grey_35_border);
|
|
6
6
|
--dot_inputLineHover:hsla(218, calc(var(--zd-saturation, 1) * 9.76%), calc(51.76% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
|
|
@@ -111,7 +111,7 @@
|
|
|
111
111
|
--zdt_tag_default_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
112
112
|
--zdt_tag_default_bg:var(--zdt_cta_grey_20_bg);
|
|
113
113
|
--zdt_tag_default_border:var(--dot_mirror);
|
|
114
|
-
--zdt_tag_default_hover_bg:var(--
|
|
114
|
+
--zdt_tag_default_hover_bg:var(--zdtm_cta_grey_35_bg_darker_lowest);
|
|
115
115
|
--zdt_tag_secondary_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
|
|
116
116
|
--zdt_tag_secondary_bg:hsla(217, calc(var(--zd-saturation, 1) * 12.16%), calc(29.02% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
117
117
|
--zdt_tag_secondary_hover_bg:hsla(216, calc(var(--zd-saturation, 1) * 9.93%), calc(29.61% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
--zdt_tag_danger_hover_bg:hsla(7, calc(var(--zd-saturation, 1) * 70.21%), calc(90.78% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
123
123
|
--zdt_tag_primary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
124
124
|
--zdt_tag_primary_hover_bg:var(--zdtm_cta_primary_hover_bg_default_inverse);
|
|
125
|
-
--zdt_tag_primary_border:var(--
|
|
125
|
+
--zdt_tag_primary_border:var(--zdtm_cta_primary_light_border_default_inverse_medium);
|
|
126
126
|
--zdt_tag_closeprimary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
127
127
|
--zdt_tag_default_danger_bg:var(--zdtm_cta_grey_15_bg_default_inverse_low);
|
|
128
128
|
--zdt_tag_active_default_bg:var(--zdt_cta_primary_light_bg);
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
--zdt_dropdown_darkheading_bg:hsla(226, calc(var(--zd-saturation, 1) * 21.68%), calc(28.04% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
153
153
|
--zdt_dropdown_darkheading_underline_bg:hsla(223, calc(var(--zd-saturation, 1) * 14.00%), calc(39.22% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
154
154
|
--zdt_dropdown_mirror_bg:var(--dot_mirror);
|
|
155
|
-
--zdt_dropdown_user_default_border:var(--
|
|
155
|
+
--zdt_dropdown_user_default_border:var(--zdtm_cta_grey_35_border_default_inverse_medium);
|
|
156
156
|
--zdt_dropdown_listactive_border:var(--zdt_cta_primary_border);
|
|
157
157
|
--zdt_dropdown_listactive_bg:hsla(212, calc(var(--zd-saturation, 1) * 86.67%), calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
158
158
|
--zdt_dropdown_listhover_bg:var(--zdt_cta_grey_10_bg);
|
|
@@ -311,7 +311,7 @@
|
|
|
311
311
|
--zdt_datetime_invalid_text:hsla(231, calc(var(--zd-saturation, 1) * 22.22%), calc(82.35% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
312
312
|
--zdt_datetime_invalid_hover_text:hsla(0, calc(var(--zd-saturation, 1) * 71.91%), calc(53.92% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
313
313
|
--zdt_datetime_invaliddate_text:hsla(0, calc(var(--zd-saturation, 1) * 71.91%), calc(53.92% + var(--zdc_default_inverse_lower)), calc( 0.3 + var(--zdc_alpha_low)));
|
|
314
|
-
--zdt_datetime_selected_bg:var(--
|
|
314
|
+
--zdt_datetime_selected_bg:var(--zdtm_cta_primary_bg_darker_low);
|
|
315
315
|
--zdt_datetime_today_border:var(--zdt_cta_primary_border);
|
|
316
316
|
--zdt_datetime_today_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
|
|
317
317
|
--zdt_datetime_text:hsla(220, calc(var(--zd-saturation, 1) * 10.45%), calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
@@ -345,7 +345,7 @@
|
|
|
345
345
|
|
|
346
346
|
/* tabs */
|
|
347
347
|
--zdt_tabs_alpha_bg:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
348
|
-
--zdt_tabs_alpha_border:var(--
|
|
348
|
+
--zdt_tabs_alpha_border:var(--zdtm_cta_grey_15_border_default_inverse_medium);
|
|
349
349
|
--zdt_tabs_alpha_box_shadow:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), 0.00%, 0.3);
|
|
350
350
|
--zdt_tabs_delta_border:var(--zdt_cta_primary_border);
|
|
351
351
|
--zdt_tabs_highlight_border:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(0.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
--zdt_tag_danger_hover_bg:hsla(317, calc(var(--zd-saturation, 1) * 22.14%), calc(25.69% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
123
123
|
--zdt_tag_primary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
124
124
|
--zdt_tag_primary_hover_bg:var(--zdtm_cta_primary_hover_bg_default_inverse);
|
|
125
|
-
--zdt_tag_primary_border:var(--
|
|
125
|
+
--zdt_tag_primary_border:var(--zdtm_cta_primary_light_border_default_inverse_medium);
|
|
126
126
|
--zdt_tag_closeprimary_bg:var(--zdtm_cta_primary_bg_default_inverse);
|
|
127
127
|
--zdt_tag_default_danger_bg:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(18.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
128
128
|
--zdt_tag_active_default_bg:var(--zdt_cta_primary_light_bg);
|
|
@@ -311,7 +311,7 @@
|
|
|
311
311
|
--zdt_datetime_invalid_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(34.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
312
312
|
--zdt_datetime_invalid_hover_text:hsla(0, calc(var(--zd-saturation, 1) * 100.00%), calc(70.98% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
313
313
|
--zdt_datetime_invaliddate_text:hsla(0, calc(var(--zd-saturation, 1) * 71.91%), calc(53.92% + var(--zdc_default_inverse_lower)), calc( 0.3 + var(--zdc_alpha_low)));
|
|
314
|
-
--zdt_datetime_selected_bg:var(--
|
|
314
|
+
--zdt_datetime_selected_bg:var(--zdtm_cta_primary_bg_darker_low);
|
|
315
315
|
--zdt_datetime_today_border:var(--zdt_cta_primary_border);
|
|
316
316
|
--zdt_datetime_today_text:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
|
|
317
317
|
--zdt_datetime_text:hsla(220, calc(var(--zd-saturation, 1) * 10.45%), calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
@@ -345,7 +345,7 @@
|
|
|
345
345
|
|
|
346
346
|
/* tabs */
|
|
347
347
|
--zdt_tabs_alpha_bg:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), calc(12.94% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
348
|
-
--zdt_tabs_alpha_border:var(--
|
|
348
|
+
--zdt_tabs_alpha_border:var(--zdtm_cta_grey_15_border_default_inverse_medium);
|
|
349
349
|
--zdt_tabs_alpha_box_shadow:hsla(0, calc(var(--zd-saturation, 1) * 0.00%), 0.00%, 0.3);
|
|
350
350
|
--zdt_tabs_delta_border:var(--zdt_cta_primary_border);
|
|
351
351
|
--zdt_tabs_highlight_border:hsla(210, calc(var(--zd-saturation, 1) * 7.41%), calc(89.41% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
|
|
@@ -6,6 +6,7 @@ import { positionMapping } from '@zohodesk/dotkit/es/react/components/Popup/util
|
|
|
6
6
|
import { DropBoxElementDefaultProps } from "./props/defaultProps";
|
|
7
7
|
import { DropBoxElementPropTypes } from "./props/propTypes";
|
|
8
8
|
import { mergeStyle } from '@zohodesk/utils';
|
|
9
|
+
import { Container, Box } from "../../Layout";
|
|
9
10
|
import style from "./css/DropBoxElement.module.css";
|
|
10
11
|
export default function DropBoxElement(props) {
|
|
11
12
|
let {
|
|
@@ -27,6 +28,7 @@ export default function DropBoxElement(props) {
|
|
|
27
28
|
tabIndex,
|
|
28
29
|
palette,
|
|
29
30
|
subContainerRef,
|
|
31
|
+
getSubContainerRef,
|
|
30
32
|
customStyle,
|
|
31
33
|
animationStyle
|
|
32
34
|
} = props;
|
|
@@ -54,6 +56,14 @@ export default function DropBoxElement(props) {
|
|
|
54
56
|
}
|
|
55
57
|
};
|
|
56
58
|
|
|
59
|
+
const setSubContainerRef = ele => {
|
|
60
|
+
if (subContainerRef) {
|
|
61
|
+
subContainerRef.current = ele;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
getSubContainerRef && getSubContainerRef(ele);
|
|
65
|
+
};
|
|
66
|
+
|
|
57
67
|
if (!isAbsolutePositioningNeeded && size === 'default' && !isActive) {
|
|
58
68
|
isAbsolute = true;
|
|
59
69
|
}
|
|
@@ -94,14 +104,14 @@ export default function DropBoxElement(props) {
|
|
|
94
104
|
isAbsolute
|
|
95
105
|
}
|
|
96
106
|
});
|
|
97
|
-
return /*#__PURE__*/React.createElement(
|
|
107
|
+
return /*#__PURE__*/React.createElement(Container, {
|
|
108
|
+
scroll: "none",
|
|
98
109
|
className: boxClassName,
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
ref: getRef,
|
|
110
|
+
dataId: `${dataId}`,
|
|
111
|
+
dataSelectorId: dataSelectorId,
|
|
112
|
+
eleRef: getRef,
|
|
103
113
|
style: inlineStyle,
|
|
104
|
-
|
|
114
|
+
tourId: tourId,
|
|
105
115
|
"data-position": boxPosition,
|
|
106
116
|
"data-box-direction": boxDirection,
|
|
107
117
|
"data-arrow-position": arrowPosition,
|
|
@@ -113,14 +123,14 @@ export default function DropBoxElement(props) {
|
|
|
113
123
|
onAnimationEnd: isAnimate && FireOnAnimationEnd,
|
|
114
124
|
"data-a11y-focus-main-area": true,
|
|
115
125
|
"dot-ui-element": "dropbox"
|
|
116
|
-
}, /*#__PURE__*/React.createElement(
|
|
126
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
127
|
+
flexible: true,
|
|
117
128
|
tabIndex: "-1",
|
|
118
129
|
className: `${subContainerClass} ${style[`${palette}Palette`]}`,
|
|
119
130
|
onClick: onClick,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
ref: subContainerRef
|
|
131
|
+
dataId: `${dataId}_subcontainer`,
|
|
132
|
+
dataSelectorId: `${dataSelectorId}_subcontainer`,
|
|
133
|
+
eleRef: setSubContainerRef
|
|
124
134
|
}, isModel ? /*#__PURE__*/React.createElement("div", {
|
|
125
135
|
className: style.closeBar
|
|
126
136
|
}) : null, isArrow && !isModel && /*#__PURE__*/React.createElement("div", {
|
|
@@ -13,6 +13,8 @@
|
|
|
13
13
|
|
|
14
14
|
.subContainer {
|
|
15
15
|
position: relative;
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: column;
|
|
16
18
|
border-radius: var(--dropbox_border_radius);
|
|
17
19
|
padding: var(--dropbox_padding);
|
|
18
20
|
box-shadow: var(--dropbox_box_shadow);
|
|
@@ -430,8 +432,8 @@
|
|
|
430
432
|
height: 6px;
|
|
431
433
|
/*css:theme-validation:ignore*/
|
|
432
434
|
width: 20% ;
|
|
433
|
-
margin-block:0 var(--zd_size10) ;
|
|
434
|
-
margin-inline:auto ;
|
|
435
|
+
margin-block: 0 var(--zd_size10) ;
|
|
436
|
+
margin-inline: auto ;
|
|
435
437
|
border-radius: 5px;
|
|
436
438
|
background-color: var(--dropbox_mob_close_bg_color);
|
|
437
439
|
cursor: pointer;
|
|
@@ -443,4 +445,4 @@
|
|
|
443
445
|
|
|
444
446
|
.darkPalette {
|
|
445
447
|
--dropbox_bg_color: var(--zdt_dropbox_dark_bg);
|
|
446
|
-
}
|
|
448
|
+
}
|
|
@@ -4,7 +4,7 @@ import React, { Component } from 'react';
|
|
|
4
4
|
import { defaultProps } from "./props/defaultProps";
|
|
5
5
|
import { propTypes } from "./props/propTypes";
|
|
6
6
|
import DropBox from "../DropBox/DropBox";
|
|
7
|
-
import {
|
|
7
|
+
import { Box } from "../Layout";
|
|
8
8
|
import { ResponsiveReceiver } from "../Responsive/CustomResponsive";
|
|
9
9
|
import style from "./ResponsiveDropBox.module.css";
|
|
10
10
|
export default class ResponsiveDropBox extends Component {
|
|
@@ -28,8 +28,7 @@ export default class ResponsiveDropBox extends Component {
|
|
|
28
28
|
const {
|
|
29
29
|
children,
|
|
30
30
|
customClass = {},
|
|
31
|
-
isResponsivePadding
|
|
32
|
-
alignBox
|
|
31
|
+
isResponsivePadding
|
|
33
32
|
} = this.props;
|
|
34
33
|
const {
|
|
35
34
|
customDropBox = '',
|
|
@@ -54,10 +53,10 @@ export default class ResponsiveDropBox extends Component {
|
|
|
54
53
|
let {
|
|
55
54
|
tabletMode
|
|
56
55
|
} = _ref2;
|
|
57
|
-
return /*#__PURE__*/React.createElement(
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
className: `${tabletMode ? style.dropBoxContainer : ''} ${tabletMode && isResponsivePadding ? style.boxPadding : ''}
|
|
56
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
57
|
+
flexible: true,
|
|
58
|
+
shrink: true,
|
|
59
|
+
className: `${tabletMode ? style.dropBoxContainer : ''} ${tabletMode && isResponsivePadding ? style.boxPadding : ''}`
|
|
61
60
|
}, children);
|
|
62
61
|
}));
|
|
63
62
|
}
|
|
@@ -19,6 +19,8 @@ var _propTypes = require("./props/propTypes");
|
|
|
19
19
|
|
|
20
20
|
var _utils = require("@zohodesk/utils");
|
|
21
21
|
|
|
22
|
+
var _Layout = require("../../Layout");
|
|
23
|
+
|
|
22
24
|
var _DropBoxElementModule = _interopRequireDefault(require("./css/DropBoxElement.module.css"));
|
|
23
25
|
|
|
24
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -43,6 +45,7 @@ function DropBoxElement(props) {
|
|
|
43
45
|
tabIndex = props.tabIndex,
|
|
44
46
|
palette = props.palette,
|
|
45
47
|
subContainerRef = props.subContainerRef,
|
|
48
|
+
getSubContainerRef = props.getSubContainerRef,
|
|
46
49
|
customStyle = props.customStyle,
|
|
47
50
|
animationStyle = props.animationStyle;
|
|
48
51
|
var isAbsolute = isAbsolutePositioningNeeded;
|
|
@@ -67,6 +70,14 @@ function DropBoxElement(props) {
|
|
|
67
70
|
}
|
|
68
71
|
};
|
|
69
72
|
|
|
73
|
+
var setSubContainerRef = function setSubContainerRef(ele) {
|
|
74
|
+
if (subContainerRef) {
|
|
75
|
+
subContainerRef.current = ele;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
getSubContainerRef && getSubContainerRef(ele);
|
|
79
|
+
};
|
|
80
|
+
|
|
70
81
|
if (!isAbsolutePositioningNeeded && size === 'default' && !isActive) {
|
|
71
82
|
isAbsolute = true;
|
|
72
83
|
}
|
|
@@ -106,14 +117,14 @@ function DropBoxElement(props) {
|
|
|
106
117
|
subContainerClass = _cssJSLogic.subContainerClass,
|
|
107
118
|
inlineStyle = _cssJSLogic.inlineStyle;
|
|
108
119
|
|
|
109
|
-
return /*#__PURE__*/_react["default"].createElement(
|
|
120
|
+
return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
|
|
121
|
+
scroll: "none",
|
|
110
122
|
className: boxClassName,
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
ref: getRef,
|
|
123
|
+
dataId: "".concat(dataId),
|
|
124
|
+
dataSelectorId: dataSelectorId,
|
|
125
|
+
eleRef: getRef,
|
|
115
126
|
style: inlineStyle,
|
|
116
|
-
|
|
127
|
+
tourId: tourId,
|
|
117
128
|
"data-position": boxPosition,
|
|
118
129
|
"data-box-direction": boxDirection,
|
|
119
130
|
"data-arrow-position": arrowPosition,
|
|
@@ -125,14 +136,14 @@ function DropBoxElement(props) {
|
|
|
125
136
|
onAnimationEnd: isAnimate && FireOnAnimationEnd,
|
|
126
137
|
"data-a11y-focus-main-area": true,
|
|
127
138
|
"dot-ui-element": "dropbox"
|
|
128
|
-
}, /*#__PURE__*/_react["default"].createElement(
|
|
139
|
+
}, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
|
|
140
|
+
flexible: true,
|
|
129
141
|
tabIndex: "-1",
|
|
130
142
|
className: "".concat(subContainerClass, " ").concat(_DropBoxElementModule["default"]["".concat(palette, "Palette")]),
|
|
131
143
|
onClick: onClick,
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
ref: subContainerRef
|
|
144
|
+
dataId: "".concat(dataId, "_subcontainer"),
|
|
145
|
+
dataSelectorId: "".concat(dataSelectorId, "_subcontainer"),
|
|
146
|
+
eleRef: setSubContainerRef
|
|
136
147
|
}, isModel ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
137
148
|
className: _DropBoxElementModule["default"].closeBar
|
|
138
149
|
}) : null, isArrow && !isModel && /*#__PURE__*/_react["default"].createElement("div", {
|
|
@@ -13,6 +13,8 @@
|
|
|
13
13
|
|
|
14
14
|
.subContainer {
|
|
15
15
|
position: relative;
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: column;
|
|
16
18
|
border-radius: var(--dropbox_border_radius);
|
|
17
19
|
padding: var(--dropbox_padding);
|
|
18
20
|
box-shadow: var(--dropbox_box_shadow);
|
|
@@ -430,8 +432,8 @@
|
|
|
430
432
|
height: 6px;
|
|
431
433
|
/*css:theme-validation:ignore*/
|
|
432
434
|
width: 20% ;
|
|
433
|
-
margin-block:0 var(--zd_size10) ;
|
|
434
|
-
margin-inline:auto ;
|
|
435
|
+
margin-block: 0 var(--zd_size10) ;
|
|
436
|
+
margin-inline: auto ;
|
|
435
437
|
border-radius: 5px;
|
|
436
438
|
background-color: var(--dropbox_mob_close_bg_color);
|
|
437
439
|
cursor: pointer;
|
|
@@ -443,4 +445,4 @@
|
|
|
443
445
|
|
|
444
446
|
.darkPalette {
|
|
445
447
|
--dropbox_bg_color: var(--zdt_dropbox_dark_bg);
|
|
446
|
-
}
|
|
448
|
+
}
|
|
@@ -57,6 +57,7 @@ var DropBoxElementPropTypes = {
|
|
|
57
57
|
positionsOffset: _propTypes["default"].object,
|
|
58
58
|
targetOffset: _propTypes["default"].object,
|
|
59
59
|
zIndexStyle: _propTypes["default"].object,
|
|
60
|
-
subContainerRef: _propTypes["default"].func
|
|
60
|
+
subContainerRef: _propTypes["default"].func,
|
|
61
|
+
getSubContainerRef: _propTypes["default"].func
|
|
61
62
|
};
|
|
62
63
|
exports.DropBoxElementPropTypes = DropBoxElementPropTypes;
|
|
@@ -81,8 +81,7 @@ var ResponsiveDropBox = /*#__PURE__*/function (_Component) {
|
|
|
81
81
|
children = _this$props.children,
|
|
82
82
|
_this$props$customCla = _this$props.customClass,
|
|
83
83
|
customClass = _this$props$customCla === void 0 ? {} : _this$props$customCla,
|
|
84
|
-
isResponsivePadding = _this$props.isResponsivePadding
|
|
85
|
-
alignBox = _this$props.alignBox;
|
|
84
|
+
isResponsivePadding = _this$props.isResponsivePadding;
|
|
86
85
|
var _customClass$customDr = customClass.customDropBox,
|
|
87
86
|
customDropBox = _customClass$customDr === void 0 ? '' : _customClass$customDr,
|
|
88
87
|
_customClass$customMo = customClass.customMobileDropBox,
|
|
@@ -107,10 +106,10 @@ var ResponsiveDropBox = /*#__PURE__*/function (_Component) {
|
|
|
107
106
|
responsiveId: "Helmet"
|
|
108
107
|
}, function (_ref2) {
|
|
109
108
|
var tabletMode = _ref2.tabletMode;
|
|
110
|
-
return /*#__PURE__*/_react["default"].createElement(_Layout.
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
className: "".concat(tabletMode ? _ResponsiveDropBoxModule["default"].dropBoxContainer : '', " ").concat(tabletMode && isResponsivePadding ? _ResponsiveDropBoxModule["default"].boxPadding : ''
|
|
109
|
+
return /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
|
|
110
|
+
flexible: true,
|
|
111
|
+
shrink: true,
|
|
112
|
+
className: "".concat(tabletMode ? _ResponsiveDropBoxModule["default"].dropBoxContainer : '', " ").concat(tabletMode && isResponsivePadding ? _ResponsiveDropBoxModule["default"].boxPadding : '')
|
|
114
113
|
}, children);
|
|
115
114
|
}));
|
|
116
115
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zohodesk/components",
|
|
3
|
-
"version": "1.0.0-temp-
|
|
3
|
+
"version": "1.0.0-temp-253.1",
|
|
4
4
|
"main": "es/index.js",
|
|
5
5
|
"module": "es/index.js",
|
|
6
6
|
"private": false,
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"lintAllFix": "npm run lintAll --eslint:fix=true",
|
|
23
23
|
"lint": "npx eslint ./src",
|
|
24
24
|
"clean": "react-cli clean build unittest coverage es lib assets && mkdir assets",
|
|
25
|
-
"dubCheck": "
|
|
25
|
+
"dubCheck": "npx z-node-plugins dub:check node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es ../dot/src ../internal/desk-components/src",
|
|
26
26
|
"init": "npm run clean && cd ../assets && npm run componentsassets && cd ../components",
|
|
27
27
|
"common_package_build": "cd ../common && npm run build && cd ../components",
|
|
28
28
|
"build:lib": "cbt build:lib src,assets lib,assets",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"build:watch": "npm run build:es:watch --module:mode=dev -- -w",
|
|
34
34
|
"coverage": "react-cli coverage",
|
|
35
35
|
"prepare": "npm run init && npm run css:build ",
|
|
36
|
-
"prepublishOnly": "node ../prePublish.js && npm run
|
|
36
|
+
"prepublishOnly": "node ../prePublish.js && npm run css:review",
|
|
37
37
|
"postpublish": "node ../postPublish.js",
|
|
38
38
|
"report": "react-cli publish:report",
|
|
39
39
|
"test": "react-cli test",
|
|
@@ -45,22 +45,22 @@
|
|
|
45
45
|
"download": "npm run download_only && cd ../ && npm run download",
|
|
46
46
|
"download_only": "react-cli clean ./node_modules ./package-lock.json && npm install --legacy-peer-deps",
|
|
47
47
|
"expublish": "node ../publish.js -- exp",
|
|
48
|
-
"css:lineheight:validate": "
|
|
48
|
+
"css:lineheight:validate": "npx z-node-plugins lineheight:errorcheck ./src/",
|
|
49
49
|
"variable:addignore": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/variableIgnore.js ./src",
|
|
50
50
|
"variable:convert": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/pxParserPostcss.js ./src",
|
|
51
51
|
"variable:check": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ./node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json",
|
|
52
52
|
"css:review": " npm run dubCheck && npm run css:lineheight:validate && npm run theme:validate ",
|
|
53
|
-
"theme:validate": "
|
|
54
|
-
"theme:addignore": "
|
|
55
|
-
"theme:removeignore": "
|
|
53
|
+
"theme:validate": "npx z-node-plugins theme:validate ./src ./.cli ./.cli/themeValidate/stringContains.js",
|
|
54
|
+
"theme:addignore": "npx z-node-plugins theme:addignore ./src ./.cli ./.cli/themeValidate/stringContains.js",
|
|
55
|
+
"theme:removeignore": "npx z-node-plugins theme:removeignore ./src ./.cli",
|
|
56
56
|
"review:props": "node ./node_modules/@zohodesk-private/react-prop-validator/es/propValidation.js propValidationArg.json ",
|
|
57
|
-
"css:layer_config_generate": "
|
|
58
|
-
"css:layer_wrap_es": "
|
|
59
|
-
"css:layer_wrap_lib": "
|
|
60
|
-
"css:layer_generate_order": "
|
|
61
|
-
"css:layer_config_validate": "
|
|
57
|
+
"css:layer_config_generate": "npx z-node-plugins css:scan ./src ./assets css_layer_config.json",
|
|
58
|
+
"css:layer_wrap_es": "npx z-node-plugins css:layer_wrap ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets --skip-existing-layer",
|
|
59
|
+
"css:layer_wrap_lib": "npx z-node-plugins css:layer_wrap ./lib ./assets css_layer_config.json --rewrite=src=lib --rewrite=assets=assets --skip-existing-layer",
|
|
60
|
+
"css:layer_generate_order": "npx z-node-plugins css:layer_order css_layer_config.json ./src/components_layer.module.css",
|
|
61
|
+
"css:layer_config_validate": "npx z-node-plugins css:layer_validate css_layer_config.json ./src/ ./assets",
|
|
62
62
|
"css:build": "npm run css:layer_config_validate && npm run css:layer_generate_order && npm run build",
|
|
63
|
-
"css:layer_remove": "
|
|
63
|
+
"css:layer_remove": "npx z-node-plugins css:layer_remove ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets",
|
|
64
64
|
"css:audit": "npx css-audit --common-css=common/common.module.css --dir src --port 8085 --report ",
|
|
65
65
|
"cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
|
|
66
66
|
"publish": "node ../publish.js",
|
|
@@ -73,25 +73,26 @@
|
|
|
73
73
|
"@testing-library/react-hooks": "^7.0.2",
|
|
74
74
|
"@testing-library/user-event": "^13.0.10",
|
|
75
75
|
"@zohodesk-private/css-audit-tool": "0.0.2",
|
|
76
|
-
"@zohodesk-private/color-variable-preprocessor": "1.
|
|
76
|
+
"@zohodesk-private/color-variable-preprocessor": "1.3.1",
|
|
77
77
|
"@zohodesk-private/css-variable-migrator": "1.0.9",
|
|
78
|
-
"@zohodesk-private/node-plugins": "1.1.
|
|
78
|
+
"@zohodesk-private/node-plugins": "1.1.14",
|
|
79
79
|
"@zohodesk-private/react-prop-validator": "1.2.3",
|
|
80
80
|
"@zohodesk/a11y": "2.3.9",
|
|
81
81
|
"@zohodesk/docstool": "1.0.0-alpha-2",
|
|
82
82
|
"@zohodesk/dotkit": "1.0.9",
|
|
83
83
|
"@zohodesk/hooks": "2.0.8",
|
|
84
|
-
"@zohodesk/icons": "1.3.
|
|
84
|
+
"@zohodesk/icons": "1.3.1",
|
|
85
85
|
"@zohodesk/layout": "3.1.0",
|
|
86
86
|
"@zohodesk/svg": "1.3.5",
|
|
87
87
|
"@zohodesk/utils": "1.3.16",
|
|
88
|
-
"@zohodesk/variables": "1.
|
|
88
|
+
"@zohodesk/variables": "1.3.1",
|
|
89
89
|
"@zohodesk/virtualizer": "1.0.13",
|
|
90
90
|
"react-sortable-hoc": "^0.8.3",
|
|
91
91
|
"velocity-react": "1.4.3",
|
|
92
92
|
"@zohodesk/react-cli": "1.1.27",
|
|
93
93
|
"@zohodesk/client_build_tool": "0.0.20",
|
|
94
|
-
"color": "4.2.3"
|
|
94
|
+
"color": "4.2.3",
|
|
95
|
+
"@dot-system/css-utility": "0.1.1"
|
|
95
96
|
},
|
|
96
97
|
"dependencies": {
|
|
97
98
|
"hoist-non-react-statics": "3.0.1",
|
|
@@ -100,8 +101,8 @@
|
|
|
100
101
|
"selectn": "1.1.2"
|
|
101
102
|
},
|
|
102
103
|
"peerDependencies": {
|
|
103
|
-
"@zohodesk/icons": "1.3.
|
|
104
|
-
"@zohodesk/variables": "1.
|
|
104
|
+
"@zohodesk/icons": "1.3.1",
|
|
105
|
+
"@zohodesk/variables": "1.3.1",
|
|
105
106
|
"@zohodesk/svg": "1.3.5",
|
|
106
107
|
"@zohodesk/virtualizer": "1.0.13",
|
|
107
108
|
"velocity-react": "1.4.3",
|
|
@@ -111,6 +112,7 @@
|
|
|
111
112
|
"@zohodesk/a11y": "2.3.9",
|
|
112
113
|
"@zohodesk/layout": "3.1.0",
|
|
113
114
|
"@zohodesk/dotkit": "1.0.9",
|
|
114
|
-
"color": "4.2.3"
|
|
115
|
+
"color": "4.2.3",
|
|
116
|
+
"@dot-system/css-utility": "0.1.1"
|
|
115
117
|
}
|
|
116
118
|
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='dark'][data-theme='blue'], :global(.zd-blueDarkTheme) [data-theme="blue"]{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(213, 27.27%, calc(23.73% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(216, 22.98%, calc(31.57% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(213, 85.45%, calc(43.14% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(215, 28.16%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(212, 100.00%, calc(63.92% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(213, 85.45%, calc(43.14% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/dark/themes/green/green_componentsCTA_DarkModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='dark'][data-theme='green']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(191, 21.65%, calc(19.02% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(216, 22.98%, calc(31.57% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(128, 79.71%, calc(27.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(170, 22.94%, calc(21.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(133, 40.00%, calc(45.10% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(128, 79.71%, calc(27.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/dark/themes/orange/orange_componentsCTA_DarkModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='dark'][data-theme='orange']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(252, 4.85%, calc(20.20% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(216, 22.98%, calc(31.57% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(29, 100.00%, calc(32.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(340, 5.56%, calc(21.18% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(26, 100.00%, calc(56.08% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(29, 100.00%, calc(32.94% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='dark'][data-theme='red']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(258, 12.62%, calc(20.20% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(216, 22.98%, calc(31.57% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(0, 81.62%, calc(36.27% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(284, 10.48%, calc(20.59% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(0, 77.78%, calc(61.18% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(0, 81.62%, calc(36.27% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/dark/themes/yellow/yellow_componentsCTA_DarkModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='dark'][data-theme='yellow']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(218, 7.69%, calc(20.39% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(216, 22.98%, calc(31.57% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(217, 23.23%, calc(19.41% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(39, 90.18%, calc(31.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(220, 2.75%, calc(21.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(37, 66.94%, calc(52.55% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(39, 90.18%, calc(31.96% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/light/themes/blue/blue_componentsCTA_LightModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='light'][data-theme='blue'], :global(.zd-blueLightTheme) [data-theme="blue"]{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(216, 38.46%, calc(97.45% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(212, 86.67%, calc(97.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(231, 22.22%, calc(82.35% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(216, 38.46%, calc(97.45% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(213, 100.00%, calc(36.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(213, 84.62%, calc(94.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(212, 91.84%, calc(48.04% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(231, 22.22%, calc(82.35% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(213, 100.00%, calc(36.08% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/light/themes/green/green_componentsCTA_LightModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='light'][data-theme='green']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(165, 28.57%, calc(97.25% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(143, 44.44%, calc(96.47% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(135, 7.41%, calc(78.82% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(165, 28.57%, calc(97.25% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(134, 78.63%, calc(25.69% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(135, 13.33%, calc(94.12% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(132, 43.33%, calc(88.24% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(133, 63.29%, calc(40.59% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(135, 7.41%, calc(78.82% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(134, 78.63%, calc(25.69% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/light/themes/orange/orange_componentsCTA_LightModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='light'][data-theme='orange']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(20, 20.00%, calc(97.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(26, 77.78%, calc(96.47% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(27, 10.68%, calc(79.80% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(20, 20.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(30, 100.00%, calc(34.90% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(24, 27.78%, calc(92.94% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(28, 80.39%, calc(90.00% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(28, 81.75%, calc(49.41% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(27, 10.68%, calc(79.80% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(30, 100.00%, calc(34.90% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='light'][data-theme='red']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(340, 20.00%, calc(97.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(0, 71.43%, calc(97.25% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(343, 4.76%, calc(71.18% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(340, 20.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(1, 75.38%, calc(38.24% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 12.20%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(0, 70.21%, calc(90.78% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(0, 71.91%, calc(53.92% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(343, 4.76%, calc(71.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(1, 75.38%, calc(38.24% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/light/themes/yellow/yellow_componentsCTA_LightModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='light'][data-theme='yellow']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(60, 12.50%, calc(96.86% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(45, 83.33%, calc(95.29% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(45, 28.17%, calc(72.16% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(60, 12.50%, calc(96.86% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(46, 81.07%, calc(52.35% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(48, 100.00%, calc(35.49% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(60, 21.74%, calc(90.98% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(46, 80.82%, calc(85.69% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(46, 81.07%, calc(52.35% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(46, 81.07%, calc(52.35% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(45, 28.17%, calc(72.16% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(48, 100.00%, calc(35.49% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/pureDark/themes/blue/blue_componentsCTA_PureDarkModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='pureDark'][data-theme='blue'], :global(.zd-bluePureDarkTheme) [data-theme="blue"]{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(213, 19.57%, calc(18.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(0, 0.00%, calc(34.51% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(213, 85.45%, calc(43.14% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(215, 28.16%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(212, 100.00%, calc(63.92% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(213, 85.45%, calc(43.14% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='pureDark'][data-theme='green']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(133, 10.84%, calc(16.27% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(0, 0.00%, calc(34.51% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(128, 79.71%, calc(27.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(170, 22.94%, calc(21.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(133, 40.00%, calc(45.10% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(128, 79.71%, calc(27.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='pureDark'][data-theme='orange']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(26, 19.51%, calc(16.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(0, 0.00%, calc(34.51% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(29, 100.00%, calc(32.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(340, 5.56%, calc(21.18% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(26, 100.00%, calc(56.08% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(29, 100.00%, calc(32.94% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
package/assets/Appearance/pureDark/themes/red/red_componentsCTA_PureDarkModifyCategory.module.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='pureDark'][data-theme='red']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(0, 13.25%, calc(16.27% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(0, 0.00%, calc(34.51% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(0, 81.62%, calc(36.27% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(284, 10.48%, calc(20.59% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(0, 77.78%, calc(61.18% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(0, 81.62%, calc(36.27% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
[data-mode='pureDark'][data-theme='yellow']{
|
|
2
|
-
--zdtm_cta_grey_10_bg_default_inverse_low:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
3
|
-
--zdtm_cta_primary_light_bg_default_inverse_low:hsla(35, 15.00%, calc(15.69% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
4
|
-
--zdtm_cta_grey_40_bg_default:hsla(0, 0.00%, calc(34.51% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
5
|
-
--zdtm_cta_grey_10_bg_default_inverse_lower:hsla(0, 0.00%, calc(14.90% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
6
|
-
--zdtm_cta_primary_bg_default_inverse:hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
7
|
-
--zdtm_cta_primary_hover_bg_default_inverse:hsla(39, 90.18%, calc(31.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
|
|
8
|
-
--zdtm_cta_grey_15_bg_default_inverse_low:hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
9
|
-
--zdtm_cta_alpha_bg_default_inverse_lower:hsla(220, 2.75%, calc(21.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
|
|
10
|
-
--zdtm_cta_primary_bg_default_inverse_low:hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
11
|
-
--zdtm_cta_primary_bg_default:hsla(37, 66.94%, calc(52.55% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
12
|
-
--zdtm_cta_grey_40_bg_default_inverse_low:hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
|
|
13
|
-
--zdtm_cta_primary_hover_bg_default:hsla(39, 90.18%, calc(31.96% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
|
|
14
|
-
}
|