feat: Add marketing and use case pages, their data structures, and supporting UI components.

This commit is contained in:
Timo Knuth
2026-03-09 12:47:52 +01:00
parent f5f3979996
commit 3c8e6bd19f
22 changed files with 4047 additions and 184 deletions

View File

@@ -71,14 +71,16 @@ const FlippingCard = ({ front, back, delay }: { front: any, back: any, delay: nu
);
};
interface HeroProps {
t: any; // i18n translation function
}
export const Hero: React.FC<HeroProps> = ({ t }) => {
const containerjs = {
interface HeroProps {
t: any; // i18n translation function
headingAs?: 'h1' | 'div';
}
export const Hero: React.FC<HeroProps> = ({ t, headingAs = 'h1' }) => {
const HeadingTag = headingAs;
const containerjs = {
hidden: { opacity: 0 },
show: {
opacity: 1,
@@ -124,12 +126,12 @@ export const Hero: React.FC<HeroProps> = ({ t }) => {
transition={{ duration: 0.5 }}
className="space-y-6"
>
<h1 className="text-5xl lg:text-6xl font-bold text-gray-900 leading-tight">
{t.hero.title}
</h1>
<p className="text-xl text-gray-600 leading-relaxed max-w-2xl">
{t.hero.subtitle}
<HeadingTag className="text-5xl lg:text-6xl font-bold text-gray-900 leading-tight">
{t.hero.title}
</HeadingTag>
<p className="text-xl text-gray-600 leading-relaxed max-w-2xl">
{t.hero.subtitle}
</p>
<div className="space-y-3 pt-2">
@@ -207,4 +209,4 @@ export const Hero: React.FC<HeroProps> = ({ t }) => {
<div className="absolute bottom-0 left-0 w-full h-32 bg-gradient-to-b from-transparent to-gray-50 pointer-events-none" />
</section >
);
};
};

View File

@@ -48,7 +48,7 @@ export function Footer({ variant = 'marketing', t }: FooterProps) {
<li><Link href="/testimonials" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Testimonials</Link></li>
<li><Link href="/authors/timo" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Timo Knuth (Author)</Link></li>
<li><Link href="/#pricing" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>{translations.pricing}</Link></li>
<li><Link href="/qr-code-tracking" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>QR Analytics</Link></li>
<li><Link href="/qr-code-analytics" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>QR Analytics</Link></li>
<li><Link href="/use-cases" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Use Cases</Link></li>
<li><Link href="/faq" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>{translations.faq}</Link></li>
<li><Link href="/blog" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>{translations.blog}</Link></li>
@@ -66,7 +66,7 @@ export function Footer({ variant = 'marketing', t }: FooterProps) {
<li><Link href="/signup" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>{translations.get_started}</Link></li>
<li><Link href="/reprint-calculator" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Reprint Cost Calculator</Link></li>
<li><Link href="/qr-code-tracking" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Our Analytics</Link></li>
<li><Link href="/qr-code-analytics" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Our Analytics</Link></li>
<li><Link href="/manage-qr-codes" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Manage QR Codes</Link></li>
<li><Link href="/custom-qr-code-generator" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Custom QR</Link></li>
<li><Link href="/qr-code-for-marketing-campaigns" className={isDashboard ? 'hover:text-primary-600' : 'hover:text-white'}>Campaign QR Codes</Link></li>