@sc-360-v2/storefront-cms-library 0.3.61 → 0.3.63

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.
Files changed (47) hide show
  1. package/dist/add-products-tab copy.scss +9 -8
  2. package/dist/add-products-tab.scss +9 -8
  3. package/dist/badge.scss +87 -83
  4. package/dist/builder.js +1 -1
  5. package/dist/buyForHeaders.scss +6086 -1184
  6. package/dist/cart-details.scss +26 -22
  7. package/dist/cart-summary.scss +17 -143
  8. package/dist/cart-wrapper.scss +127 -0
  9. package/dist/cartDropdownOverlay.scss +23 -4
  10. package/dist/checkout.scss +96 -573
  11. package/dist/dropdownTemplate.scss +58 -4
  12. package/dist/icon-list.scss +25 -19
  13. package/dist/icons.js +1 -1
  14. package/dist/image-for-product.scss +19 -0
  15. package/dist/index.js +1 -1
  16. package/dist/item-stock.scss +27 -26
  17. package/dist/mega-menu-container.scss +96 -0
  18. package/dist/mega-menu.scss +832 -0
  19. package/dist/menu-v2.scss +30 -5
  20. package/dist/modal.scss +168 -8
  21. package/dist/order-status.scss +18 -15
  22. package/dist/past-orders.scss +279 -271
  23. package/dist/payment-methods.scss +72 -69
  24. package/dist/position-module.scss +2 -1
  25. package/dist/prefix-list.scss +3 -0
  26. package/dist/quick-links.scss +49 -46
  27. package/dist/quick-order-pad.scss +3 -0
  28. package/dist/quotes.scss +123 -117
  29. package/dist/rfqs.scss +123 -117
  30. package/dist/simple-list.scss +264 -0
  31. package/dist/table.scss +3 -9
  32. package/dist/templates.scss +299 -0
  33. package/dist/types/builder/elements/cart-wrapper/index.d.ts +44 -0
  34. package/dist/types/builder/elements/mega-menu/index.d.ts +47 -0
  35. package/dist/types/builder/elements/mega-menu-container/index.d.ts +44 -0
  36. package/dist/types/builder/elements/simple-list/index.d.ts +47 -0
  37. package/dist/types/builder/enums/index.d.ts +7 -1
  38. package/dist/types/builder/index.d.ts +5 -1
  39. package/dist/types/builder/tools/element-edit/cart-wrapper.d.ts +16 -0
  40. package/dist/types/builder/tools/element-edit/index.d.ts +5 -1
  41. package/dist/types/builder/tools/element-edit/mega-menu.d.ts +41 -0
  42. package/dist/types/builder/tools/element-edit/megaMenuContainer.d.ts +9 -0
  43. package/dist/types/builder/tools/element-edit/simple-list.d.ts +37 -0
  44. package/dist/types/website/constants/data-connectors.d.ts +18 -0
  45. package/dist/website.js +1 -1
  46. package/dist/widget.scss +4 -0
  47. package/package.json +1 -1
@@ -34,13 +34,15 @@
34
34
  display: flex;
35
35
  flex-direction: column;
