bender/f5647f38-e561-4ec2-8f9c-18cfd0d1a95b
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #4.
This commit is contained in:
bender
2026-05-12 18:58:17 +00:00
parent 5a1655acff 074c3bfda3
commit e5f4b559fb
5 changed files with 165 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,61 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Cpu } from "lucide-react";
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="none"
cardStyle="gradient-radial"
primaryButtonStyle="double-inset"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
brandName="PROTO-TRANSIT"
/>
</div>
<div id="about" data-section="about">
<AboutMetric
title="Designer Bio & Background"
metrics={[
{ icon: Cpu, label: "Design Experience", value: "10+ Years" },
{ icon: Cpu, label: "Concept Renders", value: "500+" },
{ icon: Cpu, label: "Industry Projects", value: "25+" }
]}
useInvertedBackground={true}
className="py-20"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Contact", items: [{ label: "Email", href: "mailto:info@proto.design" }] }
]}
logoText="PROTO-TRANSIT"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

60
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,60 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="none"
cardStyle="gradient-radial"
primaryButtonStyle="double-inset"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
brandName="PROTO-TRANSIT"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get in Touch"
description="Ready to build the future? Send us your project details."
inputs={[
{ name: "name", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true }
]}
textarea={{ name: "message", placeholder: "Your project ideas...", rows: 5 }}
useInvertedBackground={true}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Contact", items: [{ label: "Email", href: "mailto:info@proto.design" }] }
]}
logoText="PROTO-TRANSIT"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

137
src/app/page.tsx
View File

