@sc-360-v2/storefront-cms-library 0.3.57 → 0.3.59
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/dist/builder.js +1 -1
- package/dist/bulk-order-pad.scss +1 -0
- package/dist/buyForHeaders.scss +13 -0
- package/dist/cart-summary.scss +901 -40
- package/dist/checkout.scss +115 -22
- package/dist/confirmationModal.scss +1 -0
- package/dist/dropdownTemplate.scss +218 -23
- package/dist/employee-bulk-order.scss +704 -528
- package/dist/emtpy-templates.scss +53 -0
- package/dist/functions.js +1 -1
- package/dist/language-selector.scss +1 -0
- package/dist/modal.scss +4 -3
- package/dist/shipping-payments.scss +109 -21
- package/dist/types/builder/elements/form-builder/index.d.ts +4 -0
- package/dist/types/builder/enums/index.d.ts +1 -0
- package/dist/types/builder/tools/element-edit/cartSummary.d.ts +2833 -189
- package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
- package/dist/types/builder/tools/element-edit/productDescription.d.ts +16 -0
- package/dist/types/helper/helper-functions.d.ts +7 -1
- package/dist/types/html-elements/element-types.d.ts +2 -2
- package/package.json +1 -1
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
[data-div-type="element"] {
|
|
6
6
|
&[data-element-type="languageMenu"],
|
|
7
7
|
&[data-element-type="currencySelector"],
|
|
8
|
+
&[data-element-type="userGroupsSelector"],
|
|
8
9
|
&[data-element-type="warehouseSelector"] {
|
|
9
10
|
margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
|
|
10
11
|
|
package/dist/modal.scss
CHANGED
|
@@ -338,8 +338,8 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
|
|
|
338
338
|
flex-direction: column;
|
|
339
339
|
// max-height: 100vh;
|
|
340
340
|
// max-width: 1200px;
|
|
341
|
-
max-height: calc(100vw -
|
|
342
|
-
max-width: calc(100vw -
|
|
341
|
+
max-height: calc(100vw - 12px);
|
|
342
|
+
max-width: calc(100vw - 12px);
|
|
343
343
|
|
|
344
344
|
.product-list {
|
|
345
345
|
flex: 1;
|
|
@@ -380,7 +380,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
|
|
|
380
380
|
align-items: center;
|
|
381
381
|
// padding: 15px 0px;
|
|
382
382
|
// height: 60px;
|
|
383
|
-
padding: 8px 16px;
|
|
383
|
+
padding: 8px 8px 8px 16px;
|
|
384
384
|
|
|
385
385
|
.left-col {
|
|
386
386
|
.title {
|
|
@@ -475,6 +475,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
|
|
|
475
475
|
|
|
476
476
|
.emp_info {
|
|
477
477
|
display: flex;
|
|
478
|
+
padding-right: 16px;
|
|
478
479
|
.emp_info_item {
|
|
479
480
|
color: var(--_gray-600);
|
|
480
481
|
font-size: 14px;
|
|
@@ -68,7 +68,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
68
68
|
display: flex;
|
|
69
69
|
padding: var(--_ctm-lt-pg);
|
|
70
70
|
flex-direction: column;
|
|
71
|
-
gap:
|
|
71
|
+
gap: 4px;
|
|
72
72
|
word-break: keep-all;
|
|
73
73
|
padding-bottom: 24px;
|
|
74
74
|
|
|
@@ -82,8 +82,24 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
82
82
|
.accordion {
|
|
83
83
|
border-radius: 4px;
|
|
84
84
|
display: flex;
|
|
85
|
-
gap: var(--_ctm-lt-an-hg-ad-ve-gp);
|
|
85
|
+
// gap: var(--_ctm-lt-an-hg-ad-ve-gp);
|
|
86
86
|
flex-direction: column;
|
|
87
|
+
transition: max-height 800ms ease-in;
|
|
88
|
+
&.open {
|
|
89
|
+
transition: max-height 800ms ease-in;
|
|
90
|
+
.accordion-header {
|
|
91
|
+
background-color: var(--_gray-200);
|
|
92
|
+
}
|
|
93
|
+
.accordion-body {
|
|
94
|
+
transition: max-height 800ms ease-in;
|
|
95
|
+
max-height: 2000px;
|
|
96
|
+
padding-block: 12px 24px;
|
|
97
|
+
.shipping-address {
|
|
98
|
+
max-height: fit-content;
|
|
99
|
+
transition: max-height 800ms ease-in;
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
}
|
|
87
103
|
|
|
88
104
|
// accordion heaer
|
|
89
105
|
.accordion-header {
|
|
@@ -95,6 +111,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
95
111
|
background-color: #f5f5f5;
|
|
96
112
|
border-color: #f5f5f5;
|
|
97
113
|
border-radius: 4px;
|
|
114
|
+
height: 55px;
|
|
98
115
|
|
|
99
116
|
.accordion-title {
|
|
100
117
|
margin-right: 1rem;
|
|
@@ -122,13 +139,18 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
122
139
|
|
|
123
140
|
// accordion body
|
|
124
141
|
.accordion-body {
|
|
125
|
-
|
|
142
|
+
transition: max-height 800ms ease-in;
|
|
126
143
|
|
|
144
|
+
max-height: 0px;
|
|
145
|
+
overflow: hidden;
|
|
146
|
+
padding: 0;
|
|
127
147
|
// shipping address
|
|
128
148
|
.shipping-address {
|
|
149
|
+
transition: max-height 800ms ease-in;
|
|
150
|
+
max-height: 0;
|
|
129
151
|
display: flex;
|
|
130
152
|
flex-direction: column;
|
|
131
|
-
gap:
|
|
153
|
+
gap: 16px;
|
|
132
154
|
|
|
133
155
|
.btn_link {
|
|
134
156
|
color: var(--_primary-400);
|
|
@@ -150,15 +172,19 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
150
172
|
display: flex;
|
|
151
173
|
flex-direction: column;
|
|
152
174
|
gap: 24px;
|
|
175
|
+
max-width: 485px;
|
|
153
176
|
}
|
|
154
177
|
|
|
155
178
|
.shipping_address_heading_container {
|
|
156
179
|
display: flex;
|
|
157
180
|
justify-content: space-between;
|
|
158
181
|
align-items: center;
|
|
182
|
+
font-weight: 600;
|
|
183
|
+
color: var(--_gray-900);
|
|
159
184
|
.icon {
|
|
160
185
|
display: flex;
|
|
161
186
|
align-items: center;
|
|
187
|
+
cursor: pointer;
|
|
162
188
|
}
|
|
163
189
|
}
|
|
164
190
|
|
|
@@ -166,7 +192,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
166
192
|
display: flex;
|
|
167
193
|
flex-direction: column;
|
|
168
194
|
gap: 0.75rem;
|
|
169
|
-
max-width: 85%;
|
|
195
|
+
// max-width: 85%;
|
|
170
196
|
|
|
171
197
|
@media (max-width: 500px) {
|
|
172
198
|
max-width: 100%;
|
|
@@ -195,6 +221,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
195
221
|
.chk_shipping_address_form_label {
|
|
196
222
|
color: var(--_gray-600);
|
|
197
223
|
font-size: 14px;
|
|
224
|
+
padding-bottom: 6px;
|
|
198
225
|
}
|
|
199
226
|
|
|
200
227
|
.chk_shiping_address_form_input {
|
|
@@ -616,6 +643,38 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
616
643
|
border: 1px solid var(--_gray-300);
|
|
617
644
|
border-radius: 4px;
|
|
618
645
|
margin-bottom: 12px;
|
|
646
|
+
.add_gift_card {
|
|
647
|
+
display: flex;
|
|
648
|
+
gap: 12px;
|
|
649
|
+
padding: 16px;
|
|
650
|
+
|
|
651
|
+
.gc_icon {
|
|
652
|
+
svg {
|
|
653
|
+
width: 18px;
|
|
654
|
+
height: 14px;
|
|
655
|
+
}
|
|
656
|
+
}
|
|
657
|
+
|
|
658
|
+
.gc_info {
|
|
659
|
+
display: flex;
|
|
660
|
+
justify-content: space-between;
|
|
661
|
+
width: 100%;
|
|
662
|
+
gap: 6px;
|
|
663
|
+
|
|
664
|
+
.gc_title {
|
|
665
|
+
font-size: 14px;
|
|
666
|
+
font-weight: 600;
|
|
667
|
+
}
|
|
668
|
+
}
|
|
669
|
+
.gc_tertiary_btn {
|
|
670
|
+
color: var(--_primary-400);
|
|
671
|
+
|
|
672
|
+
&:hover {
|
|
673
|
+
color: var(--_primary-500);
|
|
674
|
+
text-decoration: underline;
|
|
675
|
+
}
|
|
676
|
+
}
|
|
677
|
+
}
|
|
619
678
|
.chk_gft_crd_wrapper {
|
|
620
679
|
display: flex;
|
|
621
680
|
justify-content: space-between;
|
|
@@ -669,6 +728,10 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
669
728
|
width: 95px;
|
|
670
729
|
height: 44px;
|
|
671
730
|
padding-inline: 10px;
|
|
731
|
+
&:disabled {
|
|
732
|
+
opacity: 0.8;
|
|
733
|
+
cursor: not-allowed;
|
|
734
|
+
}
|
|
672
735
|
&:focus {
|
|
673
736
|
outline: 2px solid var(--_primary-100);
|
|
674
737
|
border: 1px solid var(--_primary-300);
|
|
@@ -690,6 +753,10 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
690
753
|
input[type="number"] {
|
|
691
754
|
background-color: var(--_base-white);
|
|
692
755
|
padding-right: 10px;
|
|
756
|
+
&:disabled {
|
|
757
|
+
opacity: 0.8;
|
|
758
|
+
cursor: not-allowed;
|
|
759
|
+
}
|
|
693
760
|
}
|
|
694
761
|
&:focus-within {
|
|
695
762
|
outline: 2px solid var(--_primary-100);
|
|
@@ -781,9 +848,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
781
848
|
display: flex;
|
|
782
849
|
justify-content: space-between;
|
|
783
850
|
padding: 16px;
|
|
784
|
-
|
|
785
|
-
background-color: var(--_gray-50);
|
|
786
|
-
}
|
|
851
|
+
|
|
787
852
|
.chk_payment_section {
|
|
788
853
|
display: flex;
|
|
789
854
|
justify-content: space-between;
|
|
@@ -792,6 +857,10 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
792
857
|
.chk_payment_section_col_left {
|
|
793
858
|
display: flex;
|
|
794
859
|
gap: 12px;
|
|
860
|
+
svg {
|
|
861
|
+
width: 24px;
|
|
862
|
+
height: 24px;
|
|
863
|
+
}
|
|
795
864
|
.chk_payment_section_method {
|
|
796
865
|
display: flex;
|
|
797
866
|
flex-direction: column;
|
|
@@ -832,6 +901,10 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
832
901
|
}
|
|
833
902
|
input {
|
|
834
903
|
height: inherit;
|
|
904
|
+
&:disabled {
|
|
905
|
+
opacity: 0.8;
|
|
906
|
+
cursor: not-allowed;
|
|
907
|
+
}
|
|
835
908
|
}
|
|
836
909
|
}
|
|
837
910
|
}
|
|
@@ -1143,6 +1216,9 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1143
1216
|
letter-spacing: var(--_ctm-dn-sg-md-dn-hg-dn-lr-sg);
|
|
1144
1217
|
text-decoration: var(--_ctm-dn-sg-md-dn-hg-dn-ue);
|
|
1145
1218
|
}
|
|
1219
|
+
.icon {
|
|
1220
|
+
cursor: pointer;
|
|
1221
|
+
}
|
|
1146
1222
|
}
|
|
1147
1223
|
|
|
1148
1224
|
form {
|
|
@@ -1183,6 +1259,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1183
1259
|
.chk_shiping_address_form_input {
|
|
1184
1260
|
padding: 8px 12px;
|
|
1185
1261
|
width: -webkit-fill-available;
|
|
1262
|
+
height: 40px;
|
|
1186
1263
|
background-color: var(--_base-white);
|
|
1187
1264
|
border-radius: 6px;
|
|
1188
1265
|
border: 1px solid var(--_gray-300);
|
|
@@ -1192,18 +1269,18 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1192
1269
|
outline: 2px solid var(--_primary-100);
|
|
1193
1270
|
}
|
|
1194
1271
|
|
|
1195
|
-
.input-field {
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1272
|
+
// .input-field {
|
|
1273
|
+
// padding: 8px 12px;
|
|
1274
|
+
// width: -webkit-fill-available;
|
|
1275
|
+
// background-color: var(--_base-white);
|
|
1276
|
+
// border-radius: 6px;
|
|
1277
|
+
// border: 1px solid var(--_gray-300);
|
|
1201
1278
|
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
}
|
|
1279
|
+
// &:focus-within {
|
|
1280
|
+
// border: 1px solid var(--_primary-300);
|
|
1281
|
+
// outline: 2px solid var(--_primary-100);
|
|
1282
|
+
// }
|
|
1283
|
+
// }
|
|
1207
1284
|
}
|
|
1208
1285
|
|
|
1209
1286
|
input[type="checkbox"] {
|
|
@@ -1616,7 +1693,6 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1616
1693
|
display: flex;
|
|
1617
1694
|
width: fit-content;
|
|
1618
1695
|
align-items: center;
|
|
1619
|
-
font-family: sans-serif;
|
|
1620
1696
|
gap: 12px;
|
|
1621
1697
|
|
|
1622
1698
|
input[type="checkbox"] {
|
|
@@ -1715,6 +1791,10 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1715
1791
|
}
|
|
1716
1792
|
}
|
|
1717
1793
|
}
|
|
1794
|
+
.chk_address_actions {
|
|
1795
|
+
display: flex;
|
|
1796
|
+
gap: 12px;
|
|
1797
|
+
}
|
|
1718
1798
|
.chk_payment-card__note {
|
|
1719
1799
|
padding: 8px 6px;
|
|
1720
1800
|
display: flex;
|
|
@@ -1751,6 +1831,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1751
1831
|
display: flex;
|
|
1752
1832
|
flex-direction: column;
|
|
1753
1833
|
gap: var(--_ctm-lt-sd-sg-as-le-gp);
|
|
1834
|
+
max-width: 700px;
|
|
1754
1835
|
|
|
1755
1836
|
.chk_address {
|
|
1756
1837
|
display: flex;
|
|
@@ -1793,6 +1874,12 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1793
1874
|
&:has(.chk_saved_address_button.selected) {
|
|
1794
1875
|
display: flex !important;
|
|
1795
1876
|
}
|
|
1877
|
+
.chk_saved_address_button {
|
|
1878
|
+
display: flex;
|
|
1879
|
+
align-items: center;
|
|
1880
|
+
gap: 4px;
|
|
1881
|
+
color: var(--_primary-400);
|
|
1882
|
+
}
|
|
1796
1883
|
}
|
|
1797
1884
|
|
|
1798
1885
|
&:hover {
|
|
@@ -1999,6 +2086,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
1999
2086
|
font-size: 12px;
|
|
2000
2087
|
color: var(--_primary-400);
|
|
2001
2088
|
display: inline-flex;
|
|
2089
|
+
width: fit-content;
|
|
2002
2090
|
&:hover {
|
|
2003
2091
|
color: var(--_primary-500);
|
|
2004
2092
|
text-decoration: underline;
|
|
@@ -2016,7 +2104,7 @@ $activeElementSelector: "[data-has-clicked='true']";
|
|
|
2016
2104
|
}
|
|
2017
2105
|
}
|
|
2018
2106
|
.chk_secondary_bnt {
|
|
2019
|
-
padding:
|
|
2107
|
+
padding: 16px 24px;
|
|
2020
2108
|
background-color: transparent;
|
|
2021
2109
|
color: var(--_gray-600);
|
|
2022
2110
|
font-weight: 600;
|
|
@@ -203,6 +203,10 @@ export interface FormComponentConfig {
|
|
|
203
203
|
src?: string;
|
|
204
204
|
type: FormComponentTypeEnum;
|
|
205
205
|
w: number;
|
|
206
|
+
allowUpperCase?: boolean;
|
|
207
|
+
allowLowerCase?: boolean;
|
|
208
|
+
allowSpecialCharacters?: boolean;
|
|
209
|
+
allowNumbers?: boolean;
|
|
206
210
|
}
|
|
207
211
|
export declare enum ElementSettingEnum {
|
|
208
212
|
LABEL = 1,
|