@sc-360-v2/storefront-cms-library 0.4.79 → 0.4.81
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/add-order.scss +377 -377
- package/dist/allocations.scss +1613 -1603
- package/dist/builder.js +1 -1
- package/dist/bulk-order-pad.scss +20 -7
- package/dist/buyForHeaders.scss +6 -0
- package/dist/buyForPopup.scss +12 -3
- package/dist/cart.scss +16 -8
- package/dist/checkout.scss +7 -0
- package/dist/default-dropdown.scss +259 -240
- package/dist/dropdownTemplate.scss +24 -17
- package/dist/form-preview.scss +328 -481
- package/dist/language-selector.scss +2 -2
- package/dist/menu-v2.scss +3 -3
- package/dist/modal.scss +2 -2
- package/dist/multi-select-dropdown.scss +293 -282
- package/dist/order-status.scss +28 -7
- package/dist/phone-input.scss +167 -0
- package/dist/quick-order-pad.scss +15 -1
- package/dist/request-for-quotes.scss +827 -746
- package/dist/shipping-payments.scss +0 -1
- package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +152 -1
- package/dist/types/builder/tools/element-edit/orderStatus.d.ts +39 -0
- package/dist/types/builder/tools/element-edit/userElements.d.ts +10 -0
- package/dist/user-elements.scss +29 -0
- package/package.json +1 -1
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
.sc-phone-container {
|
|
2
|
+
position: relative;
|
|
3
|
+
width: 100%;
|
|
4
|
+
border: none !important;
|
|
5
|
+
padding: 0 !important;
|
|
6
|
+
|
|
7
|
+
.sc-phone-input-wrapper {
|
|
8
|
+
display: flex;
|
|
9
|
+
align-items: center;
|
|
10
|
+
border: 1px solid var(--_primary-300);
|
|
11
|
+
border-radius: 6px;
|
|
12
|
+
height: 38px;
|
|
13
|
+
background-color: var(--_base-white);
|
|
14
|
+
overflow: hidden;
|
|
15
|
+
|
|
16
|
+
&:focus-within {
|
|
17
|
+
outline: 2px solid var(--_primary-100);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.sc-phone-country-btn {
|
|
22
|
+
display: flex;
|
|
23
|
+
align-items: center;
|
|
24
|
+
gap: 4px;
|
|
25
|
+
padding: 0 8px;
|
|
26
|
+
border: none;
|
|
27
|
+
background: transparent;
|
|
28
|
+
cursor: pointer;
|
|
29
|
+
height: 100%;
|
|
30
|
+
border-right: 1px solid var(--_primary-300);
|
|
31
|
+
flex-shrink: 0;
|
|
32
|
+
|
|
33
|
+
&:disabled {
|
|
34
|
+
cursor: not-allowed;
|
|
35
|
+
opacity: 0.6;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.sc-phone-flag {
|
|
40
|
+
width: 24px;
|
|
41
|
+
height: 24px;
|
|
42
|
+
min-width: 24px;
|
|
43
|
+
min-height: 24px;
|
|
44
|
+
object-fit: cover;
|
|
45
|
+
border-radius: 50%;
|
|
46
|
+
flex-shrink: 0;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.sc-phone-chevron {
|
|
50
|
+
font-size: 10px;
|
|
51
|
+
color: var(--_gray-500, #667085);
|
|
52
|
+
line-height: 1;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.sc-phone-dial-code {
|
|
56
|
+
padding: 0 4px 0 8px;
|
|
57
|
+
font-size: 14px;
|
|
58
|
+
color: var(--_gray-700, #344054);
|
|
59
|
+
white-space: nowrap;
|
|
60
|
+
flex-shrink: 0;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
input[type="tel"].sc-phone-input {
|
|
64
|
+
flex: 1;
|
|
65
|
+
border: none !important;
|
|
66
|
+
outline: none !important;
|
|
67
|
+
box-shadow: none !important;
|
|
68
|
+
border-radius: 0 !important;
|
|
69
|
+
height: 100%;
|
|
70
|
+
font-size: 14px;
|
|
71
|
+
padding: 0 12px 0 0 !important;
|
|
72
|
+
background: transparent !important;
|
|
73
|
+
min-width: 0;
|
|
74
|
+
|
|
75
|
+
&:focus {
|
|
76
|
+
outline: none !important;
|
|
77
|
+
box-shadow: none !important;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.sc-phone-dropdown {
|
|
82
|
+
position: absolute;
|
|
83
|
+
top: calc(100% + 4px);
|
|
84
|
+
left: 0;
|
|
85
|
+
width: 240px;
|
|
86
|
+
background: var(--_base-white, #fff);
|
|
87
|
+
border: 1px solid var(--_primary-300);
|
|
88
|
+
border-radius: 8px;
|
|
89
|
+
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
|
90
|
+
z-index: 9999;
|
|
91
|
+
overflow: hidden;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.sc-phone-search-wrapper {
|
|
95
|
+
position: relative;
|
|
96
|
+
padding: 8px;
|
|
97
|
+
border-bottom: 1px solid var(--_gray-200, #e4e7ec);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
input[type="text"].sc-phone-search {
|
|
101
|
+
width: 100%;
|
|
102
|
+
padding: 6px 30px 6px 10px !important;
|
|
103
|
+
border: 1px solid var(--_gray-300, #d0d5dd) !important;
|
|
104
|
+
border-radius: 6px !important;
|
|
105
|
+
font-size: 14px;
|
|
106
|
+
outline: none !important;
|
|
107
|
+
box-sizing: border-box;
|
|
108
|
+
height: auto !important;
|
|
109
|
+
|
|
110
|
+
&:focus {
|
|
111
|
+
border-color: var(--_primary-300) !important;
|
|
112
|
+
outline: none !important;
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.sc-phone-search-icon {
|
|
117
|
+
position: absolute;
|
|
118
|
+
right: 16px;
|
|
119
|
+
top: 50%;
|
|
120
|
+
transform: translateY(-50%);
|
|
121
|
+
pointer-events: none;
|
|
122
|
+
display: flex;
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
.sc-phone-dropdown-list {
|
|
126
|
+
max-height: 200px;
|
|
127
|
+
overflow-y: auto;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.sc-phone-dropdown-item {
|
|
131
|
+
display: flex;
|
|
132
|
+
align-items: center;
|
|
133
|
+
gap: 8px;
|
|
134
|
+
padding: 8px 12px;
|
|
135
|
+
cursor: pointer;
|
|
136
|
+
font-size: 14px;
|
|
137
|
+
color: var(--_gray-700, #344054);
|
|
138
|
+
|
|
139
|
+
&:hover {
|
|
140
|
+
background-color: var(--_gray-50, #f9fafb);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
&.selected {
|
|
144
|
+
background-color: var(--_primary-50, #f0f4ff);
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.sc-phone-country-name {
|
|
149
|
+
flex: 1;
|
|
150
|
+
white-space: nowrap;
|
|
151
|
+
overflow: hidden;
|
|
152
|
+
text-overflow: ellipsis;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
.sc-phone-check {
|
|
156
|
+
color: var(--_primary-400);
|
|
157
|
+
font-size: 16px;
|
|
158
|
+
flex-shrink: 0;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.sc-phone-no-results {
|
|
162
|
+
padding: 12px;
|
|
163
|
+
text-align: center;
|
|
164
|
+
color: var(--_gray-500, #667085);
|
|
165
|
+
font-size: 14px;
|
|
166
|
+
}
|
|
167
|
+
}
|
|
@@ -180,12 +180,21 @@ $input-padding: 10px 12px;
|
|
|
180
180
|
.product_details_wrapper {
|
|
181
181
|
display: flex;
|
|
182
182
|
gap: 16px;
|
|
183
|
+
padding-block: 4px;
|
|
184
|
+
a {
|
|
185
|
+
display: flex;
|
|
186
|
+
align-items: center;
|
|
187
|
+
justify-content: center;
|
|
188
|
+
border-radius: 6px;
|
|
189
|
+
overflow: hidden;
|
|
190
|
+
}
|
|
183
191
|
}
|
|
184
192
|
.product_qty_price_wrapper {
|
|
185
193
|
display: flex;
|
|
186
194
|
justify-content: space-between;
|
|
187
195
|
align-items: center;
|
|
188
196
|
align-self: start;
|
|
197
|
+
padding-block-start: 3px;
|
|
189
198
|
|
|
190
199
|
.product_qty_wrapper {
|
|
191
200
|
display: flex;
|
|
@@ -203,6 +212,9 @@ $input-padding: 10px 12px;
|
|
|
203
212
|
border: 0.5px solid var(--_thm-cs-be-se-3);
|
|
204
213
|
background: #fff;
|
|
205
214
|
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
|
|
215
|
+
&:focus-within {
|
|
216
|
+
box-shadow: 0 0 0 3px var(--_gray-100);
|
|
217
|
+
}
|
|
206
218
|
|
|
207
219
|
.product_qty_label {
|
|
208
220
|
display: flex;
|
|
@@ -216,6 +228,7 @@ $input-padding: 10px 12px;
|
|
|
216
228
|
font-weight: var(--_thm-ty-p1-bd);
|
|
217
229
|
// line-height: 24px;
|
|
218
230
|
line-height: var(--_thm-ty-p1-le-ht);
|
|
231
|
+
white-space: nowrap;
|
|
219
232
|
}
|
|
220
233
|
}
|
|
221
234
|
.product_qty_input_container {
|
|
@@ -564,6 +577,7 @@ $input-padding: 10px 12px;
|
|
|
564
577
|
align-items: center;
|
|
565
578
|
gap: 16px;
|
|
566
579
|
min-width: 100px;
|
|
580
|
+
margin-top: 4px;
|
|
567
581
|
& > a,
|
|
568
582
|
span {
|
|
569
583
|
cursor: pointer;
|
|
@@ -722,7 +736,7 @@ $input-padding: 10px 12px;
|
|
|
722
736
|
display: flex;
|
|
723
737
|
justify-content: center;
|
|
724
738
|
border-radius: 4px;
|
|
725
|
-
padding:
|
|
739
|
+
padding: 8px 16px !important;
|
|
726
740
|
}
|
|
727
741
|
span:has(.cart-dropdown-container) {
|
|
728
742
|
width: 100%;
|