@sc-360-v2/storefront-cms-library 0.3.39 → 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.
package/dist/modal.scss CHANGED
@@ -226,6 +226,8 @@ $z-index-min-cart: calc(
226
226
  $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
227
227
 
228
228
  .modalV2-main {
229
+ position: fixed;
230
+ z-index: 30;
229
231
  .modalV2-wrapper {
230
232
  overflow: hidden !important;
231
233
  position: fixed;
@@ -291,6 +293,19 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
291
293
  gap: 8px;
292
294
  background-color: var(--_primary-400);
293
295
  color: var(--_base-white);
296
+ &.disabled {
297
+ opacity: 0.5;
298
+ pointer-events: none;
299
+ }
300
+ .loader {
301
+ animation: rotate-icon 1s linear infinite;
302
+ display: inline-block;
303
+ transform-origin: center;
304
+
305
+ svg path {
306
+ stroke: var(--_primary-200);
307
+ }
308
+ }
294
309
 
295
310
  &:hover {
296
311
  background-color: var(--_primary-500);
@@ -671,3 +686,12 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
671
686
  }
672
687
  }
673
688
  }
689
+
690
+ @keyframes rotate-icon {
691
+ 0% {
692
+ transform: rotate(0deg);
693
+ }
694
+ 100% {
695
+ transform: rotate(360deg);
696
+ }
697
+ }
@@ -0,0 +1,196 @@
1
+ .review_cart-main {
2
+ border: 1px solid var(--_gray-200);
3
+ border-radius: 6px;
4
+ margin: 24px;
5
+ padding: 24px 24px 8px 24px;
6
+ max-height: 550px;
7
+ overflow-y: auto;
8
+ .review_header {
9
+ padding-bottom: 24px;
10
+ border-bottom: 1px solid var(--_gray-200);
11
+ display: flex;
12
+ justify-content: space-between;
13
+ align-items: center;
14
+ h2 {
15
+ font-size: 16px;
16
+ font-weight: 700;
17
+ color: var(--_gray-900);
18
+ line-height: 24px;
19
+ span {
20
+ margin-left: 6px;
21
+ }
22
+ }
23
+ ul {
24
+ display: flex;
25
+ align-items: center;
26
+ li {
27
+ line-height: 20px;
28
+ font-size: 14px;
29
+ font-weight: 400;
30
+ color: var(--_gray-600);
31
+ span {
32
+ vertical-align: middle;
33
+ margin-right: 6px;
34
+ }
35
+ &::after {
36
+ content: "";
37
+ width: 5px;
38
+ height: 5px;
39
+ border-radius: 50%;
40
+ background: var(--_gray-300);
41
+ display: inline-block;
42
+ margin: 0 12px;
43
+ }
44
+ &:last-child::after {
45
+ width: 0;
46
+ margin: 0;
47
+ }
48
+ }
49
+ }
50
+ }
51
+ .shipping_address {
52
+ display: flex;
53
+ padding: 24px 0;
54
+ border-bottom: 1px solid var(--_gray-200);
55
+ .shipping {
56
+ min-width: 45%;
57
+ margin-right: 16px;
58
+ border-right: 1px solid var(--_gray-200);
59
+ &:last-of-type {
60
+ border-right: 0;
61
+ }
62
+
63
+ h6 {
64
+ color: var(--_gray-500);
65
+ font-weight: 400;
66
+ font-size: 14px;
67
+ line-height: 20px;
68
+ }
69
+ .shipping_details {
70
+ font-size: 14px;
71
+ font-weight: 600;
72
+ color: var(--_gray-900);
73
+ line-height: 20px;
74
+ }
75
+ }
76
+ .cart_main {
77
+ width: 10%;
78
+ display: flex;
79
+ gap: 16px;
80
+ align-items: center;
81
+ .cart_icon {
82
+ position: relative;
83
+ .badge {
84
+ position: absolute;
85
+ top: -9px;
86
+ background: #ffd700;
87
+ border-radius: 4px;
88
+ left: 15px;
89
+ padding: 2px;
90
+ line-height: normal;
91
+ color: #1f1930;
92
+ font-weight: 400;
93
+ }
94
+ }
95
+ .cart_content {
96
+ display: flex;
97
+ flex-direction: column;
98
+ .cart_amount {
99
+ color: var(--_gray-900);
100
+ font-size: 14px;
101
+ font-weight: 600;
102
+ line-height: 20px;
103
+ }
104
+ }
105
+ }
106
+ }
107
+ }
108
+
109
+ .cart-items {
110
+ h6 {
111
+ font-size: 14px;
112
+ font-weight: 600;
113
+ color: var(--_gray-900);
114
+ margin: 24px 0;
115
+ line-height: 20px;
116
+ }
117
+ }
118
+ .cart_item-grid {
119
+ display: grid;
120
+ grid-template-columns: repeat(2, 1fr);
121
+ gap: 24px 38px;
122
+ padding-right: 12px;
123
+ .cart_item-card {
124
+ display: flex;
125
+ gap: 12px;
126
+ img {
127
+ width: 60px;
128
+ height: 60px;
129
+ object-fit: cover;
130
+ border-radius: 4px;
131
+ }
132
+ .product_item-details {
133
+ .product_item-name {
134
+ font-size: 14px;
135
+ font-weight: 700;
136
+ line-height: 18px;
137
+ color: var(--_gray-900);
138
+ }
139
+ .delivery-date {
140
+ color: var(--_gray-900);
141
+ font-weight: 700;
142
+ font-size: 14px;
143
+ }
144
+ .product_item-specs {
145
+ display: flex;
146
+ li {
147
+ color: var(--_gray-600);
148
+ font-size: 14px;
149
+ font-weight: 400;
150
+ line-height: 18px;
151
+ &::after {
152
+ content: " / ";
153
+ padding: 0 4px;
154
+ }
155
+ &:last-child::after {
156
+ content: "";
157
+ padding: 0;
158
+ }
159
+ }
160
+ }
161
+ }
162
+ }
163
+ .product_item-price {
164
+ margin-left: auto;
165
+ color: var(--_gray-900);
166
+ font-size: 14px;
167
+ font-weight: 700;
168
+ }
169
+ }
170
+
171
+ .order_attributes {
172
+ padding-block: 24px;
173
+ border-top: 1px solid var(--_gray-200);
174
+
175
+ .order_label {
176
+ font-size: 14px;
177
+ color: var(--_gray-600);
178
+ }
179
+ .order_description {
180
+ font-size: 14px;
181
+ color: var(--_gray-900);
182
+ }
183
+ }
184
+
185
+ .show-more-wrapper {
186
+ margin: 32px 16px 16px 0px;
187
+ button {
188
+ padding: 12px 16px;
189
+ color: var(--_primary-400);
190
+ font-weight: 600;
191
+ border-radius: 6px;
192
+ &:hover {
193
+ background-color: var(--_primary-25);
194
+ }
195
+ }
196
+ }