@@ -30,12 +30,9 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "About", id: "about"},
{
name: "Portfolio", id: "portfolio"},
{
name: "Contact", id: "contact"},
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
brandName="PROTO-TRANSIT"
/>
@@ -43,22 +40,17 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroSplitDualMedia
background={{
variant: "gradient-bars"}}
background={{ variant: "gradient-bars" }}
title="Redefining Motion Architecture."
description="Crafting the next generation of transportation with computational design and cinematic precision."
tag="Transport Conceptualization"
buttons={[
{
text: "View Portfolio", href: "#portfolio"},
{
text: "Contact", href: "#contact"},
{ text: "View Portfolio", href: "#portfolio" },
{ text: "Contact", href: "/contact" },
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001289.jpg?_wi=1", imageAlt: "futuristic concept car dark studio"},
{
imageSrc: "http://img.b2bpic.net/free-photo/batmobile-concept-car-with-neon-lights_23-2151649843.jpg?_wi=1", imageAlt: "futuristic vehicle concept dark studio"}
{ imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001289.jpg?_wi=1", imageAlt: "futuristic concept car dark studio" },
{ imageSrc: "http://img.b2bpic.net/free-photo/batmobile-concept-car-with-neon-lights_23-2151649843.jpg?_wi=1", imageAlt: "futuristic vehicle concept dark studio" }
]}
mediaAnimation="slide-up"
rating={5}
@@ -74,6 +66,7 @@ export default function LandingPage() {
tag="Design Vision"
imageSrc="http://img.b2bpic.net/free-photo/monitors-photovoltaics-factory-used-manage-performance-robot-arms_482257-125090.jpg?_wi=1"
imageAlt="transportation designer working at desk"
buttons={[{ text: "Read More", href: "/about" }]}
/>
</div>
@@ -83,16 +76,11 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={false}
features={[
{
id: "f1", title: "Concept Sketches", description: "Rapid ideation using digital and analog techniques.", tag: "Process", imageSrc: "http://img.b2bpic.net/free-photo/off-road-car-wilderness_23-2151483065.jpg", imageAlt: "Off-road car in the wilderness"},
{
id: "f2", title: "3D Modeling", description: "High-fidelity surfacing for manufacturing-ready prototypes.", tag: "Precision", imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001289.jpg?_wi=2", imageAlt: "Off-road car in the wilderness"},
{
id: "f3", title: "Cinematic Renders", description: "Storytelling through lighting, texture, and environment.", tag: "Vision", imageSrc: "http://img.b2bpic.net/free-photo/batmobile-concept-car-with-neon-lights_23-2151649843.jpg?_wi=2", imageAlt: "Off-road car in the wilderness"},
{
id: "f4", title: "Aerodynamic Optimization", description: "Wind tunnel simulation for peak efficiency.", tag: "Aerodynamics", imageSrc: "http://img.b2bpic.net/free-photo/monitors-photovoltaics-factory-used-manage-performance-robot-arms_482257-125090.jpg?_wi=2", imageAlt: "Off-road car in the wilderness"},
{
id: "f5", title: "Material Innovation", description: "Exploring sustainable carbon-neutral composites.", tag: "Sustainability", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065392.jpg?_wi=1", imageAlt: "Off-road car in the wilderness"},
{ id: "f1", title: "Concept Sketches", description: "Rapid ideation using digital and analog techniques.", tag: "Process", imageSrc: "http://img.b2bpic.net/free-photo/off-road-car-wilderness_23-2151483065.jpg", imageAlt: "Off-road car in the wilderness" },
{ id: "f2", title: "3D Modeling", description: "High-fidelity surfacing for manufacturing-ready prototypes.", tag: "Precision", imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001289.jpg?_wi=2", imageAlt: "Off-road car in the wilderness" },
{ id: "f3", title: "Cinematic Renders", description: "Storytelling through lighting, texture, and environment.", tag: "Vision", imageSrc: "http://img.b2bpic.net/free-photo/batmobile-concept-car-with-neon-lights_23-2151649843.jpg?_wi=2", imageAlt: "Off-road car in the wilderness" },
{ id: "f4", title: "Aerodynamic Optimization", description: "Wind tunnel simulation for peak efficiency.", tag: "Aerodynamics", imageSrc: "http://img.b2bpic.net/free-photo/monitors-photovoltaics-factory-used-manage-performance-robot-arms_482257-125090.jpg?_wi=2", imageAlt: "Off-road car in the wilderness" },
{ id: "f5", title: "Material Innovation", description: "Exploring sustainable carbon-neutral composites.", tag: "Sustainability", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065392.jpg?_wi=1", imageAlt: "Off-road car in the wilderness" },
]}
title="Design Capabilities"
description="Comprehensive design services for future-facing mobility."
@@ -106,18 +94,12 @@ export default function LandingPage() {
gridVariant="bento-grid"
useInvertedBackground={true}
products={[
{
id: "p1", name: "Autonomous Pod", price: "2024", variant: "Mobility", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065392.jpg?_wi=2"},
{
id: "p2", name: "Hyperloop Aero", price: "2024", variant: "Transport", imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212578.jpg"},
{
id: "p3", name: "Velocity Racer", price: "2023", variant: "Race", imageSrc: "http://img.b2bpic.net/free-photo/sunset-race_23-2151952483.jpg"},
{
id: "p4", name: "Red Shift Moto", price: "2023", variant: "Motorcycle", imageSrc: "http://img.b2bpic.net/free-vector/dark-black-wallpaper-with-abstract-shiny-metallic-design_1017-59672.jpg"},
{
id: "p5", name: "Urban Glide", price: "2022", variant: "Urban", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-time-machines-design_23-2151599322.jpg"},
{
id: "p6", name: "V-Plane Concept", price: "2022", variant: "Aviation", imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-looking-spaceship_23-2150675505.jpg"},
{ id: "p1", name: "Autonomous Pod", price: "2024", variant: "Mobility", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-mean-transportation-ultra-modern-city_23-2151065392.jpg?_wi=2" },
{ id: "p2", name: "Hyperloop Aero", price: "2024", variant: "Transport", imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212578.jpg" },
{ id: "p3", name: "Velocity Racer", price: "2023", variant: "Race", imageSrc: "http://img.b2bpic.net/free-photo/sunset-race_23-2151952483.jpg" },
{ id: "p4", name: "Red Shift Moto", price: "2023", variant: "Motorcycle", imageSrc: "http://img.b2bpic.net/free-vector/dark-black-wallpaper-with-abstract-shiny-metallic-design_1017-59672.jpg" },
{ id: "p5", name: "Urban Glide", price: "2022", variant: "Urban", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-time-machines-design_23-2151599322.jpg" },
{ id: "p6", name: "V-Plane Concept", price: "2022", variant: "Aviation", imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-looking-spaceship_23-2150675505.jpg" },
]}
title="Project Gallery"
description="Select case studies showcasing our design development journey."
@@ -130,18 +112,9 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1", value: "15+", title: "Global Projects", items: [
"Concept Ideation", "Manufacturing Ready", "Strategic Consulting"],
},
{
id: "m2", value: "8k+", title: "Render Hours", items: [
"3D Modeling", "Lighting Simulation", "Texture Mapping"],
},
{
id: "m3", value: "100%", title: "Client Satisfaction", items: [
"Vision Alignment", "Iterative Workflow", "Final Delivery"],
},
{ id: "m1", value: "15+", title: "Global Projects", items: ["Concept Ideation", "Manufacturing Ready", "Strategic Consulting"] },
{ id: "m2", value: "8k+", title: "Render Hours", items: ["3D Modeling", "Lighting Simulation", "Texture Mapping"] },
{ id: "m3", value: "100%", title: "Client Satisfaction", items: ["Vision Alignment", "Iterative Workflow", "Final Delivery"] },
]}
title="Project Statistics"
description="Key achievements in our design practice."
@@ -154,29 +127,16 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "t1", name: "Sarah Miller", role: "Creative Director", company: "AutoDesign Lab", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/african-guy-wears-trendy-wristwatch-posing-with-smile-near-beige-wall-outdoor-portrait-black-man-good-mood-standing-with-arms-crossed_197531-21794.jpg"},
{
id: "t2", name: "David Chen", role: "Head of R&D", company: "NextMotion", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-business-leader-window_1262-5674.jpg"},
{
id: "t3", name: "Alex Riviera", role: "Lead Architect", company: "Veloce Corp", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg"},
{
id: "t4", name: "Elena Rossi", role: "Project Manager", company: "SkyTransport", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/successful-architect-with-safety-helmet_23-2148242912.jpg"},
{
id: "t5", name: "Marcus Thorne", role: "Design Lead", company: "Velocity Systems", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/middle-aged-bald-man-suit-wearing-glasses-looking-front-with-serious-confident-expression-standing-pink-wall_141793-62172.jpg"},
{ id: "t1", name: "Sarah Miller", role: "Creative Director", company: "AutoDesign Lab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/african-guy-wears-trendy-wristwatch-posing-with-smile-near-beige-wall-outdoor-portrait-black-man-good-mood-standing-with-arms-crossed_197531-21794.jpg" },
{ id: "t2", name: "David Chen", role: "Head of R&D", company: "NextMotion", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-business-leader-window_1262-5674.jpg" },
{ id: "t3", name: "Alex Riviera", role: "Lead Architect", company: "Veloce Corp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg" },
{ id: "t4", name: "Elena Rossi", role: "Project Manager", company: "SkyTransport", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/successful-architect-with-safety-helmet_23-2148242912.jpg" },
{ id: "t5", name: "Marcus Thorne", role: "Design Lead", company: "Velocity Systems", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/middle-aged-bald-man-suit-wearing-glasses-looking-front-with-serious-confident-expression-standing-pink-wall_141793-62172.jpg" },
]}
kpiItems={[
{
value: "5.0", label: "Avg Rating"},
{
value: "20+", label: "Partners"},
{
value: "100%", label: "On Time"},
{ value: "5.0", label: "Avg Rating" },
{ value: "20+", label: "Partners" },
{ value: "100%", label: "On Time" },
]}
title="Client Voices"
description="Partners who trust our design process."
@@ -186,14 +146,12 @@ export default function LandingPage() {
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{
variant: "sparkles-gradient"}}
background={{ variant: "sparkles-gradient" }}
tag="Let's Talk"
title="Ready for the Future?"
description="Collaborate with us on your next automotive design innovation. We're ready to define the next era of mobility."
buttons={[
{
text: "Contact Us", href: "#"},
{ text: "Contact Us", href: "/contact" },
]}
/>
</div>
@@ -201,30 +159,9 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Company", items: [
{
label: "About", href: "#about"},
{
label: "Portfolio", href: "#portfolio"},
],
},
{
title: "Contact", items: [
{
label: "Email", href: "mailto:info@proto.design"},
{
label: "Twitter", href: "#"},
],
},
{
title: "Legal", items: [
{
label: "Privacy Policy", href: "#"},
{
label: "Terms", href: "#"},
],
},
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Portfolio", href: "#portfolio" }] },
{ title: "Contact", items: [{ label: "Email", href: "mailto:info@proto.design" }, { label: "Contact Page", href: "/contact" }] },
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] },
]}
logoText="PROTO-TRANSIT"
/>
@@ -232,4 +169,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

4
src/app/styles/base.css
View File

@@ -11,7 +11,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-nunito), sans-serif;
font-family: var(--font-orbitron), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-nunito), sans-serif;
font-family: var(--font-orbitron), sans-serif;
}

10
src/app/styles/variables.css
View File

@@ -11,14 +11,14 @@
--background-accent: #ffffff; */
--background: #0a0a0a;
--card: #141414;
--card: #171717;
--foreground: #f5f5f5;
--primary-cta: #e63946;
--primary-cta: #ff0000;
--primary-cta-text: #ffffff;
--secondary-cta: #262626;
--secondary-cta: #7f1d1d;
--secondary-cta-text: #f5f5f5;
--accent: #333333;
--background-accent: #e63946;
--accent: #ff3333;
--background-accent: #1f0000;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);