42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
import { cn } from "../../../lib/cn";
|
|
|
|
export interface ArticleItemProps {
|
|
id: number;
|
|
name: string;
|
|
tags: string[];
|
|
}
|
|
|
|
const ArticleItem: React.FC<ArticleItemProps> = ({
|
|
id, name, tags
|
|
}) => {
|
|
return (
|
|
<div className={cn("w-full relative rounded-[10px] text-liquid-white mb-[20px]",
|
|
// type == "first" ? "bg-liquid-lighter" : "bg-liquid-background",
|
|
"gap-[20px] px-[20px] py-[10px] box-border ",
|
|
"border-b-[1px] border-b-liquid-lighter",
|
|
)}>
|
|
<div className="h-[23px] flex ">
|
|
|
|
<div className="text-[18px] font-bold w-[60px] mr-[20px] flex items-center">
|
|
#{id}
|
|
</div>
|
|
<div className="text-[18px] font-bold flex items-center bg-red-400r">
|
|
{name}
|
|
</div>
|
|
</div>
|
|
<div className="text-[14px] flex text-liquid-light gap-[10px] mt-[10px]">
|
|
{tags.map((v, i) =>
|
|
<div key={i} className={cn(
|
|
"rounded-full px-[16px] py-[8px] bg-liquid-lighter",
|
|
v == "Sertificated" && "text-liquid-green")}>
|
|
{v}
|
|
</div>
|
|
)}
|
|
</div>
|
|
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ArticleItem;
|