@sc-360-v2/storefront-cms-library 0.3.91 → 0.3.93

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.
@@ -545,6 +545,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
545
545
  // white-space: nowrap;
546
546
  // overflow: hidden;
547
547
  text-overflow: ellipsis;
548
+ line-height: 24px;
549
+ margin-bottom: 4px;
548
550
 
549
551
  color: var(
550
552
  --_ctm-mob-dn-pt-ne-ss-cr,
@@ -574,10 +576,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
574
576
  var(--_ctm-tab-dn-pt-ne-ss-tt-an, var(--_ctm-dn-pt-ne-ss-tt-an))
575
577
  );
576
578
 
577
- line-height: var(
578
- --_ctm-mob-dn-pt-ne-ss-le-ht,
579
- var(--_ctm-tab-dn-pt-ne-ss-le-ht, var(--_ctm-dn-pt-ne-ss-le-ht))
580
- );
581
579
  text-decoration: var(
582
580
  --_ctm-mob-dn-pt-ne-ss-ue,
583
581
  var(--_ctm-tab-dn-pt-ne-ss-ue, var(--_ctm-dn-pt-ne-ss-ue))
@@ -589,6 +587,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
589
587
  align-items: center;
590
588
  align-self: stretch;
591
589
  flex-wrap: wrap;
590
+ font-size: 14px;
592
591
 
593
592
  span {
594
593
  // color: var(--_gray-600);
@@ -603,10 +602,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
603
602
  var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
604
603
  )
605
604
  );
