Merge version_2 into main #1

Merged
bender merged 6 commits from version_2 into main 2026-05-14 04:35:03 +00:00
6 changed files with 194 additions and 484 deletions

View File

@@ -2,107 +2,48 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import { Gavel, Scale, AlertTriangle } from "lucide-react";
export default function LandingPage() {
export default function EthicsPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="large"
background="none"
cardStyle="gradient-mesh"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="light"
>
<ThemeProvider>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Inclusive Relationships",
id: "/inclusive",
},
{
name: "Power & Consent",
id: "/power",
},
{
name: "Ethics & Discrimination",
id: "/ethics",
},
{
name: "Protective Strategies",
id: "/protective",
},
]}
brandName="RELATE"
/>
</div>
<div id="body-ethics" data-section="body-ethics">
<TextSplitAbout
useInvertedBackground={false}
title="Ethics & Discrimination"
description={[
"Recognizing bias, upholding ethical standards, and navigating discrimination in social spheres.",
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Identifying Bias"
description={[
"A deep dive into recognizing and mitigating unconscious bias in relationships.",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="RELATE"
columns={[
{
title: "Resources",
items: [
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Inclusive Relationships", id: "/inclusive" },
{ name: "Power & Consent", id: "/power" },
{ name: "Ethical Manner & Discrimination", id: "/ethics" },
{ name: "Protective Strategies", id: "/protective" },
]}
brandName="RELATE"
/>
<FeatureCardTen
animationType="slide-up"
textboxLayout="split"
title="Ethical Manner and Addressing Discrimination"
description="Cultivating inclusive environments by understanding systemic bias and upholding personal dignity through ethical behavior."
features={[
{
label: "Inclusive",
href: "/inclusive",
title: "Understanding Bias", description: "Recognizing implicit biases that lead to unfair treatment or discrimination in social settings.", media: { imageSrc: "http://img.b2bpic.net/free-photo/diverse-people-having-meeting_23-2148766735.jpg" },
items: [{ icon: Gavel, text: "Identify exclusionary practices" }, { icon: Scale, text: "Promote equitable treatment" }],
reverse: false
},
{
label: "Ethics",
href: "/ethics",
},
],
},
{
title: "Legal",
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
/>
</div>
title: "Active Advocacy", description: "Standing up against discriminatory behavior and creating safe spaces for everyone.", media: { imageSrc: "http://img.b2bpic.net/free-photo/group-diverse-people-joining-hands_23-2148766723.jpg" },
items: [{ icon: AlertTriangle, text: "Challenge harmful stereotypes" }, { icon: Scale, text: "Support inclusivity initiatives" }],
reverse: true
}
]}
/>
<FooterBaseCard
logoText="RELATE"
columns={[{ title: "Resources", items: [{ label: "Home", href: "/" }, { label: "Protective Strategies", href: "/protective" }] }]}
/>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,11 +2,13 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import { Users } from "lucide-react";
export default function LandingPage() {
export default function InclusiveRelationshipsPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
@@ -21,88 +23,41 @@ export default function LandingPage() {
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Inclusive Relationships",
id: "/inclusive",
},
{
name: "Power & Consent",
id: "/power",
},
{
name: "Ethics & Discrimination",
id: "/ethics",
},
{
name: "Protective Strategies",
id: "/protective",
},
]}
brandName="RELATE"
/>
</div>
<div id="body-inclusive" data-section="body-inclusive">
<TextSplitAbout
useInvertedBackground={false}
title="Inclusive Relationships"
description={[
"Focus on diversity, intersectionality, and building inclusive interpersonal skills.",
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Expanding Perspectives"
description={[
"Learn to embrace diverse viewpoints for more empathetic connections.",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="RELATE"
columns={[
{
title: "Resources",
items: [
{
label: "Inclusive",
href: "/inclusive",
},
{
label: "Ethics",
href: "/ethics",
},
],
},
{
title: "Legal",
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
/>
</div>
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Inclusive Relationships", id: "/inclusive" },
{ name: "Power & Consent", id: "/power" },
{ name: "Ethics & Discrimination", id: "/ethics" },
{ name: "Protective Strategies", id: "/protective" },
]}
brandName="RELATE"
/>
<HeroSplitDualMedia
title="Inclusive Relationships"
description="Fostering belonging and understanding across diverse interpersonal connections through empathy and active engagement."
tag="Cultivating Connection"
rating={5}
ratingText="Expert Endorsed"
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/diverse-people-working-together_23-2148427081.jpg", imageAlt: "Diversity" },
{ imageSrc: "http://img.b2bpic.net/free-photo/group-people-diverse-backgrounds_23-2148812671.jpg", imageAlt: "Inclusive group" }
]}
/>
<TextSplitAbout
title="Building Interpersonal Skills"
description={[
"Inclusive relationships begin with active listening, where we validate others' experiences without judgment.", "Developing empathy allows us to bridge gaps between different cultural, social, and personal perspectives.", "Effective communication strategies ensure that all parties feel valued and heard in any given interaction."
]}
/>
<FooterBaseCard
logoText="RELATE"
columns={[
{ title: "Resources", items: [{ label: "Home", href: "/" }, { label: "Power & Consent", href: "/power" }] },
{ title: "Legal", items: [{ label: "Terms", href: "#" }, { label: "Privacy", href: "#" }] },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -29,25 +29,15 @@ export default function LandingPage() {
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "/",
},
name: "Home", id: "/"},
{
name: "Inclusive Relationships",
id: "/inclusive",
},
name: "Inclusive Relationships", id: "/inclusive"},
{
name: "Power & Consent",
id: "/power",
},
name: "Power & Consent", id: "/power"},
{
name: "Ethics & Discrimination",
id: "/ethics",
},
name: "Ethics & Discrimination", id: "/ethics"},
{
name: "Protective Strategies",
id: "/protective",
},
name: "Protective Strategies", id: "/protective"},
]}
brandName="RELATE"
/>
@@ -56,59 +46,28 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroCentered
background={{
variant: "plain",
}}
variant: "gradient-bars"}}
title="Understanding Relationships"
description="Cultivating awareness, empathy, and respect in all aspects of interpersonal connection."
avatars={[
{
src: "http://img.b2bpic.net/free-vector/youtube-channel-art-kids_23-2149536351.jpg",
alt: "Avatar 1",
},
src: "https://img.b2bpic.net/free-photo/diverse-group-people-working-together_23-2148766795.jpg?w=200", alt: "Collaboration"},
{
src: "http://img.b2bpic.net/free-psd/school-admission-facebook-cover-template_23-2150456028.jpg",
alt: "Avatar 2",
},
src: "https://img.b2bpic.net/free-photo/happy-friends-talking-park_23-2148796859.jpg?w=200", alt: "Friendship"},
{
src: "http://img.b2bpic.net/free-photo/abstract-paper-background-concept_23-2148812671.jpg",
alt: "Avatar 3",
},
{
src: "http://img.b2bpic.net/free-photo/world-happy-pride-day-love-string_23-2148516303.jpg",
alt: "Avatar 4",
},
{
src: "http://img.b2bpic.net/free-vector/back-school-landing-page_23-2148215482.jpg",
alt: "Avatar 5",
},
src: "https://img.b2bpic.net/free-photo/two-people-talking-outdoors_23-2148530364.jpg?w=200", alt: "Communication"},
]}
avatarText="Join our growing community of 2.4k+ learners"
buttons={[
{
text: "Get Started",
href: "/inclusive",
},
text: "Explore Resources", href: "/inclusive"},
]}
marqueeItems={[
{
type: "text",
text: "Communication",
},
{
type: "text",
text: "Consent",
},
{
type: "text",
text: "Empathy",
},
{
type: "text",
text: "Trust",
},
{
type: "text",
text: "Respect",
},
{ type: "text", text: "Communication" },
{ type: "text", text: "Consent" },
{ type: "text", text: "Empathy" },
{ type: "text", text: "Trust" },
{ type: "text", text: "Respect" },
]}
/>
</div>
@@ -116,10 +75,9 @@ export default function LandingPage() {
<div id="about-1" data-section="about-1">
<TextSplitAbout
useInvertedBackground={false}
title="Definition of Relationships"
title="Defining Our Bonds"
description={[
"A relationship is the way in which two or more concepts, objects, or people are connected, or the state of being connected.",
"It encompasses communication, mutual support, and shared goals between individuals.",
"Relationships represent the complex ways in which individuals connect, communicate, and support one another through life's journey.", "Whether professional or personal, building healthy foundations requires deep listening, mutual respect, and a shared vision for growth."
]}
/>
</div>
@@ -132,40 +90,23 @@ export default function LandingPage() {
useInvertedBackground={true}
features={[
{
title: "Familial",
description: "Blood or chosen connections.",
imageSrc: "http://img.b2bpic.net/free-photo/happy-satisfied-business-woman-using-tablet-outside_74855-2926.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/colorful-compostion-with-watercolor-brushstrokes_23-2147923038.jpg",
buttonText: "Read More",
},
title: "Familial Connections", description: "Understanding the deep-rooted bonds formed by blood or intentional community.", imageSrc: "https://img.b2bpic.net/free-photo/happy-family-playing-park_23-2148564274.jpg?w=600", titleImageSrc: "https://img.b2bpic.net/free-vector/hand-drawn-family-portrait_23-2148386412.jpg?w=100", buttonText: "Read More"},
{
title: "Platonic",
description: "Friends and companions.",
imageSrc: "http://img.b2bpic.net/free-photo/office-desktop-with-laptop-glasses_23-2148174129.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/hand-gesture-expressing-different-feelings_23-2150061940.jpg",
buttonText: "Read More",
},
title: "Platonic Companions", description: "Celebrating the vital role friends play in our emotional well-being and growth.", imageSrc: "https://img.b2bpic.net/free-photo/friends-sitting-coffee-shop_23-2148281313.jpg?w=600", titleImageSrc: "https://img.b2bpic.net/free-vector/hand-drawn-heart-doodle_23-2148356985.jpg?w=100", buttonText: "Read More"},
{
title: "Romantic",
description: "Intimate partnerships.",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-business-people-talking_23-2148427081.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-together-project_23-2149286124.jpg",
buttonText: "Read More",
},
title: "Romantic Partnerships", description: "Nurturing intimacy with honesty, vulnerability, and sustained commitment.", imageSrc: "https://img.b2bpic.net/free-photo/couple-walking-beach-sunset_23-2148737380.jpg?w=600", titleImageSrc: "https://img.b2bpic.net/free-vector/hand-drawn-love-icon_23-2148356860.jpg?w=100", buttonText: "Read More"},
]}
title="Types of Relationships"
description="Diverse connections that shape our social fabric."
title="Relationship Architectures"
description="Discover the diverse ways we connect and build trust within our social landscape."
/>
</div>
<div id="about-2" data-section="about-2">
<TextSplitAbout
useInvertedBackground={false}
title="Characteristics of Healthy Relationships"
title="Cultivating Healthy Dynamics"
description={[
"Mutual respect and equality.",
"Open, honest communication.",
"Individual autonomy and support.",
"Healthy relationships are defined by balance, where each individual feels seen, heard, and valued for their unique perspective.", "By fostering equality and autonomy, we build environments where everyone can flourish without fear of coercion or judgment."
]}
/>
</div>
@@ -175,27 +116,18 @@ export default function LandingPage() {
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Impact by the Numbers"
description="We are dedicated to building a culture of awareness and support."
title="Meaningful Impact"
description="Our commitment is to provide actionable knowledge that transforms how individuals interact with the world."
metrics={[
{
id: "1",
icon: BookOpen,
title: "Educational Guides",
value: "50+",
},
id: "1", icon: BookOpen,
title: "Educational Guides", value: "75+"},
{
id: "2",
icon: Users,
title: "Active Students",
value: "2.4k",
},
id: "2", icon: Users,
title: "Active Learners", value: "3.5k"},
{
id: "3",
icon: Heart,
title: "Resource Reach",
value: "10k",
},
id: "3", icon: Heart,
title: "Community Reach", value: "15k"},
]}
/>
</div>
@@ -205,29 +137,16 @@ export default function LandingPage() {
logoText="RELATE"
columns={[
{
title: "Resources",
items: [
{
label: "Inclusive",
href: "/inclusive",
},
{
label: "Ethics",
href: "/ethics",
},
title: "Resources", items: [
{ label: "Inclusive", href: "/inclusive" },
{ label: "Ethics", href: "/ethics" },
{ label: "Consent", href: "/power" },
],
},
{
title: "Legal",
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
title: "Legal", items: [
{ label: "Terms of Service", href: "#" },
{ label: "Privacy Policy", href: "#" },
],
},
]}

View File

@@ -2,11 +2,12 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
export default function LandingPage() {
export default function PowerAndConsentPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
@@ -21,88 +22,41 @@ export default function LandingPage() {
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Inclusive Relationships",
id: "/inclusive",
},
{
name: "Power & Consent",
id: "/power",
},
{
name: "Ethics & Discrimination",
id: "/ethics",
},
{
name: "Protective Strategies",
id: "/protective",
},
]}
brandName="RELATE"
/>
</div>
<div id="body-power" data-section="body-power">
<TextSplitAbout
useInvertedBackground={false}
title="Power in Relationships"
description={[
"Defining healthy dynamics, understanding power imbalances, and prioritizing clear consent.",
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Consent Frameworks"
description={[
"Practical applications of consent in everyday social and professional interactions.",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="RELATE"
columns={[
{
title: "Resources",
items: [
{
label: "Inclusive",
href: "/inclusive",
},
{
label: "Ethics",
href: "/ethics",
},
],
},
{
title: "Legal",
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
/>
</div>
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Inclusive Relationships", id: "/inclusive" },
{ name: "Power & Consent", id: "/power" },
{ name: "Ethics & Discrimination", id: "/ethics" },
{ name: "Protective Strategies", id: "/protective" },
]}
brandName="RELATE"
/>
<HeroSplitDualMedia
title="Power in Relationships & Consent"
description="Understanding power dynamics is essential to establishing clear, enthusiastic, and ongoing consent in all relationships."
tag="Understanding Boundaries"
rating={5}
ratingText="Essential Education"
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/hand-gesture-expressing-different-feelings_23-2150061940.jpg", imageAlt: "Communication" },
{ imageSrc: "http://img.b2bpic.net/free-photo/happy-satisfied-business-woman-using-tablet-outside_74855-2926.jpg", imageAlt: "Autonomy" }
]}
/>
<TextSplitAbout
title="The Essence of Consent"
description={[
"Consent is an affirmative, voluntary, and reversible agreement between participants to engage in a specific action.", "Recognizing power imbalances helps in creating safe environments where boundaries are respected by everyone involved.", "Prioritizing mutual understanding ensures that every interaction remains grounded in trust and respect."
]}
/>
<FooterBaseCard
logoText="RELATE"
columns={[
{ title: "Resources", items: [{ label: "Home", href: "/" }, { label: "Inclusive", href: "/inclusive" }] },
{ title: "Legal", items: [{ label: "Terms", href: "#" }, { label: "Privacy", href: "#" }] },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,107 +2,48 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import { ShieldCheck, Lock, Eye } from "lucide-react";
export default function LandingPage() {
export default function ProtectivePage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="large"
background="none"
cardStyle="gradient-mesh"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="light"
>
<ThemeProvider>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Inclusive Relationships",
id: "/inclusive",
},
{
name: "Power & Consent",
id: "/power",
},
{
name: "Ethics & Discrimination",
id: "/ethics",
},
{
name: "Protective Strategies",
id: "/protective",
},
]}
brandName="RELATE"
/>
</div>
<div id="body-protective" data-section="body-protective">
<TextSplitAbout
useInvertedBackground={false}
title="Protective Strategies"
description={[
"Building resilience, creating personal safeguards, and knowing when to set boundaries.",
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Building Resilience"
description={[
"Tools for developing emotional maturity and strong self-defense against toxicity.",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="RELATE"
columns={[
{
title: "Resources",
items: [
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Inclusive Relationships", id: "/inclusive" },
{ name: "Power & Consent", id: "/power" },
{ name: "Ethical Manner & Discrimination", id: "/ethics" },
{ name: "Protective Strategies", id: "/protective" },
]}
brandName="RELATE"
/>
<FeatureCardTen
animationType="slide-up"
textboxLayout="split"
title="Protective Strategies"
description="Equipping yourself with actionable steps and boundaries to ensure emotional and physical safety in all connections."
features={[
{
label: "Inclusive",
href: "/inclusive",
title: "Establishing Boundaries", description: "Defining clear personal limits to foster respect and maintain healthy interactions.", media: { imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-protective-gesture_23-2148812671.jpg" },
items: [{ icon: ShieldCheck, text: "Communicate limits clearly" }, { icon: Lock, text: "Maintain autonomy" }],
reverse: false
},
{
label: "Ethics",
href: "/ethics",
},
],
},
{
title: "Legal",
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
/>
</div>
title: "Safety Awareness", description: "Developing heightened awareness of environments and situations to proactively mitigate risk.", media: { imageSrc: "http://img.b2bpic.net/free-photo/security-concept-with-person_23-2148516303.jpg" },
items: [{ icon: Eye, text: "Assess situational safety" }, { icon: ShieldCheck, text: "Trust your intuition" }],
reverse: true
}
]}
/>
<FooterBaseCard
logoText="RELATE"
columns={[{ title: "Resources", items: [{ label: "Home", href: "/" }, { label: "Ethics", href: "/ethics" }] }]}
/>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f5f5f5;
--card: #ffffff;
--foreground: #1c1c1c;
--primary-cta: #1c1c1c;
--background: #ffffff;
--card: #f5f5f7;
--foreground: #1d1d1f;
--primary-cta: #0071e3;
--primary-cta-text: #f5f5f5;
--secondary-cta: #ffffff;
--secondary-cta: #f5f5f7;
--secondary-cta-text: #1c1c1c;
--accent: #15479c;
--background-accent: #a8cce8;
--accent: #0066cc;
--background-accent: #e8e8ed;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);