Merge version_2 into main #2
110
src/app/about/page.tsx
Normal file
110
src/app/about/page.tsx
Normal file
@@ -0,0 +1,110 @@
|
||||
"use client";
|
||||
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
|
||||
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import { Instagram, TrendingUp, Mail, ArrowRight, Target } from 'lucide-react';
|
||||
|
||||
export default function AboutPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="largeSmallSizeMediumTitles"
|
||||
background="fluid"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="Blue Forest"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{
|
||||
text: "Donate", href: "#contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaSplitTabsAbout
|
||||
title="About Blue Forest Project"
|
||||
description="A student-led initiative combining rigorous marine science with transparent documentation and real ocean impact."
|
||||
tabs={[
|
||||
{
|
||||
id: "origin", label: "Our Story", description: "Blue Forest started as a simple question: What if students could design and execute real marine restoration science? We weren't interested in theory alone. We wanted hands-on experience growing kelp, testing restoration techniques, and building a complete understanding of what it takes to restore ocean ecosystems. Starting from San Diego, we've created a transparent, peer-reviewed approach to kelp restoration that proves young people can drive environmental change."
|
||||
},
|
||||
{
|
||||
id: "science", label: "Our Science", description: "We operate with full scientific rigor. Our tanks are equipped with professional-grade sensors monitoring pH, temperature, salinity, and light cycles 24/7. Every growth measurement is recorded. Every experiment is documented. We partner with university researchers to validate our methods and share data openly. Our approach combines controlled lab research with field restoration, creating a feedback loop that improves our impact in real ocean waters."
|
||||
},
|
||||
{
|
||||
id: "impact", label: "Our Impact", description: "Real numbers matter. We've successfully grown kelp cohorts from spore to mature plants. We've trained over 50 student researchers. We're partnering with three universities on peer-reviewed studies. Our monitoring data has revealed insights about optimal growth conditions that are now informing restoration site selection along the San Diego coast. Every dollar raised funds equipment upgrades and expands our field restoration capacity."
|
||||
}
|
||||
]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/woman-s-hand-pouring-water-glass-container-filled-with-pieces-paper_23-2147845512.jpg?_wi=2"
|
||||
imageAlt="Blue Forest research lab with monitoring equipment"
|
||||
imagePosition="right"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="values" data-section="values">
|
||||
<FeatureCardTwentySix
|
||||
title="How We Work"
|
||||
description="Our approach is built on these core principles that guide every decision we make."
|
||||
tag="Our Values"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Transparent Science", description: "We share every experiment, every failure, every learning. No hidden data, no cherry-picked results. Real science means showing your work and inviting peer review.", imageSrc: "https://img.b2bpic.net/free-photo/scientists-working-together-in-laboratory_23-2148116421.jpg", imageAlt: "Team collaborating on research", buttonIcon: ArrowRight,
|
||||
buttonHref: "#"
|
||||
},
|
||||
{
|
||||
title: "Student Leadership", description: "This is student-led from top to bottom. We design the experiments, conduct the research, analyze the data, and drive the field work. Our advisors guide, but we own the science.", imageSrc: "https://img.b2bpic.net/free-photo/group-young-researchers_23-2148116389.jpg", imageAlt: "Student researchers in the field", buttonIcon: ArrowRight,
|
||||
buttonHref: "#"
|
||||
},
|
||||
{
|
||||
title: "Real Ocean Impact", description: "We don't just grow kelp in tanks. We take what we learn directly to San Diego's waters and restore actual kelp forests. Lab research informs field work. Field results improve lab experiments.", imageSrc: "https://img.b2bpic.net/free-photo/astronaut-diving-ocean_23-2151549787.jpg?_wi=2", imageAlt: "Underwater field restoration work", buttonIcon: ArrowRight,
|
||||
buttonHref: "#"
|
||||
},
|
||||
{
|
||||
title: "Community Accountability", description: "We're accountable to our donors, our academic partners, and the ocean ecosystem we're trying to restore. Monthly progress updates, quarterly reports, and annual impact assessments keep us honest.", imageSrc: "https://img.b2bpic.net/free-photo/diverse-team-collaborating_23-2148116487.jpg", imageAlt: "Community collaboration meeting", buttonIcon: ArrowRight,
|
||||
buttonHref: "#"
|
||||
}
|
||||
]}
|
||||
tagAnimation="slide-up"
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Blue Forest"
|
||||
copyrightText="© 2025 Blue Forest Project | Student-led kelp restoration from San Diego"
|
||||
socialLinks={[
|
||||
{ icon: Instagram, href: "https://www.instagram.com/blueforestproject", ariaLabel: "Blue Forest on Instagram" },
|
||||
{ icon: TrendingUp, href: "https://www.tiktok.com/@blueforestproject", ariaLabel: "Blue Forest on TikTok" },
|
||||
{ icon: Mail, href: "mailto:hello@blueforestproject.org", ariaLabel: "Email Blue Forest Project" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@@ -32,7 +32,9 @@ export default function BlogPage() {
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" }
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{
|
||||
text: "Donate", href: "#contact"
|
||||
|
||||
@@ -9,6 +9,7 @@ import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwent
|
||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
||||
import { ArrowRight, Heart, Instagram, Leaf, Mail, Target, TrendingUp, Zap } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -31,7 +32,9 @@ export default function LandingPage() {
|
||||
navItems={[
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" }
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{
|
||||
text: "Donate", href: "#contact"
|
||||
|
||||
@@ -90,7 +90,8 @@ export default function ProductPage({ params }: ProductPageProps) {
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Shop", id: "/shop" }
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
@@ -137,7 +138,8 @@ export default function ProductPage({ params }: ProductPageProps) {
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Shop", id: "/shop" }
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
@@ -191,7 +193,8 @@ export default function ProductPage({ params }: ProductPageProps) {
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Shop", id: "/shop" }
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
|
||||
@@ -40,7 +40,8 @@ export default function ShopPage() {
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Shop", id: "/shop" }
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
@@ -86,7 +87,8 @@ export default function ShopPage() {
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Shop", id: "/shop" }
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
|
||||
101
src/app/team/page.tsx
Normal file
101
src/app/team/page.tsx
Normal file
@@ -0,0 +1,101 @@
|
||||
"use client";
|
||||
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import { Instagram, TrendingUp, Mail } from 'lucide-react';
|
||||
|
||||
export default function TeamPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="largeSmallSizeMediumTitles"
|
||||
background="fluid"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="Blue Forest"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Journey", id: "updates" },
|
||||
{ name: "Support", id: "support" },
|
||||
{ name: "Impact", id: "metrics" },
|
||||
{ name: "Team", id: "/team" },
|
||||
{ name: "About", id: "/about" }
|
||||
]}
|
||||
button={{
|
||||
text: "Donate", href: "#contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardEleven
|
||||
groups={[
|
||||
{
|
||||
id: "founders", groupTitle: "Founders", members: [
|
||||
{
|
||||
id: "1", title: "Alex Chen", subtitle: "Co-Founder & Lab Director", detail: "alex@blueforestproject.org", imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-scientist_23-2148116612.jpg"
|
||||
},
|
||||
{
|
||||
id: "2", title: "Jordan Martinez", subtitle: "Co-Founder & Field Research Lead", detail: "jordan@blueforestproject.org", imageSrc: "https://img.b2bpic.net/free-photo/portrait-happy-scientist-laboratory_23-2148116563.jpg"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "research", groupTitle: "Research Team", members: [
|
||||
{
|
||||
id: "3", title: "Sam Thompson", subtitle: "Kelp Biology Specialist", detail: "sam@blueforestproject.org", imageSrc: "https://img.b2bpic.net/free-photo/portrait-scientist-working-laboratory_23-2148116518.jpg"
|
||||
},
|
||||
{
|
||||
id: "4", title: "Casey Park", subtitle: "Data & Monitoring Engineer", detail: "casey@blueforestproject.org", imageSrc: "https://img.b2bpic.net/free-photo/portrait-concentrated-scientist-working-laboratory_23-2148116645.jpg"
|
||||
},
|
||||
{
|
||||
id: "5", title: "Morgan Stone", subtitle: "Field Operations Coordinator", detail: "morgan@blueforestproject.org", imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-scientist_23-2148116521.jpg"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "advisors", groupTitle: "Academic Advisors", members: [
|
||||
{
|
||||
id: "6", title: "Dr. Rebecca Walsh", subtitle: "Marine Biology, UC San Diego", detail: "r.walsh@ucsd.edu", imageSrc: "https://img.b2bpic.net/free-photo/portrait-professional-woman_23-2148116421.jpg"
|
||||
},
|
||||
{
|
||||
id: "7", title: "Prof. David Kim", subtitle: "Environmental Science, SDSU", detail: "d.kim@sdsu.edu", imageSrc: "https://img.b2bpic.net/free-photo/portrait-businessman-smiling_23-2148116589.jpg"
|
||||
}
|
||||
]
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
title="Meet Our Team"
|
||||
description="The dedicated students and advisors driving Blue Forest forward. Real people, real passion, real science."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Blue Forest"
|
||||
copyrightText="© 2025 Blue Forest Project | Student-led kelp restoration from San Diego"
|
||||
socialLinks={[
|
||||
{ icon: Instagram, href: "https://www.instagram.com/blueforestproject", ariaLabel: "Blue Forest on Instagram" },
|
||||
{ icon: TrendingUp, href: "https://www.tiktok.com/@blueforestproject", ariaLabel: "Blue Forest on TikTok" },
|
||||
{ icon: Mail, href: "mailto:hello@blueforestproject.org", ariaLabel: "Email Blue Forest Project" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user