web-isu-kini/components/landing-page/author.tsx

47 lines
1.5 KiB
TypeScript

import Image from "next/image";
import { Link, Mail, MailIcon, Share2 } from "lucide-react";
export default function Author() {
return (
<section className="w-full bg-white py-6">
<p className="mx-10 text-2xl mb-4">AUTHOR</p>
<div className=" border border-black p-6 flex items-center gap-6 max-w-[1200px] mx-auto">
{/* Foto Profil */}
<div className="w-20 h-20 relative ">
<Image
src="/author.png" // Ganti dengan path gambar kamu
alt="Author"
fill
className="rounded-full object-cover"
/>
</div>
{/* Info Author */}
<div className="flex-1">
<h3 className="text-lg font-semibold text-gray-800">Admin</h3>
<div className="mt-2 flex items-center gap-4 flex-wrap">
{/* Button lihat semua post */}
<button className="text-sm font-medium text-white hover:underline bg-[#655997] py-1 px-5 rounded-xl">
Lihat Semua Pos
</button>
<div className="bg-[#655997] rounded-full p-1">
<MailIcon
size={18}
className="text-white hover:text-black cursor-pointer "
></MailIcon>
</div>
<div className="bg-[#655997] rounded-full p-1">
<Link
size={18}
className="text-white hover:text-black cursor-pointer "
></Link>
</div>
</div>
</div>
</div>
</section>
);
}