36
36
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
37
- background-color: prepareMediaVariable(dn-pt-md-wt-bd-cr);
38
- border-width: prepareMediaVariable(dn-pt-md-wt-br-wh);
39
- border-color: prepareMediaVariable(dn-pt-md-wt-br-cr);
40
- border-style: prepareMediaVariable(dn-pt-md-wt-br-se);
41
- border-radius: prepareMediaVariable(dn-pt-md-wt-br-rs);
42
- box-shadow: prepareMediaVariable(dn-pt-md-wt-sw-ae) prepareMediaVariable(dn-pt-md-wt-sw-br)
43
- prepareMediaVariable(dn-pt-md-wt-sw-sd) prepareMediaVariable(dn-pt-md-wt-sw-cr);
37
+ background-color: prepareMediaVariable(--_ctm-dn-pt-md-wt-bd-cr);
38
+ border-width: prepareMediaVariable(--_ctm-dn-pt-md-wt-br-wh);
39
+ border-color: prepareMediaVariable(--_ctm-dn-pt-md-wt-br-cr);
40
+ border-style: prepareMediaVariable(--_ctm-dn-pt-md-wt-br-se);
41
+ border-radius: prepareMediaVariable(--_ctm-dn-pt-md-wt-br-rs);
42
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-md-wt-sw-ae)
43
+ prepareMediaVariable(--_ctm-dn-pt-md-wt-sw-br)
44
+ prepareMediaVariable(--_ctm-dn-pt-md-wt-sw-sd)
45
+ prepareMediaVariable(--_ctm-dn-pt-md-wt-sw-cr);
44
46
  .title-content {
45
47
  display: flex;
46
48
  flex-direction: column;
@@ -48,28 +50,28 @@
48
50
  font-size: 24px;
49
51
  margin-bottom: 10px;
50
52
  color: #000;
51
- font-family: prepareMediaVariable(dn-pt-md-te-ft-fy);
52
- font-size: prepareMediaVariable(dn-pt-md-te-ft-se);
53
- color: prepareMediaVariable(dn-pt-md-te-cr);
54
- font-weight: prepareMediaVariable(dn-pt-md-te-ft-wt);
55
- font-style: prepareMediaVariable(dn-pt-md-te-ft-se-ic);
56
- text-decoration: prepareMediaVariable(dn-pt-md-te-ue);
57
- text-align: prepareMediaVariable(dn-pt-md-te-tt-an);
58
- letter-spacing: prepareMediaVariable(dn-pt-md-te-lr-sg);
59
- line-height: prepareMediaVariable(dn-pt-md-te-le-ht);
53
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-te-ft-fy);
54
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-te-ft-se);
55
+ color: prepareMediaVariable(--_ctm-dn-pt-md-te-cr);
56
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-te-ft-wt);
57
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-te-ft-se-ic);
58
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-te-ue);
59
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-te-tt-an);
60
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-te-lr-sg);
61
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-te-le-ht);
60
62
  }
61
63
  .description {
62
64
  font-size: 16px;
63
65
  color: #000;
64
- font-family: prepareMediaVariable(dn-pt-md-dn-ft-fy);
65
- font-size: prepareMediaVariable(dn-pt-md-dn-ft-se);
66
- color: prepareMediaVariable(dn-pt-md-dn-cr);
67
- font-weight: prepareMediaVariable(dn-pt-md-dn-ft-wt);
68
- font-style: prepareMediaVariable(dn-pt-md-dn-ft-se-ic);
69
- text-decoration: prepareMediaVariable(dn-pt-md-dn-ue);
70
- text-align: prepareMediaVariable(dn-pt-md-dn-tt-an);
71
- letter-spacing: prepareMediaVariable(dn-pt-md-dn-lr-sg);
72
- line-height: prepareMediaVariable(dn-pt-md-dn-le-ht);
66
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-dn-ft-fy);
67
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-dn-ft-se);
68
+ color: prepareMediaVariable(--_ctm-dn-pt-md-dn-cr);
69
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-dn-ft-wt);
70
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-dn-ft-se-ic);
71
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-dn-ue);
72
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-dn-tt-an);
73
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-dn-lr-sg);
74
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-dn-le-ht);
73
75
  }
74
76
  }
75
77
  .payment__methods__container {
@@ -81,14 +83,15 @@
81
83
  --_ctm-mob-lt-im-ct-at,
82
84
  var(--_ctm-tab-lt-im-ct-at, var(--_ctm-lt-im-ct-at))
83
85
  );
84
- background-color: prepareMediaVariable(dn-pt-md-cr-dn-bd-cr);
85
- border-width: prepareMediaVariable(dn-pt-md-cr-dn-br-wh);
86
- border-color: prepareMediaVariable(dn-pt-md-cr-dn-br-cr);
87
- border-style: prepareMediaVariable(dn-pt-md-cr-dn-br-se);
88
- border-radius: prepareMediaVariable(dn-pt-md-cr-dn-br-rs);
89
- box-shadow: prepareMediaVariable(dn-pt-md-cr-dn-sw-ae)
90
- prepareMediaVariable(dn-pt-md-cr-dn-sw-br) prepareMediaVariable(dn-pt-md-cr-dn-sw-sd)
91
- prepareMediaVariable(dn-pt-md-cr-dn-sw-cr);
86
+ background-color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-bd-cr);
87
+ border-width: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-br-wh);
88
+ border-color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-br-cr);
89
+ border-style: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-br-se);
90
+ border-radius: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-br-rs);
91
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-sw-ae)
92
+ prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-sw-br)
93
+ prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-sw-sd)
94
+ prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-sw-cr);
92
95
 
