@sc-360-v2/storefront-cms-library 0.3.38 → 0.3.40

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 (42) hide show
  1. package/dist/add-products-tab.scss +388 -0
  2. package/dist/badge.scss +84 -82
  3. package/dist/builder.js +1 -1
  4. package/dist/bulk-order-pad.scss +29 -34
  5. package/dist/buyForHeaders.scss +120 -2
  6. package/dist/buyForPopup.scss +41 -7
  7. package/dist/cart-details.scss +62 -65
  8. package/dist/cart-products-sidebar.scss +113 -83
  9. package/dist/cartAttributes.scss +277 -183
  10. package/dist/cartDropdownOverlay.scss +55 -27
  11. package/dist/checkout.scss +1017 -640
  12. package/dist/customization-tree.scss +42 -10
  13. package/dist/dropdownTemplate.scss +35 -25
  14. package/dist/employee-bulk-order.scss +219 -47
  15. package/dist/empty-states.scss +66 -66
  16. package/dist/functions.js +1 -1
  17. package/dist/functions.scss +7 -5
  18. package/dist/icons.js +1 -1
  19. package/dist/index.js +1 -1
  20. package/dist/item-stock.scss +27 -28
  21. package/dist/menu-v2.scss +2 -2
  22. package/dist/modal.scss +128 -75
  23. package/dist/past-orders.scss +272 -258
  24. package/dist/payment-methods.scss +70 -71
  25. package/dist/prefix-list.scss +1 -0
  26. package/dist/product-actions.scss +68 -68
  27. package/dist/product-sizechart.scss +13 -13
  28. package/dist/quick-links.scss +47 -48
  29. package/dist/quick-order-pad.scss +51 -51
  30. package/dist/quotes.scss +118 -116
  31. package/dist/review-cart.scss +196 -0
  32. package/dist/rfqs.scss +118 -116
  33. package/dist/types/builder/elements/add-products-tab/index.d.ts +46 -0
  34. package/dist/types/builder/enums/index.d.ts +2 -0
  35. package/dist/types/builder/index.d.ts +2 -1
  36. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +542 -0
  37. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +1747 -38
  38. package/dist/types/builder/tools/element-edit/checkout.d.ts +793 -254
  39. package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
  40. package/dist/video.scss +16 -7
  41. package/dist/widget.scss +2 -0
  42. package/package.json +1 -1
package/dist/cart-products-sidebar.scss CHANGED
@@ -12,7 +12,7 @@ $hint-color: #7d7d7d;
12
12
  $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
13
13
 
14
14
  // Sidebar Overlay
