generated from dwd/boilarplate-remix-tailwind-antd
44 lines
2.7 KiB
TypeScript
44 lines
2.7 KiB
TypeScript
export default function Index() {
|
|
return(
|
|
<section className="container mx-auto">
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 ">
|
|
<div className="flex flex-col justify-center place-items-center border-r-[1px] border-[#CFCFCF] my-6">
|
|
<div className="flex flex-row space-x-2">
|
|
<div className="w-[53px] h-[53px] bg-[#FFF1E3] rounded-full flex justify-center place-items-center">
|
|
<img className=" " src="../../assets/calendar.svg" alt="" />
|
|
</div>
|
|
<p className="text-[32px] font-[800]">70%</p>
|
|
</div>
|
|
<p className="text-[16px] font-[600] text-[#414141] py-2">Average Attendance</p>
|
|
</div>
|
|
<div className="flex flex-col justify-center place-items-center border-r-[1px] border-[#CFCFCF] my-6">
|
|
<div className="flex flex-row space-x-2">
|
|
<div className="w-[53px] h-[53px] bg-[#FFF1E3] rounded-full flex justify-center place-items-center">
|
|
<img className=" " src="../../assets/cart.svg" alt="" />
|
|
</div>
|
|
<p className="text-[32px] font-[800]">02</p>
|
|
</div>
|
|
<p className="text-[16px] font-[600] text-[#414141] py-2">Total Certificates</p>
|
|
</div>
|
|
<div className="flex flex-col justify-center place-items-center border-r-[1px] border-[#CFCFCF] my-6">
|
|
<div className="flex flex-row space-x-2">
|
|
<div className="w-[53px] h-[53px] bg-[#FFF1E3] rounded-full flex justify-center place-items-center">
|
|
<img className=" " src="../../assets/note.svg" alt="" />
|
|
</div>
|
|
<p className="text-[32px] font-[800]">12</p>
|
|
</div>
|
|
<p className="text-[16px] font-[600] text-[#414141] py-2">Tests Taken</p>
|
|
</div>
|
|
<div className="flex flex-col justify-center place-items-center my-6">
|
|
<div className="flex flex-row space-x-2">
|
|
<div className="w-[53px] h-[53px] bg-[#FFF1E3] rounded-full flex justify-center place-items-center">
|
|
<img className=" " src="../../assets/module.svg" alt="" />
|
|
</div>
|
|
<p className="text-[32px] font-[800]">0</p>
|
|
</div>
|
|
<p className="text-[16px] font-[600] text-[#414141] py-2">Modules Completed</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
} |