93
96
  .horizontal {
94
97
  display: flex;
@@ -104,15 +107,15 @@
104
107
  }
105
108
  .item {
106
109
  padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
107
- font-family: prepareMediaVariable(dn-pt-md-cr-dn-ft-fy);
108
- font-size: prepareMediaVariable(dn-pt-md-cr-dn-ft-se);
109
- color: prepareMediaVariable(dn-pt-md-cr-dn-cr);
110
- font-weight: prepareMediaVariable(dn-pt-md-cr-dn-ft-wt);
111
- font-style: prepareMediaVariable(dn-pt-md-cr-dn-ft-se-ic);
112
- text-decoration: prepareMediaVariable(dn-pt-md-cr-dn-ue);
113
- text-align: prepareMediaVariable(dn-pt-md-cr-dn-tt-an);
114
- letter-spacing: prepareMediaVariable(dn-pt-md-cr-dn-lr-sg);
115
- line-height: prepareMediaVariable(dn-pt-md-cr-dn-le-ht);
110
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-fy);
111
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se);
112
+ color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-cr);
113
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-wt);
114
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se-ic);
115
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ue);
116
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-tt-an);
117
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-lr-sg);
118
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-le-ht);
116
119
  img {
117
120
  width: 50px;
118
121
  height: 30px;
@@ -133,15 +136,15 @@
133
136
  }
134
137
  .item {
135
138
  padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
136
- font-family: prepareMediaVariable(dn-pt-md-cr-dn-ft-fy);
137
- font-size: prepareMediaVariable(dn-pt-md-cr-dn-ft-se);
138
- color: prepareMediaVariable(dn-pt-md-cr-dn-cr);
139
- font-weight: prepareMediaVariable(dn-pt-md-cr-dn-ft-wt);
140
- font-style: prepareMediaVariable(dn-pt-md-cr-dn-ft-se-ic);
141
- text-decoration: prepareMediaVariable(dn-pt-md-cr-dn-ue);
142
- text-align: prepareMediaVariable(dn-pt-md-cr-dn-tt-an);
143
- letter-spacing: prepareMediaVariable(dn-pt-md-cr-dn-lr-sg);
144
- line-height: prepareMediaVariable(dn-pt-md-cr-dn-le-ht);
139
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-fy);
140
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se);
141
+ color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-cr);
142
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-wt);
143
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se-ic);
144
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ue);
145
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-tt-an);
146
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-lr-sg);
147
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-le-ht);
145
148
  img {
146
149
  width: 50px;
147
150
  height: 30px;
@@ -191,15 +194,15 @@
191
194
  var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at))
192
195
  );
193
196
  border: 0;
194
- font-family: prepareMediaVariable(dn-pt-md-cr-dn-ft-fy);
195
- font-size: prepareMediaVariable(dn-pt-md-cr-dn-ft-se);
196
- color: prepareMediaVariable(dn-pt-md-cr-dn-cr);
197
- font-weight: prepareMediaVariable(dn-pt-md-cr-dn-ft-wt);
198
- font-style: prepareMediaVariable(dn-pt-md-cr-dn-ft-se-ic);
199
- text-decoration: prepareMediaVariable(dn-pt-md-cr-dn-ue);
200
- text-align: prepareMediaVariable(dn-pt-md-cr-dn-tt-an);
201
- letter-spacing: prepareMediaVariable(dn-pt-md-cr-dn-lr-sg);
202
- line-height: prepareMediaVariable(dn-pt-md-cr-dn-le-ht);
197
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-fy);
198
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se);
199
+ color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-cr);
200
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-wt);
201
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se-ic);
202
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ue);
203
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-tt-an);
204
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-lr-sg);
205
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-le-ht);
203
206
  }