15
- .sidebar__overlay {
15
+ .minicart__overlay {
16
16
  position: fixed;
17
17
  width: 100%;
18
18
  height: 100%;
@@ -21,11 +21,11 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
21
21
  z-index: 9999;
22
22
  }
23
23
 
24
- .sidebar__container {
24
+ .minicart_container {
25
25
  position: fixed;
26
26
  top: 0;
27
27
  right: 0;
28
- width: 220px;
28
+ width: 125px;
29
29
  max-width: 100%;
30
30
  height: 100vh;
31
31
  background: $background-color;
@@ -36,6 +36,9 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
36
36
  animation: slide-in 0.3s ease-out;
37
37
  overflow-y: auto;
38
38
 
39
+ display: flex;
40
+ flex-direction: column;
41
+
39
42
  @keyframes slide-in {
40
43
  from {
41
44
  transform: translateX(100%);
@@ -47,15 +50,33 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
47
50
  }
48
51
 
49
52
  // Sidebar Header
50
- .sidebar__header {
51
- display: flex;
52
- justify-content: flex-end;
53
- align-items: center;
54
- padding: 8px 16px;
53
+ .minicart_header {
54
+ // display: flex;
55
+ // justify-content: flex-end;
56
+ // align-items: center;
57
+ padding-top: 6px;
55
58
  position: sticky;
56
59
  top: 0;
57
60
  background: #fff;
58
61
  z-index: 1;
62
+ .mincart_close_btn {
63
+ display: flex;
64
+ justify-content: flex-end;
65
+ width: 100%;
66
+ svg {
67
+ margin-right: 8px;
68
+ width: 18px;
69
+ height: 18px;
70
+ path {
71
+ stroke: var(--_gray-600);
72
+ }
73
+ }
74
+ &:hover {
75
+ svg path {
76
+ stroke: var(--_gray-900);
77
+ }
78
+ }
79
+ }
59
80
 
60
81
  h2 {
61
82
  font-size: 18px;
@@ -76,6 +97,71 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
76
97
  height: 24px;
77
98
  }
78
99
  }
100
+ .text_label {
101
+ padding: 6px 16px;
102
+ background-color: var(--_gray-100);
103
+ color: var(--_gray-600);
104
+ width: 100%;
105
+ text-align: center;
106
+ }
107
+ }
108
+
109
+ .mincart_items {
110
+ flex-grow: 1;
111
+ overflow-y: auto;
112
+ // Cart Popup
113
+ .cart_popup {
114
+ background-color: #fff;
115
+ border-radius: 8px;
116
+ }
117
+
118
+ .cart_item {
119
+ display: flex;
120
+ flex-direction: column;
121
+ align-items: center;
122
+ margin-bottom: 8px;
123
+ text-align: center;
124
+ padding: 12px;
125
+ border-bottom: 1px solid var(--_base-white);
126
+ &:hover {
127
+ background-color: var(--_gray-50);
128
+ }
129
+
130
+ .item_info {
131
+ margin-top: 10px;
132
+ text-align: center;
133
+ }
134
+
135
+ .item_title {
136
+ font-size: 12px;
137
+ font-weight: 500;
138
+ color: var(--_gray-600);
139
+ margin-bottom: 5px;
140
+ }
141
+
142
+ .item_price {
143
+ font-size: 12px;
144
+ font-weight: 700;
145
+ color: var(--_gray-900);
146
+ }
147
+
148
+ .item_image {
149
+ max-width: 100%;
150
+ height: auto;
151
+ border-radius: 4px;
152
+ }
153
+ .item_action_btn {
154
+ padding: 12px 16px;
155
+ color: var(--_primary-400);
156
+ margin-top: 8px;
157
+ border-radius: 6px;
158
+
159
+ &:hover {
160
+ background-color: var(--_primary-50);
161
+ color: var(--_primary-500);
162
+ }
163
+ }
164
+ }
79
165
  }
80
166
 
81
167
  // Sidebar Footer
@@ -113,89 +199,33 @@ $shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
113
199
  }
114
200
  }
115
201
 
116
- // Cart Popup
117
- .cart__popup {
118
- padding: 12px;
119
- background-color: #fff;
120
- border-radius: 8px;
121
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
122
- }
123
-
124
- .cart__header {
202
+ .minicart_info {
125
203
  display: flex;
126
204
  flex-direction: column;
127
205
  align-items: center;
128
- margin-bottom: 20px;
129
- }
130
-
131
- .total__label {
132
- font-size: 16px;
133
- font-weight: normal;
134
- color: #333;
135
- }
136
-
137
- .total__price {
138
- font-size: 20px;
139
- font-weight: bold;
140
- color: black;
141
- }
142
-
143
- .view-cart__btn {
144
- padding: 10px 15px;
145
- background-color: #007bff;
146
- color: #fff;
147
- border: none;
148
- border-radius: 4px;
149
- cursor: pointer;
150
- margin-top: 15px;
151
-
152
- &:hover {
153
- background-color: #0056b3;
206
+ .total_label {
207
+ font-size: 16px;
208
+ font-weight: normal;
209
+ color: var(--_gray-600);
154
210
  }
155
- }
156
211
 
157
- // Cart Content
158
- .cart__content {
159
- .cart__list-title {
160
- font-size: 18px;
161
- font-weight: bold;
162
- margin-bottom: 10px;
163
- text-align: center;
212
+ .total_price {
213
+ font-size: 20px;
214
+ font-weight: 600;
215
+ color: var(--_gray-900);
164
216
  }
165
217
 
166
- .cart__items {
167
- .cart__item {
168
- display: flex;
169
- flex-direction: column;
170
- align-items: center;
171
- margin-bottom: 20px;
172
- text-align: center;
173
- padding: 10px;
174
- border-bottom: 1px solid #eee;
175
-
176
- .item__info {
177
- margin-top: 10px;
178
- text-align: center;
179
- }
180
-
181
- .item__title {
182
- font-size: 16px;
183
- font-weight: normal;
184
- color: #333;
185
- margin-bottom: 5px;
186
- }
187
-
188
- .item__price {
189
- font-size: 18px;
190
- font-weight: bold;
191
- color: black;
192
- }
218
+ .view_cart_btn {
219
+ padding: 10px 15px;
220
+ background-color: var(--_primary-400);
221
+ color: var(--_base-white);
222
+ border: none;
223
+ border-radius: 4px;
224
+ cursor: pointer;
225
+ margin-block: 16px;
193
226
 
194
- .item__image {
195
- max-width: 150px;
196
- height: auto;
197
- border-radius: 4px;
198
- }
227
+ &:hover {
228
+ background-color: var(--_primary-500);
199
229
  }
200
230
  }
201
231
  }