mirror of
https://github.com/zoo-apps/industries.git
synced 2026-11-03 14:57:13 +00:00
zooqueenandHanzo Dev
19905ecd56
Adds three home compositions sharing the same investor narrative: - / (canonical) — restored old composition with Hero + zoo composite, Ecosystem, ZooLabsNarrative, ServicesOverview, ResearchHighlights, Leadership, TrustedBy, Contact. Adds polished motion (Reveal, Parallax wrappers, scroll-linked Hero drift), softer brutalist reset (rounded utilities now opt-in), and a Zen5 rainbow-gradient top banner. - /homepage1 — backup of the previous / composition (noindex). - /homepage2 — 10-slide deck with snap-mandatory CSS scroll snap, side-rail slide indicator, alternating brand-color slide washes, CSS-3D AI-coin scene behind the Hero (Zen5 family + Cloud / Network spokes, perspective + per-coin float keyframes, light blur), network-mesh edges, Foundation + Leadership + Traction + Access slides, plus the AI-native market-cap composite with NVIDIA as public-market comparable. - /homepage3 — editorial 'Quarterly' variant with serif display, masthead, drop cap, ornamental dividers, chapter framing, and a colophon footer. Wax-seal red accent on a cream paper surface. Other changes: - Navbar: drop rounded floating pill in favour of sharp transparent bar with a sharp backdrop-blur strip + border-b-2 black on scroll. - TopBanner: animated rainbow gradient background (300% width, background-position keyframe, prefers-reduced-motion aware). - Leadership / TeamMemberCard: rounded-full avatars (override the brutalist global border-radius reset via data-circle). - Ecosystem strip: render JPGs at /public/ecosystem/*.jpg with emoji fallback only when an image is missing (bear, drought, lake, eagle, forest, whale). - TheStack: each layer card is now a click target to its live domain (zenlm.org, zoo.cloud, zoo.network, zoo.fund, zoo.vote). - public/: new /hero/zooimg.png, /ecosystem/*.jpg, /pe/*.png. - Reveal / Parallax / ParallaxDivider / ParallaxBackground / CoinScene / SlideIndicator / SlideParallax / NetworkAnimation primitives under components/. Co-authored-by: Hanzo Dev <[email protected]>
62 lines
2.1 KiB
TypeScript
62 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import Hero2 from "@/components/homepage2/Hero2";
|
|
import OpportunitySnapshot from "@/components/homepage2/OpportunitySnapshot";
|
|
import PathToValue from "@/components/homepage2/PathToValue";
|
|
import WhyNow from "@/components/homepage2/WhyNow";
|
|
import AINativeCompanies from "@/components/homepage2/AINativeCompanies";
|
|
import TheStack from "@/components/homepage2/TheStack";
|
|
import Foundation from "@/components/homepage2/Foundation";
|
|
import LeadershipSlide from "@/components/homepage2/LeadershipSlide";
|
|
import TeamTraction from "@/components/homepage2/TeamTraction";
|
|
import AccessProtocol from "@/components/homepage2/AccessProtocol";
|
|
import { SlideIndicator } from "@/components/homepage2/SlideIndicator";
|
|
|
|
/**
|
|
* Canonical home — the slide-deck investor narrative.
|
|
*
|
|
* Scroll-snap is pinned onto ``document.documentElement`` while this
|
|
* route is mounted (the body / html is the actual scroll container,
|
|
* not ``<main>``). ``scroll-snap-type: y mandatory`` makes every stop
|
|
* land on a slide boundary. We don't set ``scroll-snap-stop: always``
|
|
* so a quick flick can still skip past slides — the snap is a guide,
|
|
* not a jail.
|
|
*/
|
|
export default function PageClient() {
|
|
useEffect(() => {
|
|
const root = document.documentElement;
|
|
const prev = {
|
|
scrollSnapType: root.style.scrollSnapType,
|
|
scrollPaddingTop: root.style.scrollPaddingTop,
|
|
scrollBehavior: root.style.scrollBehavior,
|
|
};
|
|
root.style.scrollSnapType = "y mandatory";
|
|
root.style.scrollPaddingTop = "5rem";
|
|
root.style.scrollBehavior = "smooth";
|
|
return () => {
|
|
root.style.scrollSnapType = prev.scrollSnapType;
|
|
root.style.scrollPaddingTop = prev.scrollPaddingTop;
|
|
root.style.scrollBehavior = prev.scrollBehavior;
|
|
};
|
|
}, []);
|
|
|
|
return (
|
|
<>
|
|
<SlideIndicator />
|
|
<main className="scroll-smooth">
|
|
<Hero2 />
|
|
<OpportunitySnapshot />
|
|
<PathToValue />
|
|
<WhyNow />
|
|
<AINativeCompanies />
|
|
<TheStack />
|
|
<Foundation />
|
|
<LeadershipSlide />
|
|
<TeamTraction />
|
|
<AccessProtocol />
|
|
</main>
|
|
</>
|
|
);
|
|
}
|