87 lines
2.7 KiB
TypeScript
87 lines
2.7 KiB
TypeScript
|
// components/landing-page/Footer.tsx
|
||
|
|
import {
|
||
|
|
Globe,
|
||
|
|
Instagram,
|
||
|
|
Facebook,
|
||
|
|
Twitter,
|
||
|
|
Youtube,
|
||
|
|
Music2,
|
||
|
|
} from "lucide-react";
|
||
|
|
import Image from "next/image";
|
||
|
|
|
||
|
|
export default function Footer() {
|
||
|
|
return (
|
||
|
|
<footer className="bg-[#f9f9f9] text-black py-6 border-t border-gray-200">
|
||
|
|
<div className="container mx-auto px-6 flex flex-col md:flex-row items-center justify-between gap-6">
|
||
|
|
{/* Kiri */}
|
||
|
|
<div className="flex flex-col md:flex-col items-start gap-6 text-sm text-gray-700">
|
||
|
|
<div className="flex items-center gap-2">
|
||
|
|
<Globe className="w-4 h-4" />
|
||
|
|
<span>Indonesia</span>
|
||
|
|
<svg
|
||
|
|
xmlns="http://www.w3.org/2000/svg"
|
||
|
|
fill="none"
|
||
|
|
viewBox="0 0 24 24"
|
||
|
|
strokeWidth={2}
|
||
|
|
stroke="currentColor"
|
||
|
|
className="w-4 h-4"
|
||
|
|
>
|
||
|
|
<path
|
||
|
|
strokeLinecap="round"
|
||
|
|
strokeLinejoin="round"
|
||
|
|
d="M19 9l-7 7-7-7"
|
||
|
|
/>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p className="text-center md:text-left text-gray-600">
|
||
|
|
© 2025 Qudo Buana Nawakara. Semua Hak Dilindungi.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Tengah - Sosial Media */}
|
||
|
|
|
||
|
|
{/* Kanan */}
|
||
|
|
<div className="flex flex-col md:flex-row items-center gap-4">
|
||
|
|
<div className="flex items-center justify-center gap-4 text-black">
|
||
|
|
<Instagram className="w-5 h-5 hover:text-gray-500 cursor-pointer" />
|
||
|
|
<Facebook className="w-5 h-5 hover:text-gray-500 cursor-pointer" />
|
||
|
|
<Twitter className="w-5 h-5 hover:text-gray-500 cursor-pointer" />
|
||
|
|
<Youtube className="w-5 h-5 hover:text-gray-500 cursor-pointer" />
|
||
|
|
<Music2 className="w-5 h-5 hover:text-gray-500 cursor-pointer" />{" "}
|
||
|
|
{/* untuk TikTok */}
|
||
|
|
</div>
|
||
|
|
<div className="flex items-center gap-4">
|
||
|
|
<div className="flex flex-col">
|
||
|
|
<Image
|
||
|
|
src="/kan.png"
|
||
|
|
alt="KAN Logo"
|
||
|
|
width={280}
|
||
|
|
height={88}
|
||
|
|
className="object-contain"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="flex flex-col gap-2">
|
||
|
|
<Image
|
||
|
|
src="/appstore.png"
|
||
|
|
alt="App Store"
|
||
|
|
width={130}
|
||
|
|
height={40}
|
||
|
|
className="object-contain cursor-pointer"
|
||
|
|
/>
|
||
|
|
<Image
|
||
|
|
src="/google.png"
|
||
|
|
alt="Google Play"
|
||
|
|
width={130}
|
||
|
|
height={40}
|
||
|
|
className="object-contain cursor-pointer"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
);
|
||
|
|
}
|