204
207
  }
205
208
  }
@@ -218,15 +221,15 @@
218
221
  --_ctm-mob-lt-ct-at,
219
222
  var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at))
220
223
  );
221
- font-family: prepareMediaVariable(dn-pt-md-cr-dn-ft-fy);
222
- font-size: prepareMediaVariable(dn-pt-md-cr-dn-ft-se);
223
- color: prepareMediaVariable(dn-pt-md-cr-dn-cr);
224
- font-weight: prepareMediaVariable(dn-pt-md-cr-dn-ft-wt);
225
- font-style: prepareMediaVariable(dn-pt-md-cr-dn-ft-se-ic);
226
- text-decoration: prepareMediaVariable(dn-pt-md-cr-dn-ue);
227
- text-align: prepareMediaVariable(dn-pt-md-cr-dn-tt-an);
228
- letter-spacing: prepareMediaVariable(dn-pt-md-cr-dn-lr-sg);
229
- line-height: prepareMediaVariable(dn-pt-md-cr-dn-le-ht);
224
+ font-family: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-fy);
225
+ font-size: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se);
226
+ color: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-cr);
227
+ font-weight: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-wt);
228
+ font-style: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ft-se-ic);
229
+ text-decoration: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-ue);
230
+ text-align: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-tt-an);
231
+ letter-spacing: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-lr-sg);
232
+ line-height: prepareMediaVariable(--_ctm-dn-pt-md-cr-dn-le-ht);
230
233
  }
231
234
  }
232
235
  }
@@ -23,6 +23,7 @@ $position: (
23
23
  absolute: "flx-abs",
24
24
  fixed: "flx-fxd",
25
25
  sticky: "flx-stk",
26
+ relative: "flx-rel",
26
27
  ),
27
28
  zIndex: "--_ctm-flex-z-index",
28
29
  attributes: (
@@ -64,7 +65,7 @@ $position: (
64
65
  @include FlexUpdatedPrefixCSSVariable($var);
65
66
  width: var(#{$var}, #{prepareMediaVariable(--_ctm-lt-wh)}) !important;
66
67
  }
67
- @if ($key != sticky) {
68
+ @if not list.index((sticky, relative), $key) {
68
69
  margin: 0px !important;
69
70
  }
70
71
  }
@@ -33,6 +33,9 @@ $prefixList: (
33
33
  buyForTabsContainer: buyFo,
34
34
  spotlight: spo,
35
35
  categoryGroups: catego,
36
+ mega-menu: meg,
37
+ mgContainer: mgcon,
38
+ cartWrapper: cartw,
36
39
  );
37
40
 
38
41
  $VariableTypes: (
@@ -99,14 +99,15 @@
99
99
 
100
100
  &[data-widget-border="true"] {
101
101
  .quick__links__container {
102
- background-color: prepareMediaVariable(dn-qk-ls-wt-dn-bd-cr);
103
- border-width: prepareMediaVariable(dn-qk-ls-wt-dn-br-wh);
104
- border-color: prepareMediaVariable(dn-qk-ls-wt-dn-br-cr);
105
- border-style: prepareMediaVariable(dn-qk-ls-wt-dn-br-se);
106
- border-radius: prepareMediaVariable(dn-qk-ls-wt-dn-br-rs);
107
- box-shadow: prepareMediaVariable(dn-qk-ls-wt-dn-sw-ae)
108
- prepareMediaVariable(dn-qk-ls-wt-dn-sw-br) prepareMediaVariable(dn-qk-ls-wt-dn-sw-sd)
109
- prepareMediaVariable(dn-qk-ls-wt-dn-sw-cr);
102
+ background-color: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-bd-cr);
103
+ border-width: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-br-wh);
104
+ border-color: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-br-cr);
105
+ border-style: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-br-se);
106
+ border-radius: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-br-rs);
107
+ box-shadow: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-ae)
108
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-br)
109
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-sd)
110
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-cr);
110
111
  // border-color: var(
111
112
  // --_ctm-mob-dn-qk-ls-wt-dn-br-cr,
