@sc-360-v2/storefront-cms-library 0.3.55 → 0.3.57
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/cart-summary.scss +6 -1
- package/dist/checkout.scss +5299 -403
- package/dist/employee-bulk-order.scss +27 -5
- package/dist/icon-list.scss +117 -29
- package/dist/modal.scss +2 -2
- package/dist/section.scss +25 -24
- package/dist/shipping-payments.scss +761 -653
- package/dist/stack.scss +4 -3
- package/dist/types/builder/elements/form-builder/index.d.ts +1 -0
- package/dist/types/builder/interfaces/global.d.ts +1 -1
- package/dist/types/builder/tools/element-edit/checkout.d.ts +1935 -541
- package/dist/types/builder/tools/element-edit/icon-list.d.ts +53 -1
- package/dist/types/helper/helper-functions copy.d.ts +7 -0
- package/package.json +1 -1
|
@@ -132,6 +132,9 @@
|
|
|
132
132
|
.em_add-employee {
|
|
133
133
|
position: absolute;
|
|
134
134
|
bottom: 0;
|
|
135
|
+
.dropdown-menu {
|
|
136
|
+
top: 38px;
|
|
137
|
+
}
|
|
135
138
|
.svg_icon {
|
|
136
139
|
left: -10px;
|
|
137
140
|
bottom: -10px;
|
|
@@ -979,6 +982,12 @@
|
|
|
979
982
|
display: flex;
|
|
980
983
|
flex-direction: column;
|
|
981
984
|
gap: 24px;
|
|
985
|
+
.btn_link {
|
|
986
|
+
color: var(--_primary-400);
|
|
987
|
+
&:hover {
|
|
988
|
+
text-decoration: underline;
|
|
989
|
+
}
|
|
990
|
+
}
|
|
982
991
|
|
|
983
992
|
.chk_saved_address_button {
|
|
984
993
|
cursor: pointer;
|
|
@@ -999,9 +1008,13 @@
|
|
|
999
1008
|
display: flex;
|
|
1000
1009
|
justify-content: space-between;
|
|
1001
1010
|
align-items: center;
|
|
1002
|
-
max-width:
|
|
1011
|
+
max-width: 760px;
|
|
1003
1012
|
font-size: 18px;
|
|
1004
1013
|
font-weight: 600;
|
|
1014
|
+
.icon {
|
|
1015
|
+
display: flex;
|
|
1016
|
+
align-items: center;
|
|
1017
|
+
}
|
|
1005
1018
|
}
|
|
1006
1019
|
|
|
1007
1020
|
form {
|
|
@@ -1513,12 +1526,16 @@
|
|
|
1513
1526
|
|
|
1514
1527
|
.pp_pmnt_method_groups {
|
|
1515
1528
|
.pp_ppm_section {
|
|
1516
|
-
background:
|
|
1529
|
+
background: var(--_base-white);
|
|
1517
1530
|
padding: 12px 16px;
|
|
1518
1531
|
font-size: 12px;
|
|
1519
1532
|
display: flex;
|
|
1520
1533
|
justify-content: space-between;
|
|
1521
1534
|
gap: 8px;
|
|
1535
|
+
border-bottom: 1px solid var(--_gray-300);
|
|
1536
|
+
&:not(:first-child) {
|
|
1537
|
+
border-top: 1px solid var(--_gray-200);
|
|
1538
|
+
}
|
|
1522
1539
|
.pp_ppm_section_label {
|
|
1523
1540
|
font-size: 14px;
|
|
1524
1541
|
font-weight: 600;
|
|
@@ -1544,9 +1561,7 @@
|
|
|
1544
1561
|
display: flex;
|
|
1545
1562
|
justify-content: space-between;
|
|
1546
1563
|
padding: 16px;
|
|
1547
|
-
|
|
1548
|
-
background-color: var(--_gray-50);
|
|
1549
|
-
}
|
|
1564
|
+
|
|
1550
1565
|
.chk_payment_section {
|
|
1551
1566
|
display: flex;
|
|
1552
1567
|
justify-content: space-between;
|
|
@@ -2228,6 +2243,12 @@
|
|
|
2228
2243
|
justify-content: space-between;
|
|
2229
2244
|
border-bottom: 1px solid var(--_gray-100);
|
|
2230
2245
|
font-weight: 600;
|
|
2246
|
+
.gc_tertiary_btn {
|
|
2247
|
+
color: var(--_primary-400);
|
|
2248
|
+
&:hover {
|
|
2249
|
+
text-decoration: underline;
|
|
2250
|
+
}
|
|
2251
|
+
}
|
|
2231
2252
|
}
|
|
2232
2253
|
}
|
|
2233
2254
|
|
|
@@ -2655,6 +2676,7 @@
|
|
|
2655
2676
|
}
|
|
2656
2677
|
input {
|
|
2657
2678
|
height: inherit;
|
|
2679
|
+
background-color: var(--_base-white);
|
|
2658
2680
|
}
|
|
2659
2681
|
}
|
|
2660
2682
|
.chk_payment_cred_section_col_left {
|
package/dist/icon-list.scss
CHANGED
|
@@ -7,26 +7,73 @@ $icon: "flex__ili_span_icn";
|
|
|
7
7
|
$text: "flex__ili_span_txt";
|
|
8
8
|
$textContaner: "flex__ili__container";
|
|
9
9
|
$desc: "flex__ili__description";
|
|
10
|
-
$
|
|
11
|
-
|
|
12
|
-
|
|
10
|
+
$pos2: (
|
|
11
|
+
hrz: (
|
|
12
|
+
keys: (
|
|
13
|
+
0: inline,
|
|
14
|
+
after: (
|
|
15
|
+
top: 0,
|
|
16
|
+
right: 0,
|
|
17
|
+
height: prepareMediaVariable(--_ctm-dn-lt-dr-wh),
|
|
18
|
+
width: prepareMediaVariable(--_ctm-dn-lt-dr-wt),
|
|
19
|
+
),
|
|
20
|
+
),
|
|
21
|
+
after: (
|
|
22
|
+
start: (
|
|
23
|
+
top: 0px,
|
|
24
|
+
),
|
|
25
|
+
center: (
|
|
26
|
+
top: 50%,
|
|
27
|
+
transform: translateY(-50%),
|
|
28
|
+
),
|
|
29
|
+
end: (
|
|
30
|
+
top: auto,
|
|
31
|
+
bottom: 0,
|
|
32
|
+
),
|
|
33
|
+
),
|
|
13
34
|
),
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
35
|
+
vtl: (
|
|
36
|
+
keys: (
|
|
37
|
+
0: block,
|
|
38
|
+
after: (
|
|
39
|
+
bottom: 0,
|
|
40
|
+
left: 0,
|
|
41
|
+
width: prepareMediaVariable(--_ctm-dn-lt-dr-wh),
|
|
42
|
+
height: prepareMediaVariable(--_ctm-dn-lt-dr-wt),
|
|
43
|
+
),
|
|
44
|
+
),
|
|
45
|
+
after: (
|
|
46
|
+
start: (
|
|
47
|
+
left: 0px,
|
|
48
|
+
),
|
|
49
|
+
center: (
|
|
50
|
+
left: 50%,
|
|
51
|
+
transform: translateX(-50%),
|
|
52
|
+
),
|
|
53
|
+
end: (
|
|
54
|
+
left: auto,
|
|
55
|
+
right: 0,
|
|
56
|
+
),
|
|
57
|
+
),
|
|
20
58
|
),
|
|
21
59
|
);
|
|
22
60
|
[data-div-type="element"] {
|
|
23
61
|
&[data-element-type="icon-list"] {
|
|
24
62
|
& > .wrapper {
|
|
25
63
|
width: 100%;
|
|
26
|
-
|
|
27
|
-
flex-direction: column;
|
|
28
|
-
gap: prepareMediaVariable(--_ctm-dn-lt-lt-gp);
|
|
64
|
+
gap: prepareMediaVariable(--_ctm-lt-im-gp);
|
|
29
65
|
padding: prepareMediaVariable(--_ctm-lt-pg);
|
|
66
|
+
display: var(--_d-flex) !important;
|
|
67
|
+
|
|
68
|
+
&.hrz {
|
|
69
|
+
flex-direction: row;
|
|
70
|
+
// justify-content: space-between;
|
|
71
|
+
align-items: prepareMediaVariable(--_ctm-lt-an-is);
|
|
72
|
+
}
|
|
73
|
+
&.vtl {
|
|
74
|
+
flex-direction: column;
|
|
75
|
+
justify-content: prepareMediaVariable(--_ctm-lt-jy-ct);
|
|
76
|
+
}
|
|
30
77
|
|
|
31
78
|
&[data-show-border="true"] {
|
|
32
79
|
border-color: prepareMediaVariable(--_ctm-dn-lt-br-cr);
|
|
@@ -46,18 +93,41 @@ $pos: (
|
|
|
46
93
|
& > .#{$item} {
|
|
47
94
|
&:not(:last-of-type) {
|
|
48
95
|
position: var(--_p-relative);
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
96
|
+
|
|
97
|
+
@each $key, $value in $pos2 {
|
|
98
|
+
$isVertical: $key == vtl;
|
|
99
|
+
$keys: map.get($value, keys);
|
|
100
|
+
$afterKeys: map.get($keys, after);
|
|
101
|
+
$afterPos: map.get($value, after);
|
|
102
|
+
|
|
103
|
+
&:is(.#{$key} > *) {
|
|
104
|
+
padding-#{map.get($keys, 0)}-end: calc(
|
|
105
|
+
#{prepareMediaVariable(--_ctm-lt-im-gp)} +
|
|
106
|
+
#{prepareMediaVariable(--_ctm-dn-lt-dr-wt)}
|
|
107
|
+
);
|
|
108
|
+
|
|
109
|
+
@each $k, $v in $afterKeys {
|
|
110
|
+
&::after {
|
|
111
|
+
#{$k}: #{$v};
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
@each $key1, $value1 in $afterPos {
|
|
116
|
+
&:is([data-show-pos1="#{$key1}"] > *) {
|
|
117
|
+
&::after {
|
|
118
|
+
@each $k, $v in $value1 {
|
|
119
|
+
#{$k}: #{$v};
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
}
|
|
53
126
|
&::after {
|
|
54
127
|
content: "";
|
|
55
128
|
position: var(--_p-absolute);
|
|
56
|
-
bottom: 0;
|
|
57
|
-
left: 0;
|
|
58
|
-
width: prepareMediaVariable(--_ctm-dn-lt-dr-wh);
|
|
59
|
-
height: prepareMediaVariable(--_ctm-dn-lt-dr-wt);
|
|
60
129
|
background: prepareMediaVariable(--_ctm-dn-lt-dr-cr);
|
|
130
|
+
border-radius: prepareMediaVariable(--_ctm-dn-lt-dr-br-rs);
|
|
61
131
|
}
|
|
62
132
|
}
|
|
63
133
|
}
|
|
@@ -66,7 +136,7 @@ $pos: (
|
|
|
66
136
|
& > div {
|
|
67
137
|
&.#{$item} {
|
|
68
138
|
display: var(--_d-flex);
|
|
69
|
-
gap: var(--_in_hr-gp,
|
|
139
|
+
gap: var(--_in_hr-gp, prepareMediaVariable(--_ctm-dn-in-dt-se-in-gp));
|
|
70
140
|
|
|
71
141
|
&:hover {
|
|
72
142
|
--_in_hr-gp: #{prepareMediaVariable(--_ctm-dn-in-hr-se-in-gp)};
|
|
@@ -106,15 +176,23 @@ $pos: (
|
|
|
106
176
|
display: var(--_d-flex);
|
|
107
177
|
flex-grow: 1;
|
|
108
178
|
flex-direction: column;
|
|
179
|
+
align-self: prepareMediaVariable(--_ctm-dn-tt-cr-vl-at);
|
|
109
180
|
padding: prepareMediaVariable(--_ctm-dn-tt-cr-pg);
|
|
110
181
|
row-gap: prepareMediaVariable(--_ctm-dn-tt-cr-im-gp);
|
|
111
182
|
&[data-show-divider="true"] {
|
|
183
|
+
// margin-inline-start: calc(
|
|
184
|
+
// #{prepareMediaVariable(--_ctm-dn-lt-lt-gp)} +
|
|
185
|
+
// #{prepareMediaVariable(--_ctm-dn-lt-dr-wt)}
|
|
186
|
+
// );
|
|
112
187
|
margin-inline-start: calc(
|
|
113
|
-
|
|
114
|
-
|
|
188
|
+
var(--_in_hr-gp, prepareMediaVariable(--_ctm-dn-in-dt-se-in-gp)) +
|
|
189
|
+
var(
|
|
190
|
+
--_ctm-mob-dn-tt-cr-dr-wt,
|
|
191
|
+
var(--_ctm-tab-dn-tt-cr-dr-wt, var(--_ctm-dn-tt-cr-dr-wt, inherit))
|
|
192
|
+
)
|
|
115
193
|
);
|
|
116
194
|
position: relative;
|
|
117
|
-
@each $key, $value in $
|
|
195
|
+
@each $key, $value in map.get(map.get($pos2, hrz), after) {
|
|
118
196
|
&[data-divider-pos="#{$key}"] {
|
|
119
197
|
&::before {
|
|
120
198
|
@each $key1, $value1 in $value {
|
|
@@ -127,15 +205,25 @@ $pos: (
|
|
|
127
205
|
content: "";
|
|
128
206
|
background: prepareMediaVariable(--_ctm-dn-tt-cr-dr-cr);
|
|
129
207
|
position: absolute;
|
|
208
|
+
// left: calc(
|
|
209
|
+
// -1 *
|
|
210
|
+
// calc(
|
|
211
|
+
// #{prepareMediaVariable(--_ctm-dn-lt-lt-gp)} +
|
|
212
|
+
// #{prepareMediaVariable(--_ctm-dn-lt-dr-wt)}
|
|
213
|
+
// )
|
|
214
|
+
// );
|
|
130
215
|
left: calc(
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
216
|
+
calc(
|
|
217
|
+
-1 *
|
|
218
|
+
var(
|
|
219
|
+
--_ctm-mob-dn-tt-cr-dr-wt,
|
|
220
|
+
var(--_ctm-tab-dn-tt-cr-dr-wt, var(--_ctm-dn-tt-cr-dr-wt, inherit))
|
|
221
|
+
)
|
|
222
|
+
) - var(--_in_hr-gp, prepareMediaVariable(--_ctm-dn-in-dt-se-in-gp))
|
|
136
223
|
);
|
|
137
224
|
width: prepareMediaVariable(--_ctm-dn-tt-cr-dr-wt);
|
|
138
225
|
height: prepareMediaVariable(--_ctm-dn-tt-cr-dr-wh);
|
|
226
|
+
border-radius: prepareMediaVariable(--_ctm-dn-tt-cr-dr-br-rs);
|
|
139
227
|
}
|
|
140
228
|
}
|
|
141
229
|
& > .#{$text} {
|
package/dist/modal.scss
CHANGED
|
@@ -228,7 +228,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
|
|
|
228
228
|
|
|
229
229
|
.modalV2-main {
|
|
230
230
|
position: fixed;
|
|
231
|
-
z-index:
|
|
231
|
+
z-index: 9999;
|
|
232
232
|
inset: 0;
|
|
233
233
|
background: rgba(0, 0, 0, 0.4);
|
|
234
234
|
.modalV2-wrapper {
|
|
@@ -371,7 +371,7 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
|
|
|
371
371
|
position: sticky;
|
|
372
372
|
top: 0;
|
|
373
373
|
background: $white;
|
|
374
|
-
z-index:
|
|
374
|
+
z-index: var(--_higher-zIndex);
|
|
375
375
|
// padding: 0 16px;
|
|
376
376
|
border-bottom: 1px solid #d0d5dd;
|
|
377
377
|
.title-bar {
|
package/dist/section.scss
CHANGED
|
@@ -58,6 +58,7 @@ section {
|
|
|
58
58
|
&[data-div-type="section"] {
|
|
59
59
|
position: var(--_p-relative);
|
|
60
60
|
width: 100%;
|
|
61
|
+
margin: prepareMediaVariable(--_ctm-sec-lt-mn);
|
|
61
62
|
flex-direction: column;
|
|
62
63
|
justify-self: stretch;
|
|
63
64
|
align-self: stretch;
|
|
@@ -111,7 +112,7 @@ section {
|
|
|
111
112
|
}
|
|
112
113
|
&[data-div-type="cms-section-wrapper"] {
|
|
113
114
|
// max-width: var(--_sf-wp-mx-wt);
|
|
114
|
-
max-width: prepareMediaVariable(--_ctm-sec-lt-wh) !important;
|
|
115
|
+
max-width: min(100%, prepareMediaVariable(--_ctm-sec-lt-wh)) !important;
|
|
115
116
|
// min-height: prepareMediaVariable(--_ctm-sec-lt-mn-ht);
|
|
116
117
|
margin-inline: auto;
|
|
117
118
|
position: var(--_p-relative);
|
|
@@ -160,28 +161,28 @@ div[data-div-type="element"] {
|
|
|
160
161
|
width: 100%;
|
|
161
162
|
}
|
|
162
163
|
}
|
|
163
|
-
&:is([data-element-type="stack"].hrz > .wrapper > [data-div-type="element"]) {
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
164
|
+
// &:is([data-element-type="stack"].hrz > .wrapper > [data-div-type="element"]) {
|
|
165
|
+
// &:is([data-element-type="stack"]) {
|
|
166
|
+
// width: max(
|
|
167
|
+
// 0.5px,
|
|
168
|
+
// calc(#{prepareMediaVariable(--_ctm-sta-ele-nw-wh-vl)} / 100) *
|
|
169
|
+
// (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
|
|
170
|
+
// );
|
|
171
|
+
// }
|
|
172
|
+
// &:is([data-element-type="container"]) {
|
|
173
|
+
// width: max(
|
|
174
|
+
// 0.5px,
|
|
175
|
+
// calc(#{prepareMediaVariable(--_ctm-con-ele-nw-wh-vl)} / 100) *
|
|
176
|
+
// (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
|
|
177
|
+
// );
|
|
178
|
+
// }
|
|
178
179
|
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
}
|
|
180
|
+
// &:not([data-element-type="container"], [data-element-type="stack"]) {
|
|
181
|
+
// width: max(
|
|
182
|
+
// 0.5px,
|
|
183
|
+
// calc(#{prepareMediaVariable(--_ctm-ele-nw-wh-vl)} / 100) *
|
|
184
|
+
// (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
|
|
185
|
+
// );
|
|
186
|
+
// }
|
|
187
|
+
// }
|
|
187
188
|
}
|