Merge version_1 into main #2
301
src/app/page.tsx
301
src/app/page.tsx
@@ -32,24 +32,13 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Showcase",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Showcase", id: "products" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="ARCHITECT"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -57,37 +46,14 @@ export default function LandingPage() {
|
||||
<HeroCarouselLogo
|
||||
logoText="Spatial Architect"
|
||||
description="Crafting digital realities at the intersection of light and code. Immersive, fluid, and precise."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Experience",
|
||||
href: "#features",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Start Experience", href: "#features" }]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617263.jpg?_wi=1",
|
||||
imageAlt: "Spatial 1",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/planets-solar-system_23-2150042471.jpg?_wi=1",
|
||||
imageAlt: "Spatial 2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unfocused-cosmos-wallpaper_1017-3788.jpg?_wi=1",
|
||||
imageAlt: "Spatial 3",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-painting-dark_23-2149627882.jpg?_wi=1",
|
||||
imageAlt: "Spatial 4",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/detail-shot-patterned-wall_1359-846.jpg?_wi=1",
|
||||
imageAlt: "Spatial 5",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-background-with-patterned-glass-texture_53876-134132.jpg",
|
||||
imageAlt: "Spatial 6",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617263.jpg", imageAlt: "Spatial 1" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/planets-solar-system_23-2150042471.jpg", imageAlt: "Spatial 2" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/unfocused-cosmos-wallpaper_1017-3788.jpg", imageAlt: "Spatial 3" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-painting-dark_23-2149627882.jpg", imageAlt: "Spatial 4" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/detail-shot-patterned-wall_1359-846.jpg", imageAlt: "Spatial 5" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-background-with-patterned-glass-texture_53876-134132.jpg", imageAlt: "Spatial 6" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -97,21 +63,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Architectural Precision"
|
||||
metrics={[
|
||||
{
|
||||
icon: Zap,
|
||||
label: "Latency",
|
||||
value: "< 10ms",
|
||||
},
|
||||
{
|
||||
icon: Layers,
|
||||
label: "Spatial Layers",
|
||||
value: "12",
|
||||
},
|
||||
{
|
||||
icon: Monitor,
|
||||
label: "Render Depth",
|
||||
value: "64k",
|
||||
},
|
||||
{ icon: Zap, label: "Latency", value: "< 10ms" },
|
||||
{ icon: Layers, label: "Spatial Layers", value: "12" },
|
||||
{ icon: Monitor, label: "Render Depth", value: "64k" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -123,39 +77,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Spatial Tilt",
|
||||
author: "UX Design",
|
||||
description: "Responsive 3D mouse parallax tracking.",
|
||||
tags: [
|
||||
"3D",
|
||||
"UX",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ai-nuclear-energy-industry-innovation-smart-grid-disruptive-technology_53876-143121.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Spring Physics",
|
||||
author: "Interaction",
|
||||
description: "High-stiffness, smooth damping snaps.",
|
||||
tags: [
|
||||
"Motion",
|
||||
"Physics",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-neon-lights-wonder-wheel_23-2148328075.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Z-Index Layering",
|
||||
author: "Geometry",
|
||||
description: "Depth-based physical overlap engine.",
|
||||
tags: [
|
||||
"Spatial",
|
||||
"Layout",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-crystal-clear-water_23-2150786862.jpg",
|
||||
},
|
||||
{ id: "f1", title: "Spatial Tilt", author: "UX Design", description: "Responsive 3D mouse parallax tracking.", tags: ["3D", "UX"], imageSrc: "http://img.b2bpic.net/free-photo/ai-nuclear-energy-industry-innovation-smart-grid-disruptive-technology_53876-143121.jpg" },
|
||||
{ id: "f2", title: "Spring Physics", author: "Interaction", description: "High-stiffness, smooth damping snaps.", tags: ["Motion", "Physics"], imageSrc: "http://img.b2bpic.net/free-photo/abstract-neon-lights-wonder-wheel_23-2148328075.jpg" },
|
||||
{ id: "f3", title: "Z-Index Layering", author: "Geometry", description: "Depth-based physical overlap engine.", tags: ["Spatial", "Layout"], imageSrc: "http://img.b2bpic.net/free-photo/view-3d-crystal-clear-water_23-2150786862.jpg" },
|
||||
]}
|
||||
title="Core Mechanics"
|
||||
description="Engineered for fluidity. High-performance interactions that feel like physical objects in a virtual space."
|
||||
@@ -169,42 +93,12 @@ export default function LandingPage() {
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Midnight Core",
|
||||
price: "Concept",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/rendering-smart-home-device_23-2151039325.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Glass Plane",
|
||||
price: "UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-geometric_1048-13692.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Neural Link",
|
||||
price: "Asset",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lens-flare-effect-abstract-background_1017-15284.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Liquid Wave",
|
||||
price: "Motion",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/geometric-light-podium-3d-background_135149-57.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Crystal Sphere",
|
||||
price: "Render",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-prism-light-concept_23-2148599214.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Dark Matter",
|
||||
price: "Product",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wide-blue-beams-black-laser-beams_169016-71286.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Midnight Core", price: "Concept", imageSrc: "http://img.b2bpic.net/free-photo/rendering-smart-home-device_23-2151039325.jpg" },
|
||||
{ id: "p2", name: "Glass Plane", price: "UI", imageSrc: "http://img.b2bpic.net/free-photo/modern-geometric_1048-13692.jpg" },
|
||||
{ id: "p3", name: "Neural Link", price: "Asset", imageSrc: "http://img.b2bpic.net/free-photo/lens-flare-effect-abstract-background_1017-15284.jpg" },
|
||||
{ id: "p4", name: "Liquid Wave", price: "Motion", imageSrc: "http://img.b2bpic.net/free-photo/geometric-light-podium-3d-background_135149-57.jpg" },
|
||||
{ id: "p5", name: "Crystal Sphere", price: "Render", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-prism-light-concept_23-2148599214.jpg" },
|
||||
{ id: "p6", name: "Dark Matter", price: "Product", imageSrc: "http://img.b2bpic.net/free-photo/wide-blue-beams-black-laser-beams_169016-71286.jpg" },
|
||||
]}
|
||||
title="Project Showcase"
|
||||
description="Selected works of high-fidelity spatial design."
|
||||
@@ -215,15 +109,7 @@ export default function LandingPage() {
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Apple",
|
||||
"Google",
|
||||
"Vercel",
|
||||
"Linear",
|
||||
"Figma",
|
||||
"Stripe",
|
||||
"NextJS",
|
||||
]}
|
||||
names={["Apple", "Google", "Vercel", "Linear", "Figma", "Stripe", "NextJS"]}
|
||||
title="Collaborators"
|
||||
description="Trusted by visionary leaders in technology and design."
|
||||
/>
|
||||
@@ -234,61 +120,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah",
|
||||
date: "Jan 2024",
|
||||
title: "Lead Designer",
|
||||
quote: "The spatial layering feels like magic.",
|
||||
tag: "Design",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/confident-african-american-businessman-black-classic-jacket-thinking-about-business-while-holding-hand-chin-isolated-dark-background_613910-6611.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617263.jpg?_wi=2",
|
||||
imageAlt: "professional portrait dark studio",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark",
|
||||
date: "Feb 2024",
|
||||
title: "Developer",
|
||||
quote: "Smooth 60FPS across all devices.",
|
||||
tag: "Tech",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/silhouette-pensive-businesswoman_1098-652.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/planets-solar-system_23-2150042471.jpg?_wi=2",
|
||||
imageAlt: "professional portrait dark studio",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elena",
|
||||
date: "Mar 2024",
|
||||
title: "Product Lead",
|
||||
quote: "This changed our view on web UX.",
|
||||
tag: "Product",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-dirty-face-homeless-man_23-2148464312.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unfocused-cosmos-wallpaper_1017-3788.jpg?_wi=2",
|
||||
imageAlt: "professional portrait dark studio",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David",
|
||||
date: "Apr 2024",
|
||||
title: "Consultant",
|
||||
quote: "Incredible depth and navigation.",
|
||||
tag: "UX",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-charismatic-sensual-male-black-sweater-creative-personality_613910-11122.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-painting-dark_23-2149627882.jpg?_wi=2",
|
||||
imageAlt: "professional portrait dark studio",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Sofia",
|
||||
date: "May 2024",
|
||||
title: "Founder",
|
||||
quote: "A masterclass in scrollytelling.",
|
||||
tag: "Business",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/executives-ready-meeting_1098-642.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/detail-shot-patterned-wall_1359-846.jpg?_wi=2",
|
||||
imageAlt: "professional portrait dark studio",
|
||||
},
|
||||
{ id: "t1", name: "Sarah", date: "Jan 2024", title: "Lead Designer", quote: "The spatial layering feels like magic.", tag: "Design", avatarSrc: "http://img.b2bpic.net/free-photo/confident-african-american-businessman-black-classic-jacket-thinking-about-business-while-holding-hand-chin-isolated-dark-background_613910-6611.jpg", imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617263.jpg" },
|
||||
{ id: "t2", name: "Mark", date: "Feb 2024", title: "Developer", quote: "Smooth 60FPS across all devices.", tag: "Tech", avatarSrc: "http://img.b2bpic.net/free-photo/silhouette-pensive-businesswoman_1098-652.jpg", imageSrc: "http://img.b2bpic.net/free-photo/planets-solar-system_23-2150042471.jpg" },
|
||||
{ id: "t3", name: "Elena", date: "Mar 2024", title: "Product Lead", quote: "This changed our view on web UX.", tag: "Product", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-dirty-face-homeless-man_23-2148464312.jpg", imageSrc: "http://img.b2bpic.net/free-photo/unfocused-cosmos-wallpaper_1017-3788.jpg" },
|
||||
{ id: "t4", name: "David", date: "Apr 2024", title: "Consultant", quote: "Incredible depth and navigation.", tag: "UX", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-charismatic-sensual-male-black-sweater-creative-personality_613910-11122.jpg", imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-painting-dark_23-2149627882.jpg" },
|
||||
{ id: "t5", name: "Sofia", date: "May 2024", title: "Founder", quote: "A masterclass in scrollytelling.", tag: "Business", avatarSrc: "http://img.b2bpic.net/free-photo/executives-ready-meeting_1098-642.jpg", imageSrc: "http://img.b2bpic.net/free-photo/detail-shot-patterned-wall_1359-846.jpg" },
|
||||
]}
|
||||
title="Designer Reviews"
|
||||
description="What our clients say about the immersive experience."
|
||||
@@ -299,21 +135,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Does this work on mobile?",
|
||||
content: "Yes, our touch-friendly engine scales physics precisely.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Is the performance native?",
|
||||
content: "We utilize hardware acceleration and GPU-optimized rendering.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can you customize the theme?",
|
||||
content: "The architecture supports full color mapping and custom geometry.",
|
||||
},
|
||||
{ id: "q1", title: "Does this work on mobile?", content: "Yes, our touch-friendly engine scales physics precisely." },
|
||||
{ id: "q2", title: "Is the performance native?", content: "We utilize hardware acceleration and GPU-optimized rendering." },
|
||||
{ id: "q3", title: "Can you customize the theme?", content: "The architecture supports full color mapping and custom geometry." },
|
||||
]}
|
||||
sideTitle="Technical Insights"
|
||||
faqsAnimation="slide-up"
|
||||
@@ -326,21 +150,10 @@ export default function LandingPage() {
|
||||
title="Let's Collaborate"
|
||||
description="Ready to build the next generation of spatial web experiences?"
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Your Name" },
|
||||
{ name: "email", type: "email", placeholder: "Email Address" },
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "What are you building?",
|
||||
}}
|
||||
textarea={{ name: "message", placeholder: "What are you building?" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-shapes-reflections-background_1017-2645.jpg"
|
||||
/>
|
||||
</div>
|
||||
@@ -348,45 +161,9 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Hero",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Work",
|
||||
items: [
|
||||
{
|
||||
label: "Projects",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Labs",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Navigation", items: [{ label: "Hero", href: "#" }, { label: "About", href: "#about" }] },
|
||||
{ title: "Work", items: [{ label: "Projects", href: "#products" }, { label: "Labs", href: "#" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] },
|
||||
]}
|
||||
logoText="ARCHITECT"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user