@riosst100/pwa-marketplace 2.8.2 → 2.8.4
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/package.json
CHANGED
|
@@ -59,6 +59,11 @@ const Item = ({ sellerItem, refetchFavoriteSellerList }) => {
|
|
|
59
59
|
|
|
60
60
|
return (
|
|
61
61
|
<>
|
|
62
|
+
<style>{`
|
|
63
|
+
.btn-orange-outline { border-color: #f76b1c !important; color: #f76b1c !important; background: #ffffff; }
|
|
64
|
+
.btn-orange-outline:hover { background: #f76b1c !important; color: #ffffff !important; }
|
|
65
|
+
.btn-orange-outline:hover span { color: #ffffff !important; }
|
|
66
|
+
`}</style>
|
|
62
67
|
<div className='border border-gray-100 rounded-md p-5 flex flex-col md_flex-row justify-between gap-y-4 relative'>
|
|
63
68
|
{removing && (
|
|
64
69
|
<div className="absolute inset-0 bg-white bg-opacity-60 flex items-center justify-center z-10">
|
|
@@ -78,17 +83,12 @@ const Item = ({ sellerItem, refetchFavoriteSellerList }) => {
|
|
|
78
83
|
{sellerItem?.seller?.name || '-'}
|
|
79
84
|
</div>
|
|
80
85
|
</div>
|
|
81
|
-
<div className='flex flex-row gap-x-[5px] items-center'>
|
|
82
|
-
<span className='font-normal text-[12px] text-gray-200 '>
|
|
83
|
-
{sellerItem?.seller?.description || '-'}
|
|
84
|
-
</span>
|
|
85
|
-
</div>
|
|
86
86
|
</div>
|
|
87
87
|
<div className='flex gap-4'>
|
|
88
88
|
<Button
|
|
89
89
|
classes={{
|
|
90
90
|
content: 'gap-1.5 grid-flow-col inline-grid items-center justify-center justify-items-center capitalize font-medium text-[14px]',
|
|
91
|
-
rootClass: 'py-[0px] h-9
|
|
91
|
+
rootClass: 'btn-orange-outline py-[0px] h-9 border-orange-500 text-[#f76b1c]'
|
|
92
92
|
}}
|
|
93
93
|
onClick={handleGoToSellerPage}
|
|
94
94
|
variant="outlined"
|
|
@@ -101,7 +101,7 @@ const Item = ({ sellerItem, refetchFavoriteSellerList }) => {
|
|
|
101
101
|
<Button
|
|
102
102
|
classes={{
|
|
103
103
|
content: 'gap-1.5 grid-flow-col inline-grid items-center justify-center justify-items-center capitalize font-medium text-[14px]',
|
|
104
|
-
rootClass: 'py-[0px] h-9
|
|
104
|
+
rootClass: 'btn-orange-outline py-[0px] h-9 border-orange-500 text-[#f76b1c]'
|
|
105
105
|
}}
|
|
106
106
|
onClick={handleRemoveFromFavorite}
|
|
107
107
|
disabled={removing}
|
|
@@ -116,6 +116,17 @@ const SellerDetail = props => {
|
|
|
116
116
|
|
|
117
117
|
return (
|
|
118
118
|
<div className=' py-8'>
|
|
119
|
+
<style>{`
|
|
120
|
+
.send-message-btn:hover { background: #f76b1c !important; }
|
|
121
|
+
.send-message-btn:hover .stroke { stroke: #ffffff !important; }
|
|
122
|
+
.send-message-btn:hover span { color: #ffffff !important; }
|
|
123
|
+
.share-btn:hover { background: #f76b1c !important; }
|
|
124
|
+
.share-btn:hover .stroke { stroke: #ffffff !important; }
|
|
125
|
+
.share-btn:hover span { color: #ffffff !important; }
|
|
126
|
+
.favorite-btn:hover { background: #f76b1c !important; color: #ffffff !important; }
|
|
127
|
+
.favorite-btn:hover span { color: #ffffff !important; }
|
|
128
|
+
.favorite-btn:hover svg { stroke: #ffffff !important; fill: #ffffff !important; }
|
|
129
|
+
`}</style>
|
|
119
130
|
<Slider seller={seller} rootClassname='mb-[30px]' />
|
|
120
131
|
<div className='flex xs_flex-col lg_flex-row justify-between mb-[30px] p-[20px] rounded-[6px] border border-solid border-gray-100 shadow-[0px_0px_5px_3px_#d9d9d933]'>
|
|
121
132
|
{/* Left: logo + info */}
|
|
@@ -156,14 +167,14 @@ const SellerDetail = props => {
|
|
|
156
167
|
|
|
157
168
|
{/* Right: action buttons */}
|
|
158
169
|
<div className='flex xs_flex-wrap items-center xs_justify-center lg_justify-end gap-[10px] xs_mt-4 lg_mt-0 xs_pt-2 lg_pt-0 relative'>
|
|
159
|
-
|
|
160
|
-
<Sms color="#f76b1c" size={16} variant='Outline' className='stroke
|
|
170
|
+
<button className='send-message-btn flex items-center justify-center gap-[8px] px-[14px] py-[8px] bg-white rounded-[30px] border border-solid border-[#f76b1c] min-w-[44px]'>
|
|
171
|
+
<Sms color="#f76b1c" size={16} variant='Outline' className='stroke' />
|
|
161
172
|
<span className='text-[#f76b1c] text-[14px] font-medium whitespace-nowrap md_block xs_hidden'>Send Message</span>
|
|
162
173
|
</button>
|
|
163
174
|
<Suspense fallback={null}>
|
|
164
175
|
<FavoriteSellerButton
|
|
165
176
|
classes={{
|
|
166
|
-
root: 'flex items-center justify-center gap-[8px] px-[14px] py-[8px] bg-white rounded-[30px] border border-solid border-[#f76b1c] min-w-[44px]'
|
|
177
|
+
root: 'favorite-btn flex items-center justify-center gap-[8px] px-[14px] py-[8px] bg-white rounded-[30px] border border-solid border-[#f76b1c] min-w-[44px]'
|
|
167
178
|
}}
|
|
168
179
|
{...favoriteSellerButtonProps}
|
|
169
180
|
buttonText={'Follow Seller'}
|
|
@@ -173,8 +184,8 @@ const SellerDetail = props => {
|
|
|
173
184
|
}}
|
|
174
185
|
/>
|
|
175
186
|
</Suspense>
|
|
176
|
-
<button className='flex items-center justify-center gap-[8px] px-[14px] py-[8px] bg-white rounded-[30px] border border-solid border-[#f76b1c] min-w-[44px]'>
|
|
177
|
-
<Share color='#f76b1c' size={16} variant='Outline' className='stroke
|
|
187
|
+
<button className='share-btn flex items-center justify-center gap-[8px] px-[14px] py-[8px] bg-white rounded-[30px] border border-solid border-[#f76b1c] min-w-[44px]'>
|
|
188
|
+
<Share color='#f76b1c' size={16} variant='Outline' className='stroke' />
|
|
178
189
|
<span className='text-[#f76b1c] text-[14px] font-medium whitespace-nowrap md_block xs_hidden'>Share</span>
|
|
179
190
|
</button>
|
|
180
191
|
</div>
|