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

products

Browse Source
This commit is contained in:
hamid zarghami
2025-03-29 14:18:37 +03:30
parent 784027544e
commit c6f46d4524
4 changed files with 179 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/products/page.tsx
+172
View File
@@ -0,0 +1,172 @@
'use client'
import { ArrowLeft } from 'iconsax-react'
import Image from 'next/image'
import { FC } from 'react'
import { Swiper, SwiperSlide } from 'swiper/react'
import DanakSuggestedService from '../home/DanakSuggestedService'
import DanakServices from '../home/DanakServices'
const Products: FC = () => {
return (
<div className='max-w-maxWidth mx-auto'>
<div className='flex justify-between mt-20 items-center'>
<h1 className='text-2xl font-bold'>
محصولات
</h1>
<div className='max-w-[320px] text-sm leading-6 hidden xl:block text-center xl:text-right'>
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است
</div>
</div>
<div className='mt-20'>
<Swiper
className='w-full'
spaceBetween={15}
slidesPerView={'auto'}
>
<SwiperSlide className='xl:max-w-[45%] max-w-[90%]'>
<div className='rounded-4xl overflow-hidden relative'>
<Image
src='https://burgeraddict.fr/wp-content/uploads/2024/09/MSG-Smash-Burger-FT-RECIPE0124-d9682401f3554ef683e24311abdf342b.jpg'
alt='product'
width={1080}
height={1080}
className='w-full h-[400px] object-cover'
/>
<div className='absolute bottom-0 left-0 w-full modalGlass3 h-[150px] rounded-b-3xl text-white p-4'>
<div className='flex justify-between items-center'>
<h6 className='text-xs'>
منو دیجیتال رستوران
</h6>
<div className='h-8 bg-black text-white rounded-xl text-sm px-5 flex items-center'>
دسته بندی
</div>
</div>
<div className='mt-6 flex justify-between items-end'>
<div className='flex gap-4'>
<div className='size-14 bg-red-50 rounded-2xl'></div>
<div>
<h2 className='text-xl font-bold'>
دی منو
</h2>
<div className='mt-1'>
<h6 className='text-sm'>
داناک
</h6>
</div>
</div>
</div>
<div className='flex gap-1.5 text-sm items-center'>
<div>جزییات</div>
<ArrowLeft
size={20}
color='white'
/>
</div>
</div>
</div>
</div>
</SwiperSlide>
<SwiperSlide className='xl:max-w-[45%] max-w-[90%]'>
<div className='rounded-4xl overflow-hidden relative'>
<Image
src='https://burgeraddict.fr/wp-content/uploads/2024/09/MSG-Smash-Burger-FT-RECIPE0124-d9682401f3554ef683e24311abdf342b.jpg'
alt='product'
width={1080}
height={1080}
className='w-full h-[400px] object-cover'
/>
<div className='absolute bottom-0 left-0 w-full modalGlass3 h-[150px] rounded-b-3xl text-white p-4'>
<div className='flex justify-between items-center'>
<h6 className='text-xs'>
منو دیجیتال رستوران
</h6>
<div className='h-8 bg-black text-white rounded-xl text-sm px-5 flex items-center'>
دسته بندی
</div>
</div>
<div className='mt-6 flex justify-between items-end'>
<div className='flex gap-4'>
<div className='size-14 bg-red-50 rounded-2xl'></div>
<div>
<h2 className='text-xl font-bold'>
دی منو
</h2>
<div className='mt-1'>
<h6 className='text-sm'>
داناک
</h6>
</div>
</div>
</div>
<div className='flex gap-1.5 text-sm items-center'>
<div>جزییات</div>
<ArrowLeft
size={20}
color='white'
/>
</div>
</div>
</div>
</div>
</SwiperSlide>
<SwiperSlide className='xl:max-w-[45%] max-w-[90%]'>
<div className='rounded-4xl overflow-hidden relative'>
<Image
src='https://burgeraddict.fr/wp-content/uploads/2024/09/MSG-Smash-Burger-FT-RECIPE0124-d9682401f3554ef683e24311abdf342b.jpg'
alt='product'
width={1080}
height={1080}
className='w-full h-[400px] object-cover'
/>
<div className='absolute bottom-0 left-0 w-full modalGlass3 h-[150px] rounded-b-3xl text-white p-4'>
<div className='flex justify-between items-center'>
<h6 className='text-xs'>
منو دیجیتال رستوران
</h6>
<div className='h-8 bg-black text-white rounded-xl text-sm px-5 flex items-center'>
دسته بندی
</div>
</div>
<div className='mt-6 flex justify-between items-end'>
<div className='flex gap-4'>
<div className='size-14 bg-red-50 rounded-2xl'></div>
<div>
<h2 className='text-xl font-bold'>
دی منو
</h2>
<div className='mt-1'>
<h6 className='text-sm'>
داناک
</h6>
</div>
</div>
</div>
<div className='flex gap-1.5 text-sm items-center'>
<div>جزییات</div>
<ArrowLeft
size={20}
color='white'
/>
</div>
</div>
</div>
</div>
</SwiperSlide>
</Swiper>
</div>
<DanakSuggestedService />
<DanakServices />
</div>
)
}
export default Products