danak/shop-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive

Browse Source
This commit is contained in:
hamid zarghami
2025-09-03 15:06:15 +03:30
parent 138f26e293
commit d051e7110a
33 changed files with 440 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/product/components/ProductImage.tsx
+8 -8
View File
@@ -4,22 +4,22 @@ import ActionProduct from './ActionProduct'
const ProductImage: FC = () => {
return (
<div className='w-[380px]'>
<div className='w-full border border-border rounded-xl h-[400px] flex justify-center items-center relative'>
<div className='w-full max-w-[380px] mx-auto lg:mx-0'>
<div className='w-full border border-border rounded-xl h-[300px] sm:h-[350px] md:h-[400px] flex justify-center items-center relative'>
<Image
src={'https://dkstatics-public.digikala.com/digikala-products/c0a7ce006d11c222bce16bd3cdd8d79aeb6689bc_1738134271.jpg?x-oss-process=image/resize,m_lfit,h_800,w_800/format,webp/quality,q_90'}
width={300}
height={300}
alt=''
className='max-w-[240px] max-h-[240px] object-contain'
className='max-w-[200px] max-h-[200px] sm:max-w-[240px] sm:max-h-[240px] object-contain'
/>
<ActionProduct />
</div>
<div className='flex gap-3 mt-4'>
<div className='size-20 border border-border rounded-xl'></div>
<div className='size-20 border border-border rounded-xl'></div>
<div className='size-20 border border-border rounded-xl'></div>
<div className='size-20 border border-border rounded-xl'></div>
<div className='flex gap-2 sm:gap-3 mt-4 justify-center lg:justify-start overflow-x-auto'>
<div className='size-16 sm:size-20 border border-border rounded-xl shrink-0'></div>
<div className='size-16 sm:size-20 border border-border rounded-xl shrink-0'></div>
<div className='size-16 sm:size-20 border border-border rounded-xl shrink-0'></div>
<div className='size-16 sm:size-20 border border-border rounded-xl shrink-0'></div>
</div>
</div>
)