@sc-360-v2/storefront-cms-library 0.3.0 → 0.3.2

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 (49) hide show
  1. package/dist/amount-estimator.scss +291 -226
  2. package/dist/builder.js +1 -1
  3. package/dist/bulk-order-pad.scss +119 -64
  4. package/dist/bundleDetails.scss +808 -678
  5. package/dist/buyForHeaders.scss +94 -29
  6. package/dist/cart-details.scss +5 -3
  7. package/dist/cartDropdownOverlay.scss +0 -13
  8. package/dist/dropdownTemplate.scss +141 -0
  9. package/dist/faq.scss +20 -24
  10. package/dist/functions.scss +53 -18
  11. package/dist/item-stock.scss +38 -76
  12. package/dist/map.scss +35 -35
  13. package/dist/menu-item.scss +19 -0
  14. package/dist/modal.scss +328 -0
  15. package/dist/order-status.scss +483 -0
  16. package/dist/payment-methods.scss +71 -1
  17. package/dist/pickup-locations.scss +22 -19
  18. package/dist/product-basic-elements.scss +285 -132
  19. package/dist/product-options.scss +118 -76
  20. package/dist/quick-links.scss +186 -143
  21. package/dist/quick-order-pad.scss +26 -285
  22. package/dist/quotes.scss +9 -0
  23. package/dist/repeater-item.scss +1 -0
  24. package/dist/rfqs.scss +8 -0
  25. package/dist/section.scss +29 -78
  26. package/dist/stack.scss +16 -61
  27. package/dist/store-locations.scss +21 -20
  28. package/dist/table-common.scss +510 -0
  29. package/dist/text-temp-v2.scss +2 -0
  30. package/dist/types/builder/elements/bundle-details/index.d.ts +30 -0
  31. package/dist/types/builder/elements/layouter-pro/index.d.ts +43 -0
  32. package/dist/types/builder/elements/layouter-pro-item/index.d.ts +39 -0
  33. package/dist/types/builder/enums/index.d.ts +4 -0
  34. package/dist/types/builder/index.d.ts +4 -1
  35. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +627 -10
  36. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +287 -4
  37. package/dist/types/builder/tools/element-edit/cartDetails.d.ts +1 -1
  38. package/dist/types/builder/tools/element-edit/filters.d.ts +39 -1
  39. package/dist/types/builder/tools/element-edit/index.d.ts +3 -1
  40. package/dist/types/builder/tools/element-edit/itemStock.d.ts +11 -0
  41. package/dist/types/builder/tools/element-edit/layouter-pro-item.d.ts +9 -0
  42. package/dist/types/builder/tools/element-edit/layouterPro.d.ts +39 -0
  43. package/dist/types/builder/tools/element-edit/paymentMethods.d.ts +94 -1
  44. package/dist/uom-selector.scss +929 -1416
  45. package/dist/variant-picker.scss +613 -138
  46. package/dist/volume-pricing copy.scss +1092 -0
  47. package/dist/volume-pricing.scss +1007 -606
  48. package/dist/widget.scss +3 -0
  49. package/package.json +1 -1
@@ -15,7 +15,7 @@
15
15
  display: flex;
16
16
  flex-direction: column;
17
17
  font-family: "Segoe UI", sans-serif;
18
-
18
+ overflow: auto;
19
19
  .select-product-dropdown {
20
20
  padding: 16px 24px;
21
21
  border-bottom: 1px solid #e0e0e0;
@@ -28,7 +28,10 @@
28
28
  align-items: center;
29
29
  padding: 16px 24px;
30
30
  border-bottom: 1px solid #e0e0e0;
31
-
31
+ position: sticky;
32
+ top: 0;
33
+ z-index: 999;
34
+ background: #fff;
32
35
  .title {
33
36
  display: flex;
34
37
  align-items: center;
@@ -64,71 +67,107 @@
64
67
  }
65
68
  }
66
69
 
