// site/page-home.jsx, Home page using H1 "cow as co-star" hero // then the Direction D body sections (real content, cream-dominant). function PageHome({ onNav }) { return (
); } // ─── Hero (H1 cow-as-costar) ─────────────────────────────── function HomeHero({ onNav }) { return (

Where tradition
meets technology.

The nation's only platform built specifically for fairs, bringing websites, marketing, operations, and ticketing together in one seamless platform.

onNav('contact')}>Book a demo onNav('platform')}>Learn more →
{[['180+', 'fairs'], ['48 hrs', 'to selling tickets'], ['28%', 'pre-sale lift']].map(([n, l], i) => (
{n}
{l}
))}
{/* Right: real-photo collage with cow sticker */}
{/* Big midway photo (the brand's marquee hero shot) */}
Vol. IV · 2026
{/* Small framed photo: tractor pull (top-left, tilted out) */}
Tractor pull · '24
{/* Cow + Fairs.com logo lockup (replaces the old Booth B-14 stamp) */}
Fairs.com
{/* (Standalone cow removed per design note) */}
); } // ─── Stats strip (180+ / 48 hrs / 28%) — ink-on-cream for contrast ── function HomeStatsStrip() { return (
{/* Faint red accent decoration */}
★ By the numbers · 2026 ★
{REAL_STATS.map((s, i) => (
{s.num}
{s.label}
{s.sub &&
{s.sub}
}
))}
); } // ─── Mission (Educate · Celebrate · Enable) with cow ─────── function HomeMission() { return (
We're built for fairs like yours!
Our mission

Fairs are more than events.
They are where community happens.

We help fairs of all sizes grow by pairing the traditions they're built on with the latest tools and technology, preserving what makes each fair special while preparing it to thrive for generations to come.

{REAL_PILLARS.map((p, i) => { const tilts = [-0.6, 0.4, -0.4]; return (
★ {p.label}

{p.title}

{p.blurb}

); })}
); } // ─── Modules / Platform tabs ─────────────────────────────── function HomeModules({ onNav }) { const [active, setActive] = React.useState(REAL_MODULES[0].id); const m = REAL_MODULES.find(x => x.id === active); const subRoute = { websites: 'websites', tickets: 'ticketing', reach: 'social', grow: 'marketing' }; return (
Our platform

One unified system
to manage your fair.

Your fair runs on dozens of moving parts. Fairs.com brings them together in one integrated platform, websites, ticketing, social, marketing, vendors, and sponsors.

{REAL_MODULES.map((mod, i) => { const a = mod.id === active; return ( ); })}
{m.kicker} · Module №{String(REAL_MODULES.findIndex(x => x.id === active) + 1).padStart(2, '0')} of {REAL_MODULES.length}

{m.blurb}

{m.detail}

{m.bullets.map((b, i) => (
{b}
))}
onNav(subRoute[m.id] || 'platform')}> Learn more about {m.label.toLowerCase()}
); } // Product UI showcase, one big screenshot per module function ModulePreview({ module: m }) { const PRODUCT_UI = { websites: { src: 'assets/ui-websites.avif', alt: 'Fairs.com Websites: drag-and-drop builder, schedule, vendors, and live site preview' }, tickets: { src: PHOTOS.uiTickets, alt: 'Fairs.com Ticketing: event setup, attendee reports, mobile pass with Apple and Google Wallet, and revenue analytics' }, reach: { src: PHOTOS.uiSocial, alt: 'Fairs.com Social: SMS channel setup, broadcast composer, and unified message scheduling' }, grow: { src: PHOTOS.uiMarketing, alt: 'Fairs.com Marketing: email and SMS campaigns, audience segmentation, and per-send revenue reporting' }, vendors: { src: 'assets/product/vendor-applications.png', alt: 'Fairs.com Vendor Management: applications pipeline, booth map, and invoicing' }, sponsors: { src: 'assets/product/sponsor-tiers.png', alt: 'Fairs.com Sponsor Management: custom tiers, deal pipeline, and ticket allocation' }, }; const ui = PRODUCT_UI[m.id] || PRODUCT_UI.tickets; return (
{/* Soft red offset shadow (under the frame) */}
{/* Faint grain wash behind */}
{/* Frame */}
{/* Top chrome strip */}
app.fairs.com / {m.label.toLowerCase().replace(/\s+/g, '-')}
★ Live UI
{/* Product screenshot */}
{ui.alt} {/* Subtle inner highlight along the top edge */}
{/* Caption strip below the screenshot */}
{m.label} · {m.kicker.toLowerCase()}
Product UI · 2026
); } // ─── Before/After Transform ───────────────────────────────── function HomeTransform() { return (
Transformation

