add: club discount page
This commit is contained in:
@@ -1,4 +1,5 @@
|
|||||||
import { Button } from '@/components/ui/button'
|
import { ef } from '@/lib/helpers/utfNumbers'
|
||||||
|
import { Cup, Star1 } from 'iconsax-react'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
function TransactionsIndex() {
|
function TransactionsIndex() {
|
||||||
@@ -10,7 +11,7 @@ function TransactionsIndex() {
|
|||||||
aria-label="درباره کدهای تخفیف"
|
aria-label="درباره کدهای تخفیف"
|
||||||
className='mt-3 bg-container rounded-normal grid grid-cols-4 items-center'
|
className='mt-3 bg-container rounded-normal grid grid-cols-4 items-center'
|
||||||
>
|
>
|
||||||
<div className='col-span-3 py-9.5 pe-7 ps-5 relative'>
|
<div className='col-span-3 py-5 pe-7 ps-5 relative h-36.5'>
|
||||||
<div className='w-full h-full absolute top-0 left-0 overflow-clip'>
|
<div className='w-full h-full absolute top-0 left-0 overflow-clip'>
|
||||||
<svg width="301" height="146" viewBox="0 0 301 146" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="301" height="146" viewBox="0 0 301 146" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<g opacity="0.15">
|
<g opacity="0.15">
|
||||||
@@ -21,68 +22,37 @@ function TransactionsIndex() {
|
|||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
<h2 className='font-bold text-base'>کدهای تخفیف شما</h2>
|
<div className='flex flex-col justify-between h-full'>
|
||||||
<p className='text-xs mt-[7px]'>کد تخفیف مورد نظر را کپی کنید و در بخش پرداختها استفاده کنید</p>
|
<div>
|
||||||
|
<h2 className='font-bold text-base'>در باشگاه مشتریان</h2>
|
||||||
|
<p className='text-xs mt-[7px]'>با امتیازی که داری سفارش بده!</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className='text-xs font-medium'>مجموع امتیازات شما: {ef('1500')}</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
className='col-span-1 h-full text-end py-4 px-5.5 flex flex-col justify-between rounded-e-normal'
|
className='max-w-36 place-self-end col-span-1 h-full text-end py-4 px-5.5 flex flex-col justify-between rounded-e-normal'
|
||||||
style={{
|
style={{
|
||||||
background: 'linear-gradient(165.51deg, #000000 -8.44%, #C3C7DD 100%)',
|
background: 'linear-gradient(165.51deg, #000000 -8.44%, #C3C7DD 100%)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<p className='text-sm2 text-white leading-tight'>
|
<p className='text-sm2 text-white leading-tight'>
|
||||||
<span className='font-medium'>Your</span><br />
|
<span className='font-normal'>Customer</span><br />
|
||||||
<span className='font-bold'>Coupon</span>
|
<span className='font-medium'>Club</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<svg className='w-full' height="20" viewBox="0 0 72 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<div className='place-self-center w-fit border max-h-6 flex justify-center items-center gap-1 border-white rounded-sm py-1 px-1.5'>
|
||||||
<path d="M4.0033 0H0.845703V20H4.0033V0Z" fill="white" />
|
<Star1 className='fill-white stroke-white' size={8} />
|
||||||
<path d="M9.266 0H6.1084V20H9.266V0Z" fill="white" />
|
<Star1 className='fill-white stroke-white' size={8} />
|
||||||
<path d="M12.4236 0H11.3711V20H12.4236V0Z" fill="white" />
|
<Star1 className='fill-white stroke-white' size={8} />
|
||||||
<path d="M16.6344 0H14.5293V20H16.6344V0Z" fill="white" />
|
<Cup className='stroke-white' size={16} />
|
||||||
<path d="M19.7916 0H17.6865V20H19.7916V0Z" fill="white" />
|
</div>
|
||||||
<path d="M24.0018 0H22.9492V20H24.0018V0Z" fill="white" />
|
|
||||||
<path d="M28.2113 0H25.0537V20H28.2113V0Z" fill="white" />
|
|
||||||
<path d="M30.3182 0H29.2656V20H30.3182V0Z" fill="white" />
|
|
||||||
<path d="M33.4744 0H32.4219V20H33.4744V0Z" fill="white" />
|
|
||||||
<path d="M36.6324 0H34.5273V20H36.6324V0Z" fill="white" />
|
|
||||||
<path d="M42.9478 0H40.8428V20H42.9478V0Z" fill="white" />
|
|
||||||
<path d="M47.1576 0H44V20H47.1576V0Z" fill="white" />
|
|
||||||
<path d="M49.2625 0H48.21V20H49.2625V0Z" fill="white" />
|
|
||||||
<path d="M55.5785 0H52.4209V20H55.5785V0Z" fill="white" />
|
|
||||||
<path d="M57.6824 0H56.6299V20H57.6824V0Z" fill="white" />
|
|
||||||
<path d="M62.9455 0H58.7354V20H62.9455V0Z" fill="white" />
|
|
||||||
<path d="M66.1031 0H63.998V20H66.1031V0Z" fill="white" />
|
|
||||||
<path d="M71.3666 0H68.209V20H71.3666V0Z" fill="white" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="mt-6 space-y-6" aria-label="لیست کدهای تخفیف">
|
|
||||||
{[1, 2, 3].map((_, i) => (
|
|
||||||
<article
|
|
||||||
key={i}
|
|
||||||
className='bg-container rounded-normal flex justify-between items-center'
|
|
||||||
>
|
|
||||||
<div className='py-4 pe-7 ps-5 border-e-2 w-full border-border border-dashed'>
|
|
||||||
<h3 className='font-bold text-sm2'>مبلغ تخفیف: 50,000 تومان</h3>
|
|
||||||
<p className='text-xs mt-[7px]'>قابل استفاده برای همهی منوها و محصولات</p>
|
|
||||||
<Button
|
|
||||||
className='w-fit px-10 py-1.5 mt-4 text-xs rounded-lg font-light'
|
|
||||||
aria-label="کپی کد تخفیف"
|
|
||||||
>
|
|
||||||
کپی کد
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p className='text-sm2 transform -rotate-90 text-[#B2B2B2] font-medium' aria-label="کد تخفیف">
|
|
||||||
F12BB587
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
))}
|
|
||||||
</section>
|
|
||||||
</section>
|
</section>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user