@sc-360-v2/storefront-cms-library 0.3.16 → 0.3.17

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 (7) hide show
  1. package/dist/cart-details.scss +60 -87
  2. package/dist/confirmationModal.scss +12 -2
  3. package/dist/dropdownTemplate.scss +7 -0
  4. package/dist/layouter.scss +6 -4
  5. package/dist/repeater.scss +7 -8
  6. package/dist/toggle-button.scss +12 -12
  7. package/package.json +1 -1
package/dist/cart-details.scss CHANGED
@@ -409,91 +409,75 @@ $resizeActive: '[data-cms-element-resizer="true"]';
409
409
 
410
410
  .section {
411
411
  padding: 12px;
412
- border-block: 1px solid #d9d9d9;
413
- }
414
-
415
- .section-title {
416
- font-size: 1rem;
417
- font-weight: 600;
418
- color: #111827;
412
+ border: 1px solid #d9d9d9;
413
+ .section-title {
414
+ font-size: 1rem;
415
+ font-weight: 600;
416
+ color: #111827;
419
417
 
420
- cursor: pointer;
418
+ cursor: pointer;
421
419
 
422
- &.error {
423
- color: #dc2626;
420
+ &.error {
421
+ color: #dc2626;
422
+ }
424
423
  }
425
- }
426
-
427
- .section-body {
428
- padding-top: 1rem;
429
- }
430
- .attribute {
431
- margin-bottom: 1.25rem;
432
- }
433
424
 
434
- .label {
435
- display: block;
436
- font-size: 0.875rem;
437
- font-weight: 500;
438
- color: #374151;
439
- margin-bottom: 0.5rem;
440
-
441
- &.required::after {
442
- content: " *";
443
- color: #dc2626;
444
- }
445
- }
425
+ .section-body {
426
+ padding-top: 1rem;
427
+ .attribute {
428
+ margin-bottom: 1.25rem;
429
+ .label {
430
+ display: block;
431
+ font-size: 0.875rem;
432
+ font-weight: 500;
433
+ color: #374151;
434
+ margin-bottom: 0.5rem;
435
+
436
+ &.required::after {
437
+ content: " *";
438
+ color: #dc2626;
439
+ }
440
+ }
441
+ .attribute_form_field {
442
+ width: 100% !important;
443
+ padding: 8px 12px !important;
444
+ border-radius: 4px;
445
+ border: 1px solid #ccc;
446
+ /* background-color: #f9fafb !important; */
447
+ outline: none;
448
+ transition: border-color 0.2s ease-in-out;
449
+ font-size: 14px;
450
+ height: 40px;
451
+
452
+ &:focus {
453
+ border-color: #3b82f6;
454
+ background-color: #fff;
455
+ }
446
456
 
447
- .input,
448
- select,
449
- textarea {
450
- width: 100% !important;
451
- padding: 8px 12px !important;
452
- border-radius: 4px;
453
- border: 1px solid #ccc;
454
- /* background-color: #f9fafb !important; */
455
- outline: none;
456
- transition: border-color 0.2s ease-in-out;
457
- font-size: 14px;
458
- height: 40px;
459
-
460
- &:focus {
461
- border-color: #3b82f6;
462
- background-color: #fff;
463
- }
457
+ &.error {
458
+ border-color: #dc2626;
459
+ background-color: #fef2f2;
460
+ }
461
+ }
464
462
 
465
- &.error {
466
- border-color: #dc2626;
467
- background-color: #fef2f2;
463
+ textarea {
464
+ min-height: 100px;
465
+ resize: vertical;
466
+ }
467
+ }
468
+ .cart_item_attr_disabled {
469
+ pointer-events: none;
470
+ opacity: 0.5;
471
+ cursor: none;
472
+ }
468
473
  }
469
474
  }
470
475
 
471
- textarea {
472
- min-height: 100px;
473
- resize: vertical;
474
- }
475
-
476
- .error-text {
477
- font-size: 0.75rem;
478
- color: #dc2626;
479
- margin-top: 0.25rem;
480
- }
481
-
482
- .submit-btn {
483
- background-color: #3b82f6;
484
- color: #fff;
485
- padding: 0.5rem 1rem;
486
- font-size: 0.875rem;
487
- font-weight: 500;
488
- border: none;
489
- border-radius: 0.5rem;
490
- cursor: pointer;
491
- margin-top: 2rem;
492
-
493
- &:hover {
494
- background-color: #2563eb;
495
- }
496
- }
476
+ // .error-text {
477
+ // font-size: 0.75rem;
478
+ // color: #dc2626;
479
+ // margin-top: 0.25rem;
480
+ // }
497
481
  }
498
482
 
499
483
  .infinite-list-container {
@@ -507,17 +491,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
507
491
  max-width: 100%;
508
492
  min-width: 100%;
509
493
  }
510
- // padding: 1rem;
511
- // border: 1px solid #e0e0e0;
512
- // border-radius: 12px;
513
- // background-color: #fff;
514
- // box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
515
- // transition: box-shadow 0.2s ease;
516
-
517
- // &:hover {
518
- // box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
519
- // }
520
- // }
521
494
 
522
495
  .pagination {
523
496
  display: flex;
package/dist/confirmationModal.scss CHANGED
@@ -64,16 +64,26 @@
64
64
  border: 1px solid #d0d5dd;
65
65
  }
66
66
  }
