@sc-360-v2/storefront-cms-library 0.3.32 → 0.3.33

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.
@@ -390,6 +390,11 @@
390
390
  .bulk-order-pad-filter-wrapper {
391
391
  background-color: var(--_gray-50);
392
392
  border-bottom: 1px solid var(--_gray-200);
393
+ align-items: center;
394
+ justify-content: center;
395
+ gap: 12px;
396
+ display: flex;
397
+ justify-content: center;
393
398
  padding: 12px;
394
399
 
395
400
  @media (max-width: 500px) {
@@ -418,7 +423,7 @@
418
423
 
419
424
  .dropdown-options {
420
425
  display: flex;
421
- flex-wrap: wrap;
426
+ flex-direction: column;
422
427
  gap: 6px;
423
428
 
424
429
  .dropdown-with-input-section {
@@ -461,7 +466,6 @@
461
466
  align-self: stretch;
462
467
  width: 36px;
463
468
  align-items: center;
464
- margin-top: 32px;
465
469
 
466
470
  .vertical_vector {
467
471
  height: 100%;
@@ -2465,7 +2465,7 @@ $minWidth: 70px;
2465
2465
  )
2466
2466
  );
2467
2467
  border-width: var(
2468
- --_sf-hr-br-wt,
2468
+ --_sf-hr-br-wh,
2469
2469
  var(
2470
2470
  --_ctm-mob-dn-ld-me-bn-br-wh,
2471
2471
  var(--_ctm-tab-dn-ld-me-bn-br-wh, var(--_ctm-dn-ld-me-bn-br-wh))
@@ -38,7 +38,7 @@
38
38
  --_ctm-mob-dn-hr-se-br-se,
39
39
  var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se))
40
40
  );
41
- --_sf-hr-br-wt: var(
41
+ --_sf-hr-br-wh: var(
42
42
  --_ctm-mob-dn-hr-se-br-wh,
43
43
  var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh))
44
44
  );
@@ -186,7 +186,7 @@
186
186
  var(--_ctm-mob-dn-dt-se-br-se, var(--_ctm-tab-dn-dt-se-br-se, var(--_ctm-dn-dt-se-br-se)))
187
187
  );
188
188
  border-width: var(
189
- --_sf-hr-br-wt,
189
+ --_sf-hr-br-wh,
190
190
  var(--_ctm-mob-dn-dt-se-br-wh, var(--_ctm-tab-dn-dt-se-br-wh, var(--_ctm-dn-dt-se-br-wh)))
191
191
  );
192
192
  }
package/dist/button.scss CHANGED
@@ -38,7 +38,7 @@
38
38
  --_ctm-mob-dn-hr-se-br-se,
39
39
  var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se))
40
40
  );
41
- --_sf-hr-br-wt: var(
41
+ --_sf-hr-br-wh: var(
42
42
  --_ctm-mob-dn-hr-se-br-wh,
43
43
  var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh))
44
44
  );
@@ -184,7 +184,8 @@
184
184
 
185
185
  line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-dt-se-le-ht));
186
186
 
187
- text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
187
+ text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-se-ue));
188
+ // text-decoration: var(--_ctm-mob-dn-ue, var(--_ctm-tab-dn-ue, var(--_ctm-dn-ue)));
188
189
  }
189
190
 
