96 lines
3.4 KiB
TypeScript
96 lines
3.4 KiB
TypeScript
import CountDown from "@/components/lottery/countDown/CountDown";
|
|
import SpinWheel from "@/components/lottery/spinWheel/SpinWheel";
|
|
import Image from "next/image";
|
|
import React from "react";
|
|
|
|
const page = () => {
|
|
return (
|
|
<div className="flex flex-col gap-[128px] font-roboto pt-[64px] pb-[128px] text-lightOnSurface">
|
|
<section className="">
|
|
<div className="container">
|
|
<div className="flex flex-col gap-[32px]">
|
|
<h1 className="font-display-1-regular text-center">Bije</h1>
|
|
<div className="mb-8">
|
|
<Image
|
|
src="/banner-lottery.jpg"
|
|
width={1416}
|
|
height={177}
|
|
alt="banner"
|
|
className="rounded-[12px]"
|
|
/>
|
|
</div>
|
|
|
|
<CountDown />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div className="container">
|
|
<div className="flex gap-6 bg-lightSurfaceContainer rounded-[12px]">
|
|
{/* Winners */}
|
|
<div className="flex flex-col w-full p-8 gap-4">
|
|
<div className="flex flex-col gap-2 pb-4 border-b border-lightOutlineVariant">
|
|
<h4 className="font-heading-3-regular">Results</h4>
|
|
<p className="font-base-medium">
|
|
The results after each stage will be shown here.
|
|
</p>
|
|
</div>
|
|
|
|
{[...Array(5)].map((item, index) => (
|
|
<div className="flex flex-col gap-2 pb-4 last:border-none border-b border-lightOutlineVariant">
|
|
<h4 className="font-heading-5-regular">
|
|
The winner of the {index + 1} stage:
|
|
</h4>
|
|
<p className="font-base-medium">8 XX XX-XX-XX</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Sping the wheel */}
|
|
<div className="flex justify-center items-center w-full h-full px-8 py-[29px]">
|
|
<SpinWheel />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div className="container">
|
|
<div className="flex flex-col gap-8">
|
|
<h2 className="font-heading-1-regular">Lotereýanyň duzgunleri:</h2>
|
|
<div className="flex gap-6">
|
|
<div className="flex flex-col gap-4 bg-lightSurfaceContainer py-4 px-8 rounded-[12px] w-full">
|
|
<h3 className="font-heading-5-regular">Umumy düzgünler:</h3>
|
|
<ul className="list-disc flex flex-col gap-4 pl-[16px]">
|
|
{Array(5)
|
|
.fill(" ")
|
|
.map((item) => (
|
|
<li className="font-small-regular">
|
|
Ilkinji we dogry jogap beren sanawda ilkinji ýeri
|
|
eýelýär
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-4 bg-lightSurfaceContainer py-4 px-8 rounded-[12px] w-full">
|
|
<h3 className="font-heading-5-regular">Üns beriň:</h3>
|
|
<ul className="list-disc flex flex-col gap-4 pl-[16px]">
|
|
{Array(1)
|
|
.fill(" ")
|
|
.map((item) => (
|
|
<li className="font-small-regular">SMS = 1 manat</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default page;
|