606
- font-size: var(
607
- --_ctm-mob-dn-pt-in-ss-ft-se,
608
- var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
609
- );
605
+ // font-size: var(
606
+ // --_ctm-mob-dn-pt-in-ss-ft-se,
607
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
608
+ // );
610
609
  font-weight: var(
611
610
  --_ctm-mob-dn-pt-in-ss-ft-wt,
612
611
  var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
@@ -652,6 +651,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
652
651
  gap: 4px;
653
652
  align-self: stretch;
654
653
  flex-wrap: wrap;
654
+ font-size: 14px;
655
655
  span {
656
656
  white-space: nowrap;
657
657
  color: var(
@@ -665,10 +665,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
665
665
  var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
666
666
  )
667
667
  );
668
- font-size: var(
669
- --_ctm-mob-dn-pt-in-ss-ft-se,
670
- var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
671
- );
668
+ // font-size: var(
669
+ // --_ctm-mob-dn-pt-in-ss-ft-se,
670
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
671
+ // );
672
672
  font-weight: var(
673
673
  --_ctm-mob-dn-pt-in-ss-ft-wt,
674
674
  var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
@@ -164,6 +164,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
164
164
  // padding: calc(var(--_ctm-lt-by-pg) / 2) var(--_ctm-lt-by-pg);
165
165
  // padding: var(--_ctm-lt-by-pg);
166
166
  // gap: var(--_ctm-lt-im-gp);
167
+ border-top: 1px solid var(--_gray-300);
167
168
  background-color: var(
168
169
  --_ctm-mob-dn-ct-by-wt-bd-cr,
169
170
  var(--_ctm-tab-dn-ct-by-wt-bd-cr, var(--_ctm-dn-ct-by-wt-bd-cr))
@@ -592,7 +593,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
592
593
  .cart_summary_content_details_wrapper {
593
594
  display: flex;
594
595
  flex-direction: column;
595
- gap: 8px;
596
+ gap: 12px;
596
597
  .cart_summary_shippingLabel_text {
597
598
  // font-size: 14px;
598
599
  // color: var(--_gray-500);
@@ -752,7 +753,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
752
753
  .cart_summary_total_wrapper {
753
754
  display: flex;
754
755
  flex-direction: column;
755
- gap: 8px;
756
+ gap: 12px;
756
757
  .subtotal_wrapper {
757
758
  display: flex;
758
759
  align-items: center;
package/dist/cart.scss CHANGED
@@ -3,13 +3,13 @@
3
3
 
4
4
  [data-div-type="element"] {
5
5
  &[data-element-type="cart"] {
6
- width: var(
7
- --_ctm-mob-ele-nw-wh-st-mx,
8
- var(
9
- --_ctm-tab-ele-nw-wh-st-mx,
10
- var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
- )
12
- );
6
+ // width: var(
7
+ // --_ctm-mob-ele-nw-wh-st-mx,
8
+ // var(
9
+ // --_ctm-tab-ele-nw-wh-st-mx,
10
+ // var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
+ // )
12
+ // );
13
13
 
14
14
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
15
15
 
@@ -220,7 +220,6 @@
220
220
  --_ctm-mob-dn-mi-ct-tt-le-ht-dc,
221
221
  var(--_ctm-tab-dn-mi-ct-tt-le-ht-dc, var(--_ctm-dn-mi-ct-tt-le-ht-dc))
222
222
  );
223
-
224
223
  }
225
224
  }
226
225
  }
@@ -88,7 +88,7 @@ $button-padding: 6px 12px;
88
88
  display: flex;
89
89
  align-items: center;
90
90
  justify-content: space-between;
91
- padding: 10px 12px 16px 16px;
91
+ padding: 14px;
92
92
  border-bottom: 1px solid #eee;
93
93
 
94
94
  span {
@@ -178,7 +178,7 @@ $button-padding: 6px 12px;
178
178
  display: flex;
179
179
  align-items: start;
180
180
  gap: 6px;
181
- padding: 8px $spacing-md;
181
+ padding: 12px;
182
182
  cursor: pointer;
183
183
  font-size: $font-size;
184
184
  // min-height: 48px;
@@ -199,6 +199,10 @@ $button-padding: 6px 12px;
199
199
  .label-content {
200
200
  display: flex;
201
201
  flex-direction: column;
202
+ font-weight: 400;
203
+ &.selected {
204
+ color: var(--_thm-cs-tt-ls-as);
205
+ }
202
206
 
203
207
  .option-description {
204
208
  & > div {
@@ -257,7 +261,7 @@ $button-padding: 6px 12px;
257
261
  border-radius: 4px;
258
262
 
259
263
  &:hover {
260
- color: var(--_primary-400);
264
+ color: var(--_gray-900);
261
265
  background-color: var(--_gray-100);
262
266
  }
263
267
  }
@@ -277,7 +281,7 @@ $button-padding: 6px 12px;
277
281
  margin: $spacing-md 0px;
278
282
  &.disabled {
279
283
  opacity: 0.5;
280
- pointer-events: none;
284
+ pointer-events: none !important;
281
285
  }
282
286
 
283
287
  &:hover {
@@ -268,7 +268,7 @@ $dark-color: #343a40;
268
268
  display: flex;
269
269
  justify-content: space-between;
270
270
  align-items: center;
271
- cursor: pointer;
271
+ cursor: auto;
272
272
  background-color: var(
273
273
  --_ctm-mob-dn-an-tb-an-hr-bd-cr,
274
274
  var(--_ctm-tab-dn-an-tb-an-hr-bd-cr, var(--_ctm-dn-an-tb-an-hr-bd-cr))
@@ -722,99 +722,12 @@ $dark-color: #343a40;
722
722
  // color: var(--_primary-400);
723
723
  display: flex;
724
724
  gap: 4px;
725
- background-color: var(
726
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
727
- var(
728
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr,
729
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)
730
- )
731
- );
732
- border-color: var(
733
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
734
- var(
735
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr,
736
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)
737
- )
738
- );
739
- border-radius: var(
740
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
741
- var(
742
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs,
743
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)
744
- )
745
- );
746
- border-style: var(
747
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
748
- var(
749
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se,
750
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)
751
- )
752
- );
753
- border-width: var(
754
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
755
- var(
756
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh,
757
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)
758
- )
759
- );
725
+
760
726
  color: var(
761
727
  --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
762
728
  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr))
763
729
  );
764
- font-family: var(
765
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
766
- var(
767
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy,
768
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)
769
- )
770
- );
771
- font-size: var(
772
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
773
- var(
774
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se,
775
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)
776
- )
777
- );
778
- font-style: var(
779
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
780
- var(
781
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
782
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)
783
- )
784
- );
785
- font-weight: var(
786
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
787
- var(
788
- --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt,
789
- var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)
790
- )
791
- );
792
- // line-height: var(
793
- // --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
794
- // var(
795
- // --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht,
796
- // var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)
797
- // )
798
- // );
799
- // letter-spacing: var(
800
- // --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
801
- // var(
802
- // --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg,
803
- // var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)
804
- // )
805
- // );
806
- -webkit-text-decoration: var(
807
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
808
- var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue))
809
- );
810
- text-decoration: var(
811
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
812
- var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue))
813
- );
814
- padding: var(
815
- --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
816
- var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg))
817
- );
730
+
818
731
  text-align: var(
819
732
  --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
820
733
  var(
@@ -823,118 +736,7 @@ $dark-color: #343a40;
823
736
  )
824
737
  );