190
191
  .icon {
@@ -200,7 +200,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
200
200
  .wishlist-modal {
201
201
  display: flex;
202
202
  flex-direction: column;
203
- gap: 1rem;
203
+ // gap: 1rem; //cart template modal issue
204
204
  padding: 10px 16px;
205
205
  width: 100%;
206
206
  overflow-y: auto;
@@ -234,7 +234,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
234
234
 
235
235
  &:focus {
236
236
  border-color: #2563eb;
237
- box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
237
+ // box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
238
238
  }
239
239
 
240
240
  &[type="radio"] {
@@ -493,7 +493,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
493
493
  font-size: 18px;
494
494
  font-weight: 700;
495
495
  line-height: 28px;
496
- }
496
+ width: 380px;
497
+ white-space: nowrap;
498
+ overflow: hidden;
499
+ text-overflow: ellipsis; }
497
500
 
498
501
  .product_code {
499
502
  display: flex;
@@ -700,6 +703,14 @@ $resizeActive: '[data-cms-element-resizer="true"]';
700
703
  display: flex;
701
704
  justify-content: center;
702
705
  align-items: center;
706
+ svg {
707
+ path {
708
+ stroke: #9c9b9b;
709
+ }
710
+ &:hover {
711
+ stroke: #5f5f5f;
712
+ }
713
+ }
703
714
  }
704
715
  .product_action_button {
705
716
  display: flex;
@@ -30,12 +30,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
30
30
  align-items: center;
31
31
  align-self: stretch;
32
32
  border-radius: 4px;
33
- border: 1px solid var(--_gray-300);
34
- background: var(--_base-white);
33
+ border: 0.5px solid #d0d5dd;
34
+ background: #fff;
35
35
  // gap: var(--_ctm-lt-im-gp);
36
36
  padding: var(--_ctm-lt-pg);
37
37
  word-break: keep-all;
38
- overflow: hidden;
39
38
 
40
39
  .cart_summary_heading_wrapper {
41
40
  display: flex;
@@ -50,7 +49,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
50
49
  border-width: var(--_ctm-dn-te-cr-dn-br-wh);
51
50
  box-shadow: var(--_ctm-dn-te-cr-dn-sw-ae) var(--_ctm-dn-te-cr-dn-sw-br)
52
51
  var(--_ctm-dn-te-cr-dn-sw-sd) var(--_ctm-dn-te-cr-dn-sw-cr);
53
- border-bottom: 1px solid var(--_gray-300);
52
+
54
53
  .cart_summary_heading {
55
54
  width: 100%;
56
55
  color: var(--_ctm-dn-te-dn-cr);
@@ -125,8 +124,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
125
124
  width: 100%;
126
125
  padding: 8px 12px;
127
126
  border-radius: 8px;
128
- border: 1px solid var(--_gray-200);
129
- background-color: var(--_base-white);
127
+ border: 1px solid #d0d5dd;
128
+ background-color: #ffffff;
130
129
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
131
130
  font-size: 16px;
132
131
  line-height: 24px;
@@ -137,19 +136,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
137
136
  display: flex;
138
137
  flex: 1 0 0;
139
138
  flex-wrap: wrap;
140
- color: var(--_success-500);
139
+ color: green;
141
140
  }
142
141
 
143
142
  .error_message {
144
143
  display: flex;
145
144
  flex: 1 0 0;
146
145
  flex-wrap: wrap;
147
- color: var(--_error-500);
146
+ color: red;
148
147
  }
149
148
  }
150
- .border_dashed {
151
- border: 1px dashed var(--_gray-300);
152
- }
153
149
 
154
150
  .subtotal_wrapper {
155
151
  display: flex;
@@ -209,107 +205,82 @@ $resizeActive: '[data-cms-element-resizer="true"]';
209
205
  }
210
206
 
211
207
  .cart_summary_primary_btn_wrapper {
212
- // padding: var(--_ctm-lt-bn-pg) calc(var(--_ctm-lt-bn-pg) * 2);
213
- // width: 100%;
214
- // background-color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
215
- // border-color: var(--_ctm-dn-py-bn-dn-dt-se-br-cr);
216
- // border-radius: var(--_ctm-dn-py-bn-dn-dt-se-br-rs);
217
- // border-style: var(--_ctm-dn-py-bn-dn-dt-se-br-se);
218
- // border-width: var(--_ctm-dn-py-bn-dn-dt-se-br-wh);
219
- // color: var(--_ctm-dn-py-bn-dn-dt-se-cr);
220
- // font-family: var(--_ctm-dn-py-bn-dn-dt-se-ft-fy);
221
- // font-size: var(--_ctm-dn-py-bn-dn-dt-se-ft-se);
222
- // font-style: var(--_ctm-dn-py-bn-dn-dt-se-ft-se-ic);
223
- // font-weight: var(--_ctm-dn-py-bn-dn-dt-se-ft-wt);
224
- // line-height: var(--_ctm-dn-py-bn-dn-dt-se-le-ht);
225
- // letter-spacing: var(--_ctm-dn-py-bn-dn-dt-se-lr-sg);
226
- // box-shadow: var(--_ctm-dn-py-bn-dn-dt-se-sw-ae) var(--_ctm-dn-py-bn-dn-dt-se-sw-br)
227
- // var(--_ctm-dn-py-bn-dn-dt-se-sw-sd) var(--_ctm-dn-py-bn-dn-dt-se-sw-cr);
228
- // text-align: var(--_ctm-dn-py-bn-dn-dt-se-tt-an);
229
- // text-decoration: var(--_ctm-dn-py-bn-dn-dt-se-ue);
230
-
231
- // &:hover {
232
- // background-color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
233
- // border-color: var(--_ctm-dn-py-bn-dn-hr-se-br-cr);
234
- // border-radius: var(--_ctm-dn-py-bn-dn-hr-se-br-rs);
235
- // border-style: var(--_ctm-dn-py-bn-dn-hr-se-br-se);
236
- // border-width: var(--_ctm-dn-py-bn-dn-hr-se-br-wh);
237
- // color: var(--_ctm-dn-py-bn-dn-hr-se-cr);
238
- // font-family: var(--_ctm-dn-py-bn-dn-hr-se-ft-fy);
239
- // font-size: var(--_ctm-dn-py-bn-dn-hr-se-ft-se);
240
- // font-style: var(--_ctm-dn-py-bn-dn-hr-se-ft-se-ic);
241
- // font-weight: var(--_ctm-dn-py-bn-dn-hr-se-ft-wt);
242
- // line-height: var(--_ctm-dn-py-bn-dn-hr-se-le-ht);
243
- // letter-spacing: var(--_ctm-dn-py-bn-dn-hr-se-lr-sg);
244
- // box-shadow: var(--_ctm-dn-py-bn-dn-hr-se-sw-ae) var(--_ctm-dn-py-bn-dn-hr-se-sw-br)
245
- // var(--_ctm-dn-py-bn-dn-hr-se-sw-sd) var(--_ctm-dn-py-bn-dn-hr-se-sw-cr);
246
- // text-align: var(--_ctm-dn-py-bn-dn-hr-se-tt-an);
247
- // text-decoration: var(--_ctm-dn-py-bn-dn-hr-se-ue);
248
- // }
249
- padding: 16px 24px;
250
- width: fit-content;
251
- background-color: var(--_primary-400);
252
- color: var(--_base-white);
253
- border-radius: 4px;
254
- margin-top: 12px;
255
- font-weight: 600;
208
+ padding: var(--_ctm-lt-bn-pg) calc(var(--_ctm-lt-bn-pg) * 2);
256
209
  width: 100%;
210
+ background-color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
211
+ border-color: var(--_ctm-dn-py-bn-dn-dt-se-br-cr);
212
+ border-radius: var(--_ctm-dn-py-bn-dn-dt-se-br-rs);
213
+ border-style: var(--_ctm-dn-py-bn-dn-dt-se-br-se);
214
+ border-width: var(--_ctm-dn-py-bn-dn-dt-se-br-wh);
215
+ color: var(--_ctm-dn-py-bn-dn-dt-se-cr);
216
+ font-family: var(--_ctm-dn-py-bn-dn-dt-se-ft-fy);
217
+ font-size: var(--_ctm-dn-py-bn-dn-dt-se-ft-se);
218
+ font-style: var(--_ctm-dn-py-bn-dn-dt-se-ft-se-ic);
219
+ font-weight: var(--_ctm-dn-py-bn-dn-dt-se-ft-wt);
220
+ line-height: var(--_ctm-dn-py-bn-dn-dt-se-le-ht);
221
+ letter-spacing: var(--_ctm-dn-py-bn-dn-dt-se-lr-sg);
222
+ box-shadow: var(--_ctm-dn-py-bn-dn-dt-se-sw-ae) var(--_ctm-dn-py-bn-dn-dt-se-sw-br)
223
+ var(--_ctm-dn-py-bn-dn-dt-se-sw-sd) var(--_ctm-dn-py-bn-dn-dt-se-sw-cr);
224
+ text-align: var(--_ctm-dn-py-bn-dn-dt-se-tt-an);
225
+ text-decoration: var(--_ctm-dn-py-bn-dn-dt-se-ue);
257
226
 
258
227
  &:hover {
259
- background-color: var(--_primary-500);
228
+ background-color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
229
+ border-color: var(--_ctm-dn-py-bn-dn-hr-se-br-cr);
230
+ border-radius: var(--_ctm-dn-py-bn-dn-hr-se-br-rs);
231
+ border-style: var(--_ctm-dn-py-bn-dn-hr-se-br-se);
232
+ border-width: var(--_ctm-dn-py-bn-dn-hr-se-br-wh);
233
+ color: var(--_ctm-dn-py-bn-dn-hr-se-cr);
234
+ font-family: var(--_ctm-dn-py-bn-dn-hr-se-ft-fy);
235
+ font-size: var(--_ctm-dn-py-bn-dn-hr-se-ft-se);
236
+ font-style: var(--_ctm-dn-py-bn-dn-hr-se-ft-se-ic);
237
+ font-weight: var(--_ctm-dn-py-bn-dn-hr-se-ft-wt);
238
+ line-height: var(--_ctm-dn-py-bn-dn-hr-se-le-ht);
239
+ letter-spacing: var(--_ctm-dn-py-bn-dn-hr-se-lr-sg);
240
+ box-shadow: var(--_ctm-dn-py-bn-dn-hr-se-sw-ae) var(--_ctm-dn-py-bn-dn-hr-se-sw-br)
241
+ var(--_ctm-dn-py-bn-dn-hr-se-sw-sd) var(--_ctm-dn-py-bn-dn-hr-se-sw-cr);
242
+ text-align: var(--_ctm-dn-py-bn-dn-hr-se-tt-an);
243
+ text-decoration: var(--_ctm-dn-py-bn-dn-hr-se-ue);
260
244
  }
261
245
  }
262
246
 
263
247
  .submit_quotes {
264
- // padding: var(--_ctm-lt-bn-pg) calc(var(--_ctm-lt-bn-pg) * 2);
265
- // width: 100%;
266
- // border-color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
267
- // border-radius: var(--_ctm-dn-py-bn-dn-dt-se-br-rs);
268
- // border-style: var(--_ctm-dn-py-bn-dn-dt-se-br-se);
269
- // border-width: 1px;
270
- // background: white;
271
- // color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
272
- // font-family: var(--_ctm-dn-py-bn-dn-dt-se-ft-fy);
273
- // font-size: var(--_ctm-dn-py-bn-dn-dt-se-ft-se);
274
- // font-style: var(--_ctm-dn-py-bn-dn-dt-se-ft-se-ic);
275
- // font-weight: var(--_ctm-dn-py-bn-dn-dt-se-ft-wt);
276
- // line-height: var(--_ctm-dn-py-bn-dn-dt-se-le-ht);
277
- // letter-spacing: var(--_ctm-dn-py-bn-dn-dt-se-lr-sg);
278
- // box-shadow: var(--_ctm-dn-py-bn-dn-dt-se-sw-ae) var(--_ctm-dn-py-bn-dn-dt-se-sw-br)
279
- // var(--_ctm-dn-py-bn-dn-dt-se-sw-sd) var(--_ctm-dn-py-bn-dn-dt-se-sw-cr);
280
- // text-align: var(--_ctm-dn-py-bn-dn-dt-se-tt-an);
281
- // text-decoration: var(--_ctm-dn-py-bn-dn-dt-se-ue);
282
-
283
- // &:hover {
284
- // border-color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
285
- // border-radius: var(--_ctm-dn-py-bn-dn-hr-se-br-rs);
286
- // border-style: var(--_ctm-dn-py-bn-dn-hr-se-br-se);
287
- // border-width: 1px;
288
- // background: white;
289
- // color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
290
- // font-family: var(--_ctm-dn-py-bn-dn-hr-se-ft-fy);
291
- // font-size: var(--_ctm-dn-py-bn-dn-hr-se-ft-se);
292
- // font-style: var(--_ctm-dn-py-bn-dn-hr-se-ft-se-ic);
293
- // font-weight: var(--_ctm-dn-py-bn-dn-hr-se-ft-wt);
294
- // line-height: var(--_ctm-dn-py-bn-dn-hr-se-le-ht);
295
- // letter-spacing: var(--_ctm-dn-py-bn-dn-hr-se-lr-sg);
296
- // box-shadow: var(--_ctm-dn-py-bn-dn-hr-se-sw-ae) var(--_ctm-dn-py-bn-dn-hr-se-sw-br)
297
- // var(--_ctm-dn-py-bn-dn-hr-se-sw-sd) var(--_ctm-dn-py-bn-dn-hr-se-sw-cr);
298
- // text-align: var(--_ctm-dn-py-bn-dn-hr-se-tt-an);
299
- // text-decoration: var(--_ctm-dn-py-bn-dn-hr-se-ue);
300
- // }
301
- padding: 16px 24px;
302
- width: fit-content;
303
- background-color: var(--_base-white);
304
- color: var(--_gray-600);
305
- border-radius: 4px;
306
- font-weight: 600;
248
+ padding: var(--_ctm-lt-bn-pg) calc(var(--_ctm-lt-bn-pg) * 2);
307
249
  width: 100%;
308
- border: 1px solid var(--_gray-300);
250
+ border-color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
251
+ border-radius: var(--_ctm-dn-py-bn-dn-dt-se-br-rs);
252
+ border-style: var(--_ctm-dn-py-bn-dn-dt-se-br-se);
253
+ border-width: 1px;
254
+ background: white;
255
+ color: var(--_ctm-dn-py-bn-dn-dt-se-bd-cr);
256
+ font-family: var(--_ctm-dn-py-bn-dn-dt-se-ft-fy);
257
+ font-size: var(--_ctm-dn-py-bn-dn-dt-se-ft-se);
258
+ font-style: var(--_ctm-dn-py-bn-dn-dt-se-ft-se-ic);
259
+ font-weight: var(--_ctm-dn-py-bn-dn-dt-se-ft-wt);
260
+ line-height: var(--_ctm-dn-py-bn-dn-dt-se-le-ht);
261
+ letter-spacing: var(--_ctm-dn-py-bn-dn-dt-se-lr-sg);
262
+ box-shadow: var(--_ctm-dn-py-bn-dn-dt-se-sw-ae) var(--_ctm-dn-py-bn-dn-dt-se-sw-br)
263
+ var(--_ctm-dn-py-bn-dn-dt-se-sw-sd) var(--_ctm-dn-py-bn-dn-dt-se-sw-cr);
264
+ text-align: var(--_ctm-dn-py-bn-dn-dt-se-tt-an);
265
+ text-decoration: var(--_ctm-dn-py-bn-dn-dt-se-ue);
309
266
 
310
267
  &:hover {
311
- background-color: var(--_primary-50);
312
- color: var(--_primary-500);
268
+ border-color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
269
+ border-radius: var(--_ctm-dn-py-bn-dn-hr-se-br-rs);
270
+ border-style: var(--_ctm-dn-py-bn-dn-hr-se-br-se);
271
+ border-width: 1px;
272
+ background: white;
273
+ color: var(--_ctm-dn-py-bn-dn-hr-se-bd-cr);
274
+ font-family: var(--_ctm-dn-py-bn-dn-hr-se-ft-fy);
275
+ font-size: var(--_ctm-dn-py-bn-dn-hr-se-ft-se);
276
+ font-style: var(--_ctm-dn-py-bn-dn-hr-se-ft-se-ic);
277
+ font-weight: var(--_ctm-dn-py-bn-dn-hr-se-ft-wt);
278
+ line-height: var(--_ctm-dn-py-bn-dn-hr-se-le-ht);
279
+ letter-spacing: var(--_ctm-dn-py-bn-dn-hr-se-lr-sg);
280
+ box-shadow: var(--_ctm-dn-py-bn-dn-hr-se-sw-ae) var(--_ctm-dn-py-bn-dn-hr-se-sw-br)
281
+ var(--_ctm-dn-py-bn-dn-hr-se-sw-sd) var(--_ctm-dn-py-bn-dn-hr-se-sw-cr);
282
+ text-align: var(--_ctm-dn-py-bn-dn-hr-se-tt-an);
283
+ text-decoration: var(--_ctm-dn-py-bn-dn-hr-se-ue);
313
284
  }
314
285
  }
315
286
 
@@ -76,15 +76,22 @@
76
76
  margin-top: 20px;
77
77
  .attribute {
78
78
  width: 100%;
79
+ display: flex;
80
+ flex-direction: column;
81
+ gap: 6px;
79
82
  .label {
80
- display: block;
81
- font-size: var(--_ctm-dn-ct-as-is-ll-ft-se);
82
- font-weight: var(--_ctm-dn-ct-as-is-ll-ft-wt);
83
- color: var(--_ctm-dn-ct-as-is-ll-cr);
84
- margin-bottom: 0.5rem;
85
- letter-spacing: var(--_ctm-dn-ct-as-is-ll-lr-sg);
86
- line-height: var(--_ctm-dn-ct-as-is-ll-le-ht);
87
- margin-bottom: 10px;
83
+ // display: block;
84
+ // font-size: var(--_ctm-dn-ct-as-is-ll-ft-se);
85
+ // font-weight: var(--_ctm-dn-ct-as-is-ll-ft-wt);
86
+ // color: var(--_ctm-dn-ct-as-is-ll-cr);
87
+ // margin-bottom: 0.5rem;
88
+ // letter-spacing: var(--_ctm-dn-ct-as-is-ll-lr-sg);
89
+ // line-height: var(--_ctm-dn-ct-as-is-ll-le-ht);
90
+ color: var(--Gray-700, #344054);
91
+ font-size: 14px;
92
+ font-weight: 500;
93
+ line-height: 20px;
94
+ margin-bottom: 10px;
88
95
  display: block;
89
96
  &.required::after {
90
97
  content: " *";
@@ -98,6 +105,7 @@
98
105
  }
99
106
  .attribute_field {
100
107
  width: 100%;
108
+
101
109
  .attribute_form_field {
102
110
  width: 100%;
103
111
  }
@@ -105,10 +113,16 @@
105
113
  .attribute_form_field {
106
114
  width: 100% !important;
107
115
  padding: 12px;
108
- border-radius: var(--_ctm-dn-ct-as-is-fd-br-rs);
109
- border-style: var(--_ctm-dn-ct-as-is-fd-br-se);
110
- border-width: var(--_ctm-dn-ct-as-is-fd-br-wh);
111
- border-color: var(--_ctm-dn-ct-as-is-fd-br-cr);
116
+ border-radius: 4px;
117
+ border: 1px solid var(--Gray-300, #d0d5dd);
118
+ background: var(--Base-White, #fff);
119
+ color: var(--Gray-700, #344054);
120
+ /* Shadow/xs */
121
+ box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
122
+ // border-radius: var(--_ctm-dn-ct-as-is-fd-br-rs);
123
+ // border-style: var(--_ctm-dn-ct-as-is-fd-br-se);
124
+ // border-width: var(--_ctm-dn-ct-as-is-fd-br-wh);
125
+ // border-color: var(--_ctm-dn-ct-as-is-fd-br-cr);
112
126
  outline: none;
113
127
  transition: border-color 0.2s ease-in-out;
114
128
  font-size: 14px;
@@ -131,7 +145,6 @@
131
145
  }
132
146
  }
133
147
  }
134
-
135
148
  textarea {
136
149
  min-height: 100px;
137
150
  resize: vertical;
@@ -153,10 +166,19 @@
153
166
  }
154
167
 
155
168
  .custom-upload {
156
- text-align: center;
157
- border: 1px solid var(--_gray-200);
169
+ // text-align: center;
170
+ // border: 1px solid var(--_gray-200);
171
+ // border-radius: 6px;
172
+ // padding: 16px;
158
173
  border-radius: 6px;
159
- padding: 16px;
174
+ border: 1px solid var(--Gray-200, #eaecf0);
175
+ background: var(--Base-White, #fff);
176
+ display: flex;
177
+ padding: 16px 24px;
178
+ flex-direction: column;
179
+ align-items: center;
180
+ gap: 4px;
181
+ align-self: stretch;
160
182
  &:hover {
161
183
  cursor: pointer;
162
184
  border: 1px solid var(--_primary-200);
@@ -175,12 +197,43 @@
175
197
  color: var(--_gray-600);
176
198
  font-size: 14px;
177
199
  strong {
178
- color: var(--_primary-400);
200
+ // color: var(--_primary-400);
201
+ // font-weight: 600;
202
+ color: var(--Primary-400, #243dc6);
203
+ font-size: 14px;
179
204
  font-weight: 600;
205
+ // line-height: 20px;
180
206
  }
181
207
  }
182
208
  span {
183
- color: var(--_gray-600);
184
- font-size: 12px;
209
+ color: var(--Gray-600, #475467);
210
+ font-size: 14px;
211
+ font-weight: 400;
212
+ // line-height: 20px;
213
+ }
214
+ }
215
+
216
+ .input_color_picker_a {
217
+ width: 100% !important;
218
+ height: 48px;
219
+ border-radius: 4px;
220
+ border: 1px solid var(--Gray-300, #d0d5dd);
221
+ background: var(--Base-White, #fff);
222
+ box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
223
+ outline: none;
224
+ transition: border-color 0.2s ease-in-out;
225
+ font-size: 14px;
226
+ cursor: pointer;
227
+ }
228
+ .attribute_currency_field {
229
+ position: relative;
230
+ input {
231
+ padding: 12px 12px 12px 32px !important;
232
+ }
233
+ svg {
234
+ position: absolute;
235
+ left: 8px;
236
+ top: 10px;
237
+ background: #fff;
185
238
  }
186
239
  }
@@ -78,11 +78,12 @@ $button-padding: 6px 12px;
78
78
  display: flex;
79
79
  flex-direction: column;
80
80
  width: 260px;
81
+ // width: 220px;
81
82
  .header-template {
82
83
  display: flex;
83
84
  align-items: center;
84
85
  justify-content: space-between;
85
- padding: $spacing-md;
86
+ padding: 8px 12px 10px 12px;
86
87
  border-bottom: 1px solid #eee;
87
88
 
88
89
  span {
@@ -95,7 +96,7 @@ $button-padding: 6px 12px;
95
96
  color: $primary-color;
96
97
  font-size: $header-btn-font-size;
97
98
  background: none;
98
- border: none;
99
+ border: 1px solid transparent;
99
100
  cursor: pointer;
100
101
  transition: color 0.2s ease-in-out;
101
102
 
@@ -111,13 +112,11 @@ $button-padding: 6px 12px;
111
112
  .option {
112
113
  display: flex;
113
114
  align-items: center;
114
- padding: 12px;
115
+ padding: 8px $spacing-md;
115
116
  cursor: pointer;
116
117
  font-size: $font-size;
118
+ min-height: 48px;
117
119
  border-radius: 4px;
118
- &:not(:last-child) {
119
- margin-bottom: 2px;
120
- }
121
120
 
122
121
  &.disabled {
123
122
  .label-content {
@@ -133,8 +132,7 @@ $button-padding: 6px 12px;
133
132
  }
134
133
 
135
134
  &:hover {
136
- background-color: var(--_primary-25);
137
- color: var(--_primary-500);
135
+ background-color: var(--_gray-100);
138
136
  }
139
137
 
140
138
  input {
@@ -148,8 +146,7 @@ $button-padding: 6px 12px;
148
146
  }
149
147
 
150
148
  &:has(input[type="radio"]:checked) {
151
- background-color: var(--_primary-25);
152
- color: $primary-color;
149
+ background-color: var(--_gray-200);
153
150
  }
154
151
  }
155
152
 
@@ -161,7 +158,7 @@ $button-padding: 6px 12px;
161
158
 
162
159
  .dropdown_overlay_secondary_button {
163
160
  background: transparent;
164
- border: none;
161
+ border: 1px solid transparent;
165
162
  color: $text-color;
166
163
  cursor: pointer;
167
164
  display: flex;
@@ -172,6 +169,7 @@ $button-padding: 6px 12px;
172
169
  &:hover {
173
170
  border: 1px solid $primary-color;
174
171
  border-radius: 4px;
172
+ color: $primary-color;
175
173
  }
176
174
  }
177
175
 
@@ -1,6 +1,5 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
- @use "./form-zindex-module.scss" as *;
4
3
 
5
4
  [data-div-type="element"] {
6
5
  &[data-element-type="contactUs"],
@@ -23,8 +22,6 @@
23
22
  // justify-content: center;
24
23
  // width: 100%;
25
24
  // height: 100%;
26
-
27
- @include FlexFormZindexModuleStyles();
28
25
  }
29
26
 
30
27
  & form {
@@ -1,5 +1,5 @@
1
1
  @font-face {
2
- font-family: "poppins";
2
+ font-family: "Poppins";
3
3
  // font-family: 'Roboto',Arial,Calibiri,sans-serif;
4
4
  font-style: normal;
5
5
  font-weight: 400;
@@ -10,7 +10,7 @@
10
10
 
11
11
  /* Inter-Medium*/
12
12
  @font-face {
13
- font-family: "poppins";
13
+ font-family: "Poppins";
14
14
  font-style: normal;
15
15
  font-weight: 500;
16
16
  font-display: swap;
@@ -20,7 +20,7 @@
20
20
 
21
21
  /* Inter-SemiBold*/
22
22
  @font-face {
23
- font-family: "poppins";
23
+ font-family: "Poppins";
24
24
  font-style: normal;
25
25
  font-weight: 600;
26
26
  font-display: swap;
@@ -30,7 +30,7 @@
30
30
 
31
31
  /* Inter-Bold*/
32
32
  @font-face {
33
- font-family: "poppins";
33
+ font-family: "Poppins";
34
34
  font-style: normal;
35
35
  font-weight: 700;
36
36
  font-display: swap;
@@ -50,7 +50,7 @@
50
50
 
51
51
  /* Inter-Black*/
52
52
  @font-face {
53
- font-family: "poppins";
53
+ font-family: "Poppins";
54
54
  font-style: normal;
55
55
  font-weight: 900;
56
56
  font-display: swap;