initial commit: rocket.new export of broadcastbeat
This commit is contained in:
Ryan Salazar
163
src/components/Footer.tsx
Normal file
163
src/components/Footer.tsx
Normal file
@@ -0,0 +1,163 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import AppImage from "@/components/ui/AppImage";
|
||||
import {
|
||||
LinkedInIcon,
|
||||
InstagramIcon,
|
||||
TwitterXIcon,
|
||||
FacebookIcon } from
|
||||
"@/components/ui/Icons";
|
||||
|
||||
// DO NOT OVERRIDE — Footer column structure and link targets
|
||||
const footerColumns = [
|
||||
{
|
||||
heading: "About",
|
||||
links: [
|
||||
{ label: "About BroadcastBeat", href: "/about" },
|
||||
{ label: "Our Mission", href: "/about#mission" },
|
||||
{ label: "Editorial Team", href: "/about#team" },
|
||||
{ label: "Advertise With Us", href: "/advertise" },
|
||||
{ label: "Contact Us", href: "/advertise#contact" },
|
||||
{ label: "Newsletter", href: "/home-page#newsletter" }]
|
||||
|
||||
},
|
||||
{
|
||||
heading: "Categories",
|
||||
links: [
|
||||
{ label: "News", href: "/news" },
|
||||
{ label: "Gear & Reviews", href: "/gear" },
|
||||
{ label: "Show Coverage", href: "/show-coverage" },
|
||||
{ label: "Technology", href: "/technology" },
|
||||
{ label: "Live Production", href: "/news?category=live-production" },
|
||||
{ label: "AI & Automation", href: "/technology?category=ai" },
|
||||
{ label: "Streaming", href: "/technology?category=streaming" },
|
||||
{ label: "Audio", href: "/gear?category=audio" }]
|
||||
|
||||
},
|
||||
{
|
||||
heading: "Events",
|
||||
links: [
|
||||
{ label: "NAB Show", href: "/show-coverage" },
|
||||
{ label: "IBC", href: "/show-coverage?event=ibc" },
|
||||
{ label: "Cine Gear", href: "/show-coverage?event=cine-gear" },
|
||||
{ label: "SXSW", href: "/show-coverage?event=sxsw" },
|
||||
{ label: "Streaming Summit", href: "/show-coverage?event=streaming-summit" },
|
||||
{ label: "All Events", href: "/show-coverage" }]
|
||||
|
||||
},
|
||||
{
|
||||
heading: "Follow Us",
|
||||
links: [
|
||||
{ label: "LinkedIn", href: "https://linkedin.com/company/broadcastbeat" },
|
||||
{ label: "Twitter / X", href: "https://twitter.com/broadcastbeat" },
|
||||
{ label: "Facebook", href: "https://facebook.com/broadcastbeat" },
|
||||
{ label: "Instagram", href: "https://instagram.com/broadcastbeat" },
|
||||
{ label: "YouTube", href: "https://youtube.com/@broadcastbeat" },
|
||||
{ label: "RSS Feed", href: "/rss" }]
|
||||
|
||||
}];
|
||||
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<footer className="bg-[#0d0d0d] border-t border-[#222]">
|
||||
{/* Footer Ad Row */}
|
||||
<div className="max-w-container mx-auto px-4 pt-8 pb-4">
|
||||
<div className="flex flex-wrap justify-center gap-4 mb-8">
|
||||
{/* DO NOT OVERRIDE — footer ad placeholder */}
|
||||
<div className="ad-placeholder w-[300px] h-[250px]">
|
||||
<AppImage
|
||||
src="https://img.rocket.new/generatedImages/rocket_gen_img_189430e3f-1768594771653.png"
|
||||
alt="Advertisement — BroadcastBeat sponsor"
|
||||
width={300}
|
||||
height={250}
|
||||
className="w-full h-full object-contain" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Multi-column link section */}
|
||||
<div className="border-t border-[#222] pt-8 pb-6 grid grid-cols-2 md:grid-cols-4 gap-8">
|
||||
{footerColumns?.map((col) =>
|
||||
<div key={col?.heading}>
|
||||
<h4 className="font-body font-bold text-xs text-[#3b82f6] uppercase tracking-widest mb-4 pb-2 border-b border-[#3b82f6]/20">
|
||||
{col?.heading}
|
||||
</h4>
|
||||
<ul className="space-y-2">
|
||||
{col?.links?.map((link) =>
|
||||
<li key={link?.label}>
|
||||
{link?.href?.startsWith("http") ?
|
||||
<a
|
||||
href={link?.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="footer-link font-body text-sm text-[#777777] hover:text-[#3b82f6] transition-colors leading-relaxed inline-block">
|
||||
{link?.label}
|
||||
</a> :
|
||||
|
||||
<Link
|
||||
href={link?.href}
|
||||
className="footer-link font-body text-sm text-[#777777] hover:text-[#3b82f6] transition-colors leading-relaxed inline-block">
|
||||
{link?.label}
|
||||
</Link>
|
||||
}
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Footer Bottom */}
|
||||
{/* DO NOT OVERRIDE — footer bottom bar layout */}
|
||||
<div className="border-t border-[#222] pt-5 pb-3 flex flex-col sm:flex-row items-center justify-between gap-4">
|
||||
<Link href="/home-page">
|
||||
<AppImage
|
||||
src="https://img.rocket.new/generatedImages/rocket_gen_img_171722b35-1771356128623.png"
|
||||
alt="BroadcastBeat — Broadcast Engineering News"
|
||||
width={150}
|
||||
height={20}
|
||||
className="h-5 w-auto object-contain brightness-0 invert opacity-50" />
|
||||
|
||||
</Link>
|
||||
|
||||
<div className="flex items-center gap-4">
|
||||
<a href="https://linkedin.com/company/broadcastbeat" target="_blank" rel="noopener noreferrer" aria-label="BroadcastBeat on LinkedIn"
|
||||
className="text-[#555] hover:text-[#3b82f6] transition-colors social-icon">
|
||||
<LinkedInIcon size={17} />
|
||||
</a>
|
||||
<a href="https://instagram.com/broadcastbeat" target="_blank" rel="noopener noreferrer" aria-label="BroadcastBeat on Instagram"
|
||||
className="text-[#555] hover:text-[#3b82f6] transition-colors social-icon">
|
||||
<InstagramIcon size={17} />
|
||||
</a>
|
||||
<a href="https://twitter.com/broadcastbeat" target="_blank" rel="noopener noreferrer" aria-label="BroadcastBeat on Twitter/X"
|
||||
className="text-[#555] hover:text-[#3b82f6] transition-colors social-icon">
|
||||
<TwitterXIcon size={17} />
|
||||
</a>
|
||||
<a href="https://facebook.com/broadcastbeat" target="_blank" rel="noopener noreferrer" aria-label="BroadcastBeat on Facebook"
|
||||
className="text-[#555] hover:text-[#3b82f6] transition-colors social-icon">
|
||||
<FacebookIcon size={17} />
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4 text-xs font-body text-[#555]">
|
||||
<Link href="/privacy" className="hover:text-[#3b82f6] transition-colors">Privacy Policy</Link>
|
||||
<Link href="/terms" className="hover:text-[#3b82f6] transition-colors">Terms of Service</Link>
|
||||
<span>© 2026 Relevant Media Properties. All rights reserved.</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* NAB Official Media Partner badge area */}
|
||||
{/* DO NOT OVERRIDE — NAB partner badge section */}
|
||||
<div className="border-t border-[#222] pt-4 pb-2 flex justify-center">
|
||||
<div className="flex items-center gap-3 text-[#444] text-xs font-body">
|
||||
<div className="w-8 h-8 bg-[#1a1a1a] border border-[#333] rounded flex items-center justify-center">
|
||||
<span className="text-[#3b82f6] font-bold text-[10px]">NAB</span>
|
||||
</div>
|
||||
<span>Official Media Partner — NAB Show</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>);
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user