hamid zarghami
27 lines
922 B
TypeScript
27 lines
922 B
TypeScript
import CategoryImage from "@/assets/images/category.jpg";
|
|
import { ArrowLeft } from "iconsax-reactjs";
|
|
import Image from "next/image";
|
|
import { type FC } from "react";
|
|
|
|
type CategoryCardProps = {
|
|
title: string;
|
|
};
|
|
|
|
const CategoryCard: FC<CategoryCardProps> = ({ title }) => {
|
|
return (
|
|
<div className="w-full bg-[#D4E3F154]/33 rounded-[24px] sm:rounded-[40px] p-4 sm:p-6">
|
|
<div className="flex justify-between items-center gap-2">
|
|
<div className="text-[#21588C] font-bold text-sm sm:text-base">{title}</div>
|
|
<div className="bg-white/40 flex justify-center items-center">
|
|
<ArrowLeft size={20} color="currentColor" className="text-primary rotate-45" />
|
|
</div>
|
|
</div>
|
|
<div className="mt-4">
|
|
<Image src={CategoryImage} alt={title} width={300} height={300} className="w-full h-auto rounded-3xl" />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CategoryCard;
|