67
-
68
67
  .confirm-button {
69
- background-color: #dc2626; // red-600
70
68
  color: #ffffff;
71
69
  font-weight: 600;
70
+ }
71
+
72
+ .confirmation-button {
73
+ background-color: #dc2626; // red-600
72
74
 
73
75
  &:hover {
74
76
  background-color: #b91c1c;
75
77
  }
76
78
  }
79
+
80
+ .primaryConfirmation-button {
81
+ background-color: #162578; // red-600
82
+
83
+ &:hover {
84
+ background-color: #101c5f;
85
+ }
86
+ }
77
87
  }
78
88
  }
79
89
  }
package/dist/dropdownTemplate.scss CHANGED
@@ -213,3 +213,10 @@
213
213
  font-size: 14px;
214
214
  }
215
215
  }
216
+
217
+ .text-ellipsis {
218
+ overflow: hidden;
219
+ max-width: 100%;
220
+ text-overflow: ellipsis;
221
+ white-space: nowrap;
222
+ }
package/dist/layouter.scss CHANGED
@@ -174,10 +174,12 @@ $sliderControlDragging: "[flex-slider-control-moving='true']";
174
174
  // width: calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
175
175
  flex: 0 0 var(--_sf-cl-vl);
176
176
  width: var(--_sf-cl-vl);
177
- grid-template-rows: minmax(
178
- max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
179
- auto
180
- );
177
+ // grid-template-rows: minmax(
178
+ // max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
179
+ // auto
180
+ // );
181
+
182
+ grid-template-rows: minmax(50px, auto);
181
183
  grid-template-columns: minmax(0px, 1fr);
182
184
  // padding-left: calc(var(--_embla-slide-space, 10px) * 1);
183
185
  // padding-left: 0px !important;
package/dist/repeater.scss CHANGED
@@ -292,10 +292,11 @@ $rai: "repeater-advertise-item";
292
292
  // width: calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
293
293
  flex: 0 0 var(--_sf-cl-vl);
294
294
  width: var(--_sf-cl-vl);
295
- grid-template-rows: minmax(
296
- max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
297
- auto
298
- );
295
+ // grid-template-rows: minmax(
296
+ // max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
297
+ // auto
298
+ // );
299
+ grid-template-rows: minmax(50px, auto);
299
300
  grid-template-columns: minmax(0px, 1fr);
300
301
  // padding-left: calc(var(--_embla-slide-space, 10px) * 1);
301
302
  // padding-left: 0px !important;
@@ -466,8 +467,7 @@ $rai: "repeater-advertise-item";
466
467
  --_ctm-mob-rep-dn-bn-se-dt-se-cr,
467
468
  var(--_ctm-tab-rep-dn-bn-se-dt-se-cr, var(--_ctm-rep-dn-bn-se-dt-se-cr))
468
469
  );
469
- font-family:
470
- var(
470
+ font-family: var(
471
471
  --_ctm-mob-rep-dn-bn-se-dt-se-ft-fy,
472
472
  var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-fy, var(--_ctm-rep-dn-bn-se-dt-se-ft-fy))
473
473
  ),
@@ -625,8 +625,7 @@ $rai: "repeater-advertise-item";
625
625
  --_ctm-mob-rep-dn-bn-se-hr-se-cr,
626
626
  var(--_ctm-tab-rep-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
627
627
  );
628
- font-family:
629
- var(
628
+ font-family: var(
630
629
  --_ctm-mob-rep-dn-bn-se-hr-se-ft-fy,
631
630
  var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
632
631
  ),
package/dist/toggle-button.scss CHANGED
@@ -1,18 +1,18 @@
1
1
  .toggle__button {
2
- position: var(--_p-relative);
3
- width: var(--_width-36);
4
- height: var(--_height-20);
5
- background-color: var(--_gray-100);
6
- border-radius: var(--_br-12);
2
+ position: relative;
3
+ width: 36px;
4
+ height: 20px;
5
+ background-color: #d0d5dd;
6
+ border-radius: 12px;
7
7
  cursor: pointer;
8
8
 
9
9
  .toggle__slider {
10
- position: var(--_p-absolute);
11
- top: var(--_top-2);
12
- left: var(--_left-2);
10
+ position: absolute;
11
+ top: 2px;
12
+ left: 2px;
13
13
  transform: translateY(0%);
14
- width: var(--_width-16);
15
- height: var(--_width-16);
14
+ width: 16px;
15
+ height: 16px;
16
16
  background-color: #fff;
17
17
  border-radius: 50%;
18
18
  transition: transform 0.3s ease;
@@ -22,10 +22,10 @@
22
22
  }
23
23
 
24
24
  &.toggle__active {
25
- background: var(--_primary-600);
25
+ background: #132067;
26
26
 
27
27
  .toggle__slider {
28
- top: var(--_top-2);
28
+ top: 2px;
29
29
  transform: translateX(16px);
30
30
  }
31
31
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sc-360-v2/storefront-cms-library",
3
- "version": "0.3.16",
3
+ "version": "0.3.17",
4
4
  "main": "/dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "exports": {