Merge version_1 into main #2
232
src/app/page.tsx
232
src/app/page.tsx
@@ -28,128 +28,45 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Origin",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Abilities",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Legacy",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Origin", id: "about" },
|
||||
{ name: "Abilities", id: "features" },
|
||||
{ name: "Legacy", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="SpideyWeb"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
title="The Friendly Neighborhood Legend"
|
||||
description="Witness the transformation of an ordinary teenager into an iconic wall-crawling guardian. A story of responsibility, sacrifice, and the enduring power of hope."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Daily Bugle",
|
||||
handle: "@BugleDaily",
|
||||
testimonial: "The definitive hero of our city.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151446006.jpg?_wi=1",
|
||||
imageAlt: "cinematic superhero swinging 3d render",
|
||||
},
|
||||
{
|
||||
name: "City Police",
|
||||
handle: "@NYPD_Official",
|
||||
testimonial: "Often a nuisance, but saves more lives than anyone.",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-key-portrait-modern-business-person_158595-4814.jpg",
|
||||
imageAlt: "cinematic superhero swinging 3d render",
|
||||
},
|
||||
{
|
||||
name: "Local Citizen",
|
||||
handle: "@QueensResident",
|
||||
testimonial: "He's just a kid, but he's our hero.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/superhero-flying_1368-8285.jpg",
|
||||
imageAlt: "cinematic superhero swinging 3d render",
|
||||
},
|
||||
{
|
||||
name: "The Vigilante",
|
||||
handle: "@NightWatch",
|
||||
testimonial: "A silent guardian in the darkness.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/terrifying-texture-cobweb_23-2151841020.jpg?_wi=1",
|
||||
imageAlt: "cinematic superhero swinging 3d render",
|
||||
},
|
||||
{
|
||||
name: "Scientist",
|
||||
handle: "@LabNotes",
|
||||
testimonial: "Remarkable physical capabilities.",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-colorful-thermal-scan-with-celsius-degree-temperature_23-2149170120.jpg",
|
||||
imageAlt: "cinematic superhero swinging 3d render",
|
||||
},
|
||||
{ name: "Daily Bugle", handle: "@BugleDaily", testimonial: "The definitive hero of our city.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151446006.jpg", imageAlt: "cinematic superhero swinging 3d render" },
|
||||
{ name: "City Police", handle: "@NYPD_Official", testimonial: "Often a nuisance, but saves more lives than anyone.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/low-key-portrait-modern-business-person_158595-4814.jpg", imageAlt: "cinematic superhero swinging 3d render" },
|
||||
{ name: "Local Citizen", handle: "@QueensResident", testimonial: "He's just a kid, but he's our hero.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/superhero-flying_1368-8285.jpg", imageAlt: "cinematic superhero swinging 3d render" },
|
||||
{ name: "The Vigilante", handle: "@NightWatch", testimonial: "A silent guardian in the darkness.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/terrifying-texture-cobweb_23-2151841020.jpg", imageAlt: "cinematic superhero swinging 3d render" },
|
||||
{ name: "Scientist", handle: "@LabNotes", testimonial: "Remarkable physical capabilities.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/people-colorful-thermal-scan-with-celsius-degree-temperature_23-2149170120.jpg", imageAlt: "cinematic superhero swinging 3d render" }
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Begin Story",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151446006.jpg?_wi=2"
|
||||
buttons={[{ text: "Begin Story", href: "#about" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151446006.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/multi-dimensional-urban-space-exotic-concepts-digital-painting_456031-82.jpg",
|
||||
alt: "Multi-dimensional urban space",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cyberpunk-warrior-looking-city_23-2150712400.jpg",
|
||||
alt: "Cyberpunk warrior",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beautiful-shot-tall-city-buildings-cloudy-sky-night_181624-44596.jpg",
|
||||
alt: "City buildings night",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cyberpunk-man-warrior-urban-scenery_23-2150712300.jpg",
|
||||
alt: "Cyberpunk man warrior",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-studio_23-2149486814.jpg",
|
||||
alt: "Medium shot man",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/multi-dimensional-urban-space-exotic-concepts-digital-painting_456031-82.jpg", alt: "Multi-dimensional urban space" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/cyberpunk-warrior-looking-city_23-2150712400.jpg", alt: "Cyberpunk warrior" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-shot-tall-city-buildings-cloudy-sky-night_181624-44596.jpg", alt: "City buildings night" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/cyberpunk-man-warrior-urban-scenery_23-2150712300.jpg", alt: "Cyberpunk man warrior" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-studio_23-2149486814.jpg", alt: "Medium shot man" }
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Friendly Neighborhood",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Web-Slinger",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Justice",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Guardian",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hero",
|
||||
},
|
||||
{ type: "text", text: "Friendly Neighborhood" },
|
||||
{ type: "text", text: "Web-Slinger" },
|
||||
{ type: "text", text: "Justice" },
|
||||
{ type: "text", text: "Guardian" },
|
||||
{ type: "text", text: "Hero" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -158,12 +75,7 @@ export default function LandingPage() {
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="A Burden of Power"
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#features",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Learn More", href: "#features" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -173,23 +85,11 @@ export default function LandingPage() {
|
||||
title="Beyond the Mask"
|
||||
description="Discover the unique abilities that define the web-slinger."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Superhuman Agility",
|
||||
content: "Mastery over reflexes and movement allows for unparalleled maneuverability in dense urban environments.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Web-Spinning Technology",
|
||||
content: "Synthetic webbing providing incredible tensile strength and diverse tactical applications.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Spider-Sense",
|
||||
content: "An advanced precognitive danger sense, alerting to threats before they manifest physically.",
|
||||
},
|
||||
{ id: "f1", title: "Superhuman Agility", content: "Mastery over reflexes and movement allows for unparalleled maneuverability in dense urban environments." },
|
||||
{ id: "f2", title: "Web-Spinning Technology", content: "Synthetic webbing providing incredible tensile strength and diverse tactical applications." },
|
||||
{ id: "f3", title: "Spider-Sense", content: "An advanced precognitive danger sense, alerting to threats before they manifest physically." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/terrifying-texture-cobweb_23-2151841020.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/terrifying-texture-cobweb_23-2151841020.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
@@ -200,41 +100,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
handle: "@s_j",
|
||||
testimonial: "He saved my apartment building last summer. Forever grateful.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-couple-medieval-times_23-2150931901.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Marcus L.",
|
||||
handle: "@m_l",
|
||||
testimonial: "The way he swings through the city is pure artistry.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/urban-portrait-young-man-with-long-hair_23-2149122919.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena R.",
|
||||
handle: "@e_r",
|
||||
testimonial: "I never felt safe until he showed up in Queens.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-ceiling-underground-parking_23-2147771345.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
handle: "@d_k",
|
||||
testimonial: "He's an inspiration to every young kid in the city.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/senior-woman-superhero-wearing-red-cape-holding-glasses-looking-it-with-serious-face-standing-orange-background_141793-117268.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Maya W.",
|
||||
handle: "@m_w",
|
||||
testimonial: "Watching him fight for us gives me hope every single day.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-curly-man-with-guitar-dark-photo-studio_613910-1766.jpg",
|
||||
},
|
||||
{ id: "1", name: "Sarah J.", handle: "@s_j", testimonial: "He saved my apartment building last summer. Forever grateful.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-couple-medieval-times_23-2150931901.jpg" },
|
||||
{ id: "2", name: "Marcus L.", handle: "@m_l", testimonial: "The way he swings through the city is pure artistry.", imageSrc: "http://img.b2bpic.net/free-photo/urban-portrait-young-man-with-long-hair_23-2149122919.jpg" },
|
||||
{ id: "3", name: "Elena R.", handle: "@e_r", testimonial: "I never felt safe until he showed up in Queens.", imageSrc: "http://img.b2bpic.net/free-photo/woman-looking-ceiling-underground-parking_23-2147771345.jpg" },
|
||||
{ id: "4", name: "David K.", handle: "@d_k", testimonial: "He's an inspiration to every young kid in the city.", imageSrc: "http://img.b2bpic.net/free-photo/senior-woman-superhero-wearing-red-cape-holding-glasses-looking-it-with-serious-face-standing-orange-background_141793-117268.jpg" },
|
||||
{ id: "5", name: "Maya W.", handle: "@m_w", testimonial: "Watching him fight for us gives me hope every single day.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-curly-man-with-guitar-dark-photo-studio_613910-1766.jpg" }
|
||||
]}
|
||||
title="Voices of the City"
|
||||
description="The impact of the hero felt across five boroughs."
|
||||
@@ -244,9 +114,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "rotated-rays-animated",
|
||||
}}
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
tag="City Alert System"
|
||||
title="Join the Watch"
|
||||
description="Receive updates on city threats and safety initiatives."
|
||||
@@ -259,31 +127,17 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Universe",
|
||||
items: [
|
||||
{
|
||||
label: "Origin Story",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Abilities",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
title: "Universe", items: [
|
||||
{ label: "Origin Story", href: "#about" },
|
||||
{ label: "Abilities", href: "#features" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Use",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Use", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
bottomLeftText="© 2024 SpideyWeb Records"
|
||||
bottomRightText="Built for the fans"
|
||||
|
||||
Reference in New Issue
Block a user