{REAL_TRANSFORM.title}

{REAL_TRANSFORM.blurb}

Before

Complex chaos

{REAL_TRANSFORM.before.map((b, i) => (
{b}
))}
★ Fairs.com
With Fairs.com

Streamlined success

{REAL_TRANSFORM.after.map((b, i) => (
{b}
))}
); } // ─── Compare vs Saffire + eTix ───────────────────────────── function HomeCompare({ onNav }) { const checkCell = (val, isFairs) => { if (typeof val === 'string') { return ( {val} ); } if (val === true) { return (
); } return (
); }; return (
Built · How we stack up

See what sets the fair-first
platform apart.

{/* Header: Company Information + 3 brand columns */}
Company Information
{REAL_COMPARE.cols.map((c, i) => (
{c.name === 'Fairs.com' ? ( Fairs.com ) : (
{c.name === 'eTix' ? <>etix : c.name}
)}
))}
{/* Meta rows: Year, Focus */} {REAL_COMPARE.meta.map((row, ri) => (
{row[0]}
{row.slice(1).map((v, ci) => (
{v}
))}
))} {/* Features section divider */}
Features
{/* Feature rows */} {REAL_COMPARE.features.map((row, ri) => (
{row[0]}
{row.slice(1).map((v, ci) => (
{checkCell(v, ci === 0)}
))}
))}
onNav('contact')}>Book a demo onNav('platform')}>Learn more →
); } // ─── Logo scroll (real customer fair logos, from fairs.com) ── // White backgrounds are pre-removed from the PNGs so logos sit // directly on the cream section background at full size. const CUSTOMER_LOGOS = Array.from({ length: 53 }, (_, i) => 'assets/customer-logos/fair-logo-' + String(i + 1).padStart(2, '0') + '.png'); function HomeLogoWall() { // One full set of logos; rendered twice so the CSS loop is seamless. const Row = ({ hidden }) => (
{CUSTOMER_LOGOS.map((src, i) => ( {hidden ))}
); return (
Our progress

Trusted by 180+ fairs across North America.

Over 180 fairs have joined our mission since our launch in 2023.

{/* Scrolling logo strip; pauses on hover */}
); } // ─── Instagram feed (Elfsight) ───────────────────────────── // Same widget the live fairs.com home uses, embedded via Elfsight's // platform script. The widget div is hydrated client-side once the // platform.js script loads. function HomeInstagram() { React.useEffect(() => { const id = 'elfsight-platform-js'; if (document.getElementById(id)) return; const s = document.createElement('script'); s.id = id; s.src = 'https://elfsightcdn.com/platform.js'; s.async = true; document.body.appendChild(s); }, []); return (
{/* ambient red glow */}
Our impact

Connect with us on socials.

The fundamentals of modern ticketing and marketing, fair industry updates, and wins worth celebrating with our partner fairs — that's what we share.

{/* Elfsight Instagram Feed | Fairs Insta Feed */}
); } // ─── Testimonials (real, carousel) ───────────────────────── function HomeTestimonials() { const [i, setI] = useCarousel(REAL_TESTIMONIALS.length, 7000); const t = REAL_TESTIMONIALS[i]; return (
What fair managers say
{Array.from({ length: t.stars }).map((_, k) => ★)}
"{t.quote}"
{t.name.split(' ').map(w => w[0]).join('')}
{t.name}
{t.role} · {t.fair}
{REAL_TESTIMONIALS.map((_, k) => (
); } // ─── Cow CTA with big ticket — ink background, big red ticket pops ── function HomeCowCTA({ onNav }) { return (

See it run before your next event.

A 30-minute consultation with a Fairs.com expert.

See why so many fairs swear by it!
onNav('contact')}>
); } function BigDemoTicket() { const w = 720, h = 200; return ( ADMIT ONE · DEMO Book a demo → 30-minute consultation with a Fairs.com expert ★ DEMO PASS ); } Object.assign(window, { PageHome });