53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
|
|
export default function VideoCard() {
|
|
const slug = "bharatu-mardi-hadji-gugur-saat-bertugas";
|
|
|
|
return (
|
|
<Link href={`/details/${slug}?type=video`}>
|
|
<div className="group bg-white rounded-2xl border border-gray-100 shadow-sm hover:shadow-md transition duration-300 overflow-hidden cursor-pointer">
|
|
{/* IMAGE */}
|
|
<div className="relative h-[200px] w-full">
|
|
<Image
|
|
src="/image/bharatu.jpg"
|
|
alt="news"
|
|
fill
|
|
className="object-cover group-hover:scale-105 transition duration-300"
|
|
/>
|
|
</div>
|
|
|
|
{/* CONTENT */}
|
|
<div className="p-5 space-y-3">
|
|
{/* BADGE + TAG */}
|
|
<div className="flex items-center gap-2 text-xs">
|
|
<span className="bg-red-600 text-white px-2 py-[3px] rounded-md font-medium">
|
|
POLRI
|
|
</span>
|
|
<span className="text-gray-500 uppercase tracking-wide">
|
|
SEPUTAR PRESTASI
|
|
</span>
|
|
</div>
|
|
|
|
{/* DATE */}
|
|
<p className="text-xs text-gray-400">02 Februari 2024</p>
|
|
|
|
{/* TITLE */}
|
|
<h3 className="font-semibold text-[15px] leading-snug line-clamp-2 group-hover:text-[#966314] transition">
|
|
Bharatu Mardi Hadji Gugur Saat Bertugas, Diganjar Kenaikan Pangkat
|
|
Luar Biasa
|
|
</h3>
|
|
|
|
{/* EXCERPT */}
|
|
<p className="text-sm text-gray-500 line-clamp-2 leading-relaxed">
|
|
Jakarta - Kapolri Jenderal Polisi Drs. Listyo Sigit Prabowo
|
|
memberikan kenaikan pangkat luar biasa anumerta kepada...
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
);
|
|
}
|