112
113
  // var(--_ctm-tab-dn-qk-ls-wt-dn-br-cr, var(--_ctm-dn-qk-ls-wt-dn-br-cr))
@@ -197,12 +198,13 @@
197
198
  // --_ctm-mob-dn-qk-ls-wt-dn-br-rs,
198
199
  // var(--_ctm-tab-dn-qk-ls-wt-dn-br-rs, var(--_ctm-dn-qk-ls-wt-dn-br-rs))
199
200
  // );
200
- background-color: prepareMediaVariable(dn-qk-ls-wt-dn-bd-cr);
201
+ background-color: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-bd-cr);
201
202
 
202
- border-radius: prepareMediaVariable(dn-qk-ls-wt-dn-br-rs);
203
- box-shadow: prepareMediaVariable(dn-qk-ls-wt-dn-sw-ae)
204
- prepareMediaVariable(dn-qk-ls-wt-dn-sw-br) prepareMediaVariable(dn-qk-ls-wt-dn-sw-sd)
205
- prepareMediaVariable(dn-qk-ls-wt-dn-sw-cr);
203
+ border-radius: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-br-rs);
204
+ box-shadow: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-ae)
205
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-br)
206
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-sd)
207
+ prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-sw-cr);
206
208
 
207
209
  .header__container {
208
210
  display: flex;
@@ -249,15 +251,15 @@
249
251
  )
250
252
  );
251
253
  h3 {
252
- font-family: prepareMediaVariable(dn-qk-ls-wt-dn-ft-fy);
253
- font-size: prepareMediaVariable(dn-qk-ls-wt-dn-ft-se);
254
- color: prepareMediaVariable(dn-qk-ls-wt-dn-cr);
255
- font-weight: prepareMediaVariable(dn-qk-ls-wt-dn-ft-wt);
256
- font-style: prepareMediaVariable(dn-qk-ls-wt-dn-ft-se-ic);
257
- text-decoration: prepareMediaVariable(dn-qk-ls-wt-dn-ue);
258
- text-align: prepareMediaVariable(dn-qk-ls-wt-dn-tt-an);
259
- letter-spacing: prepareMediaVariable(dn-qk-ls-wt-dn-lr-sg);
260
- line-height: prepareMediaVariable(dn-qk-ls-wt-dn-le-ht);
254
+ font-family: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-fy);
255
+ font-size: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-se);
256
+ color: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-cr);
257
+ font-weight: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-wt);
258
+ font-style: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-se-ic);
259
+ text-decoration: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ue);
260
+ text-align: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-tt-an);
261
+ letter-spacing: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-lr-sg);
262
+ line-height: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-le-ht);
261
263
  // color: var(
262
264
  // --_ctm-mob-dn-qk-ls-wt-dn-cr,
263
265
  // var(--_ctm-tab-dn-qk-ls-wt-dn-cr, var(--_ctm-dn-qk-ls-wt-dn-cr))
@@ -301,14 +303,14 @@
301
303
 
302
304
  p {
303
305
  font-family: prepareMediaVariable(-dn-qk-ls-wt-dn-ft-fy-dc);
304
- font-size: prepareMediaVariable(dn-qk-ls-wt-dn-ft-se-dc);
305
- color: prepareMediaVariable(dn-qk-ls-wt-dn-cr-dc);
306
- font-weight: prepareMediaVariable(dn-qk-ls-wt-dn-ft-wt-dc);
307
- font-style: prepareMediaVariable(dn-qk-ls-wt-dn-ft-se-ic-dc);
308
- text-decoration: prepareMediaVariable(dn-qk-ls-wt-dn-ue-dc);
309
- text-align: prepareMediaVariable(dn-qk-ls-wt-dn-tt-an-dc);
310
- letter-spacing: prepareMediaVariable(dn-qk-ls-wt-dn-lr-sg-dc);
311
- line-height: prepareMediaVariable(dn-qk-ls-wt-dn-le-ht-dc);
306
+ font-size: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-se-dc);
307
+ color: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-cr-dc);
308
+ font-weight: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-wt-dc);
309
+ font-style: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ft-se-ic-dc);
310
+ text-decoration: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-ue-dc);
311
+ text-align: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-tt-an-dc);
312
+ letter-spacing: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-lr-sg-dc);
313
+ line-height: prepareMediaVariable(--_ctm-dn-qk-ls-wt-dn-le-ht-dc);
312
314
  // color: var(
