mirror of
https://github.com/hanzo-templates/gallery.git
synced 2026-10-30 20:00:04 +00:00
zeekay
93fa819e25
- Rewrite globals.css with oklch color system matching hanzo.ai - Add Hanzo brand colors (#fd4444 primary, #e03e3e hover, #ff6b6b secondary) - Replace purple gradients with monochrome + red brand accents - Update header with neutral nav links and red CTA button - Update footer with monochrome styling and social icons - Redesign page.tsx with neutral-900/50 cards, neutral-800 borders - Add text-gradient, hero-glow, glass-panel utilities - Use golden ratio typography system
136 lines
5.4 KiB
TypeScript
136 lines
5.4 KiB
TypeScript
import Link from 'next/link';
|
|
import { HanzoLogo } from '@hanzo/logo/react';
|
|
|
|
export function Footer() {
|
|
return (
|
|
<footer className="py-16 px-4 bg-[#0a0a0a] border-t border-neutral-800">
|
|
<div className="max-w-7xl mx-auto">
|
|
<div className="grid grid-cols-1 md:grid-cols-5 gap-12 mb-12">
|
|
{/* Brand */}
|
|
<div className="md:col-span-2">
|
|
<div className="flex items-center gap-3 mb-4">
|
|
<HanzoLogo variant="white" size={28} />
|
|
<span className="text-lg font-medium text-white tracking-tight">
|
|
Templates
|
|
</span>
|
|
</div>
|
|
<p className="text-neutral-500 text-sm leading-relaxed max-w-xs">
|
|
Premium UI/UX templates for modern web applications. Built with Next.js, React, and TypeScript.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Product */}
|
|
<div>
|
|
<h4 className="text-sm font-medium text-white mb-4">Product</h4>
|
|
<ul className="space-y-3 text-neutral-500 text-sm">
|
|
<li>
|
|
<Link href="/gallery" className="hover:text-white transition-colors">
|
|
Templates
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/docs" className="hover:text-white transition-colors">
|
|
Documentation
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/pricing" className="hover:text-white transition-colors">
|
|
Pricing
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Company */}
|
|
<div>
|
|
<h4 className="text-sm font-medium text-white mb-4">Company</h4>
|
|
<ul className="space-y-3 text-neutral-500 text-sm">
|
|
<li>
|
|
<a
|
|
href="https://hanzo.ai"
|
|
className="hover:text-white transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Hanzo AI
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="https://github.com/hanzo-apps"
|
|
className="hover:text-white transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
GitHub
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="https://hanzo.ai/careers"
|
|
className="hover:text-white transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Careers
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Legal */}
|
|
<div>
|
|
<h4 className="text-sm font-medium text-white mb-4">Legal</h4>
|
|
<ul className="space-y-3 text-neutral-500 text-sm">
|
|
<li>
|
|
<Link href="/terms" className="hover:text-white transition-colors">
|
|
Terms
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/privacy" className="hover:text-white transition-colors">
|
|
Privacy
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/license" className="hover:text-white transition-colors">
|
|
License
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Bottom bar */}
|
|
<div className="flex flex-col md:flex-row items-center justify-between pt-8 border-t border-neutral-800 gap-4">
|
|
<p className="text-neutral-600 text-sm">
|
|
© 2016-2026 Hanzo AI Inc. All rights reserved.
|
|
</p>
|
|
<div className="flex items-center gap-4">
|
|
<a
|
|
href="https://x.com/hanzoai"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-neutral-600 hover:text-white transition-colors"
|
|
>
|
|
<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
|
|
</svg>
|
|
</a>
|
|
<a
|
|
href="https://github.com/hanzo-apps"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-neutral-600 hover:text-white transition-colors"
|
|
>
|
|
<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path fillRule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clipRule="evenodd" />
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|