825
738
  &:hover {
826
- background-color: var(
827
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-bd-cr,
828
- var(
829
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-bd-cr,
830
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-bd-cr)
831
- )
832
- );
833
- border-color: var(
834
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-cr,
835
- var(
836
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-cr,
837
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-cr)
838
- )
839
- );
840
- border-radius: var(
841
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-rs,
842
- var(
843
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-rs,
844
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-rs)
845
- )
846
- );
847
- border-style: var(
848
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-se,
849
- var(
850
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-se,
851
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-se)
852
- )
853
- );
854
- border-width: var(
855
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-wh,
856
- var(
857
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-wh,
858
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-wh)
859
- )
860
- );
861
- color: var(
862
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-cr,
863
- var(
864
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-cr,
865
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-cr)
866
- )
867
- );
868
- font-family: var(
869
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-fy,
870
- var(
871
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-fy,
872
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-fy)
873
- )
874
- );
875
- font-size: var(
876
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se,
877
- var(
878
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se,
879
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se)
880
- )
881
- );
882
- font-style: var(
883
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
884
- var(
885
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
886
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se-ic)
887
- )
888
- );
889
- font-weight: var(
890
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-wt,
891
- var(
892
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-wt,
893
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-wt)
894
- )
895
- );
896
- // line-height: var(
897
- // --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-le-ht,
898
- // var(
899
- // --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-le-ht,
900
- // var(--_ctm-dn-an-tb-bs-ty-py-hr-se-le-ht)
901
- // )
902
- // );
903
- letter-spacing: var(
904
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-lr-sg,
905
- var(
906
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-lr-sg,
907
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-lr-sg)
908
- )
909
- );
910
- -webkit-text-decoration: var(
911
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
912
- var(
913
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue,
914
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)
915
- )
916
- );
917
- text-decoration: var(
918
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
919
- var(
920
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue,
921
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)
922
- )
923
- );
924
- padding: var(
925
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-pg,
926
- var(
927
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-pg,
928
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-pg)
929
- )
930
- );
931
- text-align: var(
932
- --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-tt-an,
933
- var(
934
- --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-tt-an,
935
- var(--_ctm-dn-an-tb-bs-ty-py-hr-se-tt-an)
936
- )
937
- );
739
+ text-decoration: underline;
938
740
  }
939
741
  }
940
742
 
@@ -1033,6 +835,7 @@ $dark-color: #343a40;
1033
835
  display: flex;
1034
836
  flex-direction: column;
1035
837
  width: 100%;
838
+ gap: 6px;
1036
839
  // margin-bottom: 6px;
1037
840
  }
1038
841
 
@@ -4856,12 +4659,12 @@ $dark-color: #343a40;
4856
4659
  flex-direction: column;
4857
4660
  // gap: var(--_ctm-lt-ll-ad-it-gp);
4858
4661
  width: 100%;
4662
+ gap: 6px;
4859
4663
  }
4860
4664
 