313
315
  // --_ctm-mob-dn-qk-ls-wt-dn-cr-dc,
314
316
  // var(--_ctm-tab-dn-qk-ls-wt-dn-cr-dc, var(--_ctm-dn-qk-ls-wt-dn-cr-dc))
@@ -354,22 +356,23 @@
354
356
  .items__container {
355
357
  .links__item {
356
358
  display: block;
357
- font-family: prepareMediaVariable(dn-im-se-ft-fy);
358
- font-size: prepareMediaVariable(dn-im-se-ft-se);
359
- color: prepareMediaVariable(dn-im-se-cr);
360
- font-weight: prepareMediaVariable(dn-im-se-ft-wt);
361
- font-style: prepareMediaVariable(dn-im-se-ft-se-ic);
362
- text-decoration: prepareMediaVariable(dn-im-se-ue);
363
- text-align: prepareMediaVariable(dn-im-se-tt-an);
364
- letter-spacing: prepareMediaVariable(dn-im-se-lr-sg);
365
- line-height: prepareMediaVariable(dn-im-se-le-ht);
366
- background-color: prepareMediaVariable(dn-im-se-bd-cr);
367
- border-width: prepareMediaVariable(dn-im-se-br-wh);
368
- border-color: prepareMediaVariable(dn-im-se-br-cr);
369
- border-style: prepareMediaVariable(dn-im-se-br-se);
370
- border-radius: prepareMediaVariable(dn-im-se-br-rs);
371
- box-shadow: prepareMediaVariable(dn-im-se-sw-ae) prepareMediaVariable(dn-im-se-sw-br)
372
- prepareMediaVariable(dn-im-se-sw-sd) prepareMediaVariable(dn-im-se-sw-cr);
359
+ font-family: prepareMediaVariable(--_ctm-dn-im-se-ft-fy);
360
+ font-size: prepareMediaVariable(--_ctm-dn-im-se-ft-se);
361
+ color: prepareMediaVariable(--_ctm-dn-im-se-cr);
362
+ font-weight: prepareMediaVariable(--_ctm-dn-im-se-ft-wt);
363
+ font-style: prepareMediaVariable(--_ctm-dn-im-se-ft-se-ic);
364
+ text-decoration: prepareMediaVariable(--_ctm-dn-im-se-ue);
365
+ text-align: prepareMediaVariable(--_ctm-dn-im-se-tt-an);
366
+ letter-spacing: prepareMediaVariable(--_ctm-dn-im-se-lr-sg);
367
+ line-height: prepareMediaVariable(--_ctm-dn-im-se-le-ht);
368
+ background-color: prepareMediaVariable(--_ctm-dn-im-se-bd-cr);
369
+ border-width: prepareMediaVariable(--_ctm-dn-im-se-br-wh);
370
+ border-color: prepareMediaVariable(--_ctm-dn-im-se-br-cr);
371
+ border-style: prepareMediaVariable(--_ctm-dn-im-se-br-se);
372
+ border-radius: prepareMediaVariable(--_ctm-dn-im-se-br-rs);
373
+ box-shadow: prepareMediaVariable(--_ctm-dn-im-se-sw-ae)
374
+ prepareMediaVariable(--_ctm-dn-im-se-sw-br) prepareMediaVariable(--_ctm-dn-im-se-sw-sd)
375
+ prepareMediaVariable(--_ctm-dn-im-se-sw-cr);
373
376
  padding: 2px 8px;
374
377
  width: fit-content;
375
378
  }
@@ -116,6 +116,9 @@ $input-padding: 10px 12px;
116
116
  display: flex;
117
117
  gap: 4px;
118
118
  line-height: 20px;
119
+ &.disabled {
120
+ background-color: var(--_primary-100);
121
+ }
119
122
 
120
123
  .add-icon {
121
124
  width: 20px;