generated from dwd/boilarplate-remix-tailwind-antd
28 lines
1.7 KiB
TypeScript
28 lines
1.7 KiB
TypeScript
export default function Index(){
|
|
return(
|
|
<>
|
|
<section className='container-fluid bg-[#000] '>
|
|
<div className="flex flex-row justify-center gap-x-8 py-6">
|
|
<p className="text-[42px] w-[42px] h-[31px]">✨</p>
|
|
<div className="flex flex-col justify-center place-items-center">
|
|
<p className="text-[#FFF] text-[24px] font-[700]"> Take an AI Generative Quiz</p>
|
|
<p className="text-[#FFF] text-[16px] font-[400]">Convert any text into an interactive quiz session</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<button className="float-right absolute right-0 2xl:right-80 top-32 bg-[#9D9D9D] w-[45px] h-[45px] font-[700] text-[#FFF] text-[20px] rounded-full">✕</button>
|
|
|
|
<section id="" className="container mx-auto max-w-[894px] shadow-xl rounded-xl px-10 py-8 my-8" >
|
|
<div className="flex flex-col justify-center place-items-center space-y-3">
|
|
<img src="../../assets/image1.png" alt="" />
|
|
<p className="text-[32px] font-[600]">Are You Ready to take this Quiz?</p>
|
|
<p className="text-[20px] font-[400] text-[#525252]">Test Yourself and earn points for what you already know.</p>
|
|
<p className="text-[20px] font-[400] text-[#525252]"><span>10 Questions</span> • <span>30 minutes</span></p>
|
|
<div>
|
|
<button className="bg-[#000] text-[#FFF] text-[18px] text-[#FFF] font-[600] rounded-[8px] px-[100px] py-[15px] mt-[50px]">Start</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</>
|
|
)
|
|
} |