67
- .dropdown-with-input-section {
68
- display: grid;
69
- gap: 2px;
70
+ // .dropdown-with-input-section {
71
+ // display: grid;
72
+ // gap: 2px;
70
73
 
71
- .dropdow-input-section {
72
- position: relative;
73
- display: flex;
74
- justify-content: flex-end;
75
- padding: 8px 12px;
76
- border: 1px solid #ccc;
77
- border-radius: 4px;
78
- width: 240px;
79
- .input-field {
80
- flex: 1;
81
- font-size: 14px;
82
- }
83
- .readonly-input,
84
- .dropdown__clear__icon,
85
- .dropdown__icon {
86
- cursor: pointer;
87
- }
88
- .dropdown__clear__icon {
89
- position: absolute;
90
- right: 32px;
91
- }
92
- .dropdown-menu {
93
- position: absolute;
94
- width: 100%;
95
- top: 35px;
96
- left: 0px;
97
- right: 24px;
98
- background: white;
99
- border: 1px solid #ddd;
100
- border-radius: 4px;
101
- max-height: 200px;
102
- overflow-y: auto;
103
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
104
- z-index: 10;
74
+ // .dropdow-input-section {
75
+ // position: relative;
76
+ // display: flex;
77
+ // justify-content: flex-end;
78
+ // padding: 8px 12px;
79
+ // border: 1px solid #ccc;
80
+ // border-radius: 4px;
81
+ // width: 240px;
82
+ // .dropdown-chips {
83
+ // display: flex;
84
+ // flex-wrap: wrap;
85
+ // gap: 4px;
86
+ // margin-bottom: 4px;
87
+ // }
105
88
 
106
- li {
107
- font-size: 14px;
108
- cursor: pointer;
89
+ // .dropdown-chip {
90
+ // background: #e2e2e2;
91
+ // padding: 4px 8px;
92
+ // border-radius: 12px;
93
+ // font-size: 12px;
94
+ // display: flex;
95
+ // align-items: center;
109
96
 
110
- &:hover {
111
- background-color: #f4f4f4;
112
- }
97
+ // .remove-chip {
98
+ // margin-left: 6px;
99
+ // cursor: pointer;
100
+ // font-weight: bold;
101
+ // }
102
+ // }
113
103
 
114
- &.no-result {
115
- color: #aaa;
116
- cursor: default;
117
- }
104
+ // .input-field {
105
+ // flex: 1;
106
+ // font-size: 14px;
107
+ // }
108
+ // .readonly-input,
109
+ // .dropdown__clear__icon,
110
+ // .dropdown__icon {
111
+ // cursor: pointer;
112
+ // }
113
+ // .dropdown__clear__icon {
114
+ // position: absolute;
115
+ // right: 32px;
116
+ // }
117
+ // .dropdown-menu {
118
+ // position: absolute;
119
+ // width: 100%;
120
+ // top: 35px;
121
+ // left: 0px;
122
+ // right: 24px;
123
+ // background: white;
124
+ // border: 1px solid #ddd;
125
+ // border-radius: 4px;
126
+ // max-height: 200px;
127
+ // overflow-y: auto;
128
+ // box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
129
+ // z-index: 10;
118
130
 
119
- .dropdown-item {
120
- width: 100%;
121
- height: 100%;
122
- padding: 8px 12px;
123
- text-align: left;
124
- }
125
- }
126
- }
127
- }
128
- .dropdow-input-section.full-width {
129
- width: 100% !important;
130
- }
131
- }
131
+ // li {
132
+ // font-size: 14px;
133
+ // cursor: pointer;
134
+
135
+ // &:hover {
136
+ // background-color: #f4f4f4;
137
+ // }
138
+
139
+ // &.no-result {
140
+ // color: #aaa;
141
+ // cursor: default;
142
+ // }
143
+
144
+ // .dropdown-item {
145
+ // width: 100%;
146
+ // height: 100%;
147
+ // padding: 8px 12px;
148
+ // text-align: left;
149
+ // display: flex;
150
+ // align-items: center;
151
+ // .item-image {
152
+ // background-image: url("");
153
+ // width: 30px;
154
+ // height: 30px;
155
+ // }
156
+ // .item-image-svg {
157
+ // display: flex;
158
+ // align-items: center;
159
+ // justify-content: center;
160
+ // background: #dfdfdf;
161
+ // margin-right: 8px;
162
+ // }
163
+ // }
164
+ // }
165
+ // }
166
+ // }
167
+ // .dropdow-input-section.full-width {
168
+ // width: 100% !important;
169
+ // }
170
+ // }
132
171
 
133
172
  .bulk-order-empty {
134
173
  flex: 1;
@@ -165,7 +204,7 @@
165
204
  padding: 12px;
166
205
  .product-details {
167
206
  display: flex;
168
-
207
+ gap: 10px;
169
208
  .product-image {
170
209
  img {
171
210
  width: 64px;
@@ -174,6 +213,9 @@
174
213
 
175
214
  .details {
176
215
  display: grid;
216
+ .p-before-price {
217
+ text-decoration: line-through;
218
+ }
177
219
  }
178
220
  }
179
221
  .product-entity-info,
@@ -184,7 +226,7 @@
184
226
  }
185
227
  }
186
228
  .bulkOrderPad-content {
187
- padding: 24px;
229
+ padding: 16px;
188
230
  .dropdown-options {
189
231
  display: inline-block;
190
232
  width: 100%;
@@ -209,6 +251,8 @@
209
251
  }
210
252
  .bulkOrderPad-section {
211
253
  display: flex;
254
+ max-height: calc(100vh - 154px);
255
+ overflow: auto;
212
256
  .first-option-title {
213
257
  writing-mode: vertical-rl;
214
258
  transform: rotate(180deg);
@@ -218,6 +262,8 @@
218
262
  display: flex;
219
263
  justify-content: center;
220
264
  overflow: visible;
265
+ position: sticky;
266
+ top: 0;
221
267
  .title {
222
268
  background: #ffffff;
223
269
  height: max-content;
@@ -242,10 +288,19 @@
242
288
  cursor: pointer;
243
289
  }
244
290
  }
291
+ td.option-cell:first-child {
292
+ position: sticky;
293
+ top: 0;
294
+ left: 0px;
295
+ background: #fff;
296
+ }
245
297
 
246
298
  thead {
247
299
  height: 40px;
248
300
  font-weight: bold;
301
+ position: sticky;
302
+ top: 0;
303
+ background: #fff;
249
304
  th {
250
305
  border-bottom: 1px solid #f0f0f0;
251
306
  &:first-child,