4861
4665
  .chk_shipping_address_form_label {
4862
4666
  // color: var(--_gray-600);
4863
4667
  // font-size: 14px;
4864
- padding-bottom: 6px;
4865
4668
  font-family: var(
4866
4669
  --_ctm-mob-dn-an-tb-fm-wr-ls-ft-fy,
4867
4670
  var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-fy, var(--_ctm-dn-an-tb-fm-wr-ls-ft-fy))
@@ -5369,6 +5172,7 @@ $dark-color: #343a40;
5369
5172
  padding: 12px;
5370
5173
  border-radius: 4px;
5371
5174
  cursor: pointer;
5175
+ transition: bacground 400ms ease-in;
5372
5176
  // gap: 0.5rem;
5373
5177
  background-color: var(
5374
5178
  --_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr,
@@ -5424,7 +5228,7 @@ $dark-color: #343a40;
5424
5228
  display: flex;
5425
5229
  flex-direction: column;
5426
5230
  gap: 12px;
5427
- max-width: 700px;
5231
+ max-width: 650px;
5428
5232
 
5429
5233
  .chk_address {
5430
5234
  display: flex;
@@ -5432,24 +5236,18 @@ $dark-color: #343a40;
5432
5236
  gap: calc(var(--_ctm-lt-sd-sg-as-le-gp) / 2);
5433
5237
 
5434
5238
  .chk_saved_address_name {
5435
- // color: var(--_gray-700);
5436
- // font-size: 16px;
5437
- // font-weight: 600;
5438
-
5439
5239
  color: var(--_gray-900);
5440
5240
  font-weight: 700;
5441
5241
  font-size: 16px;
5442
5242
  }
5443
5243
 
5444
5244
  .chk_saved_address {
5445
- // color: var(--_gray-600);
5446
- // font-size: 12px;
5447
-
5448
5245
  color: var(--_gray-500);
5449
5246
  font-weight: 400;
5450
5247
  font-size: 14px;
5451
5248
  font-weight: 400;
5452
5249
  margin-top: 6px;
5250
+ line-height: 24px;
5453
5251
  }
5454
5252
  }
5455
5253
 
@@ -5486,6 +5284,9 @@ $dark-color: #343a40;
5486
5284
  display: none;
5487
5285
  align-items: center;
5488
5286
  gap: 24px;
5287
+ &.selected {
5288
+ display: block;
5289
+ }
5489
5290
 
5490
5291
  &:has(.chk_saved_address_button.selected) {
5491
5292
  display: flex !important;
@@ -5507,7 +5308,7 @@ $dark-color: #343a40;
5507
5308
  .right-btn {
5508
5309
  display: flex;
5509
5310
  align-items: center;
5510
- height: fit-content;
5311
+ // height: fit-content;
5511
5312
  }
5512
5313
  }
5513
5314
  &:hover {
@@ -3,13 +3,13 @@
3
3
 
4
4
  [data-div-type="element"] {
5
5
  &[data-element-type="filterResults"] {
6
- width: var(
7
- --_ctm-mob-ele-nw-wh-st-mx,
8
- var(
9
- --_ctm-tab-ele-nw-wh-st-mx,
10
- var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
- )
12
- );
6
+ // width: var(
7
+ // --_ctm-mob-ele-nw-wh-st-mx,
8
+ // var(
9
+ // --_ctm-tab-ele-nw-wh-st-mx,
10
+ // var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
+ // )
12
+ // );
13
13
 
14
14
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
15
15
 
@@ -137,6 +137,7 @@ $height: 300px;
137
137
  }
138
138
  #{$macroChip}:is(#{$editorIframe} *, #{$dataDecodedV2}) {
139
139
  @extend .macro_styles;
140
+ user-select: all;
140
141
  }
141
142
 
142
143
  #{$macroChip}:not(#{$dataDecoded}, #{$dataDecodedV2}) {
@@ -59,6 +59,28 @@
59
59
  gap: 8px;
60
60
  }
61
61
 
62
+ .input__error {
63
+ border: 1px solid var(--_error-300) !important;
64
+
65
+ &:focus {
66
+ outline: 2px solid var(--_error-100) !important;
67
+ }
68
+
69
+ box-shadow: 0px 0px 0px 4px var(--_error-100);
70
+ }
71
+
72
+ .error_styles {
73
+ span {
74
+ svg {
75
+ width: 14px;
76
+ height: 14px;
77
+ path {
78
+ stroke: var(--_error-500);
79
+ }
80
+ }
81
+ }
82
+ }
83
+
62
84
  .toggle_input {
63
85
  display: flex;
64
86
  svg {
@@ -83,11 +105,14 @@
83
105
  }
84
106
  input:not([type="checkbox"][type="radio"]),
85
107
  select {
86
- border: 1px solid var(--_gray-300);
108
+ border: 1px solid var(--_primary-300);
87
109
  border-radius: 6px;
88
110
  padding-inline: 12px;
89
111
  width: 100%;
90
112
  height: 38px;
113
+ &:focus {
114
+ outline: 2px solid var(--_primary-100);
115
+ }
91
116
  }
92
117
  input[type="tel"] {
93
118
  border-top-left-radius: 0px !important;
@@ -9,6 +9,7 @@
9
9
  img {
10
10
  max-height: 100%;
11
11
  object-fit: contain;
12
+ padding: 4px;
12
13
  }
13
14
  .no_image {
14
15
  padding: 16px;
package/dist/loader.scss CHANGED
@@ -3,13 +3,13 @@
3
3
 
4
4
  [data-div-type="element"] {
5
5
  &[data-element-type="loader"] {
6
- width: var(
7
- --_ctm-mob-ele-nw-wh-st-mx,
8
- var(
9
- --_ctm-tab-ele-nw-wh-st-mx,
10
- var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
- )
12
- );
6
+ // width: var(
7
+ // --_ctm-mob-ele-nw-wh-st-mx,
8
+ // var(
9
+ // --_ctm-tab-ele-nw-wh-st-mx,
10
+ // var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
11
+ // )
12
+ // );
13
13
 
14
14
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
15
15
 
@@ -110,6 +110,7 @@ $defaultValues: (
110
110
 
111
111
  & > #{$hamburger} {
112
112
  display: var(--_d-flex);
113
+ pointer-events: all;
113
114
  }
114
115
  }
115
116
 
@@ -369,6 +370,7 @@ $defaultValues: (
369
370
  );
370
371
 
371
372
  &.flex__menu__item__icon {
373
+ pointer-events: all;
372
374
  &[data-rotate="true"] {
373
375
  --_sf-svg-tr: 180deg;
374
376
  }
@@ -76,7 +76,7 @@
76
76
  gap: 60px;
77
77
  justify-content: space-between;
78
78
  .template_col_left {
79
- width: 100%;
79
+ width: calc(100% - 400px);
80
80
  height: 400px;
81
81
  background-color: var(--_base-white);
82
82
  .wishlist-modal {
@@ -128,6 +128,9 @@
128
128
  width: fit-content;
129
129
  height: fit-content;
130
130
  }
131
+ &::placeholder {
132
+ color: var(--_gray-500);
133
+ }
131
134
  }
132
135
 
133
136
  .radio-group {
@@ -242,10 +245,11 @@
242
245
  width: 400px;
243
246
  height: fit-content;
244
247
  background-color: var(--_base-white);
248
+ overflow: hidden;
245
249
  .template_summary_wrapper {
246
250
  border: 1px solid var(--_gray-300);
247
251
  border-radius: 4px;
248
- width: 350px;
252
+ width: 100%;
249
253
  .template_summary_header {
250
254
  padding: 12px 16px;
251
255
  border-bottom: 1px solid var(--_gray-300);
@@ -4,13 +4,13 @@
4
4
 
5
5
  [data-div-type="element"] {
6
6
  &[data-element-type="orderStatus"] {
7
- width: var(
8
- --_ctm-mob-ele-nw-wh-st-mx,
9
- var(
10
- --_ctm-tab-ele-nw-wh-st-mx,
11
- var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
12
- )
13
- );
7
+ // width: var(
8
+ // --_ctm-mob-ele-nw-wh-st-mx,
9
+ // var(
10
+ // --_ctm-tab-ele-nw-wh-st-mx,
11
+ // var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
12
+ // )
13
+ // );
14
14
 
15
15
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
16
16