Update theme colors

Update src/app/page.tsx
Update src/app/layout.tsx
2026-03-06 11:00:14 +00:00 · 2026-03-06 05:46:36 +00:00 · 2026-03-06 05:46:35 +00:00 · 2026-03-06 05:45:35 +00:00 · 2026-03-06 05:45:31 +00:00 · 2026-03-06 05:44:50 +00:00
3 changed files with 60 additions and 78 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,50 +1,20 @@
 import type { Metadata } from "next";
 import { DM_Sans } from "next/font/google";
 import { Inter } from "next/font/google";
 import "./globals.css";
 import { ServiceWrapper } from "@/components/ServiceWrapper";
 import Tag from "@/tag/Tag";
-const dmSans = DM_Sans({
+const inter = Inter({ subsets: ["latin"] });
  variable: "--font-dm-sans",  subsets: ["latin"],
 });
 const inter = Inter({
  variable: "--font-inter",  subsets: ["latin"],
 });
 export const metadata: Metadata = {
-  title: "CreatorFlow — Collab Manager for Teen Creators",  description: "Auto-parse DMs, approve collabs one-click, track payments. Free forever for solo creators. Perfect for TikTok, YouTube, and emerging creators.",  keywords: "collab management, teen creators, DM parser, payment tracker, creator tools, collaboration platform",  metadataBase: new URL("https://creatorflow.io"),
+  title: "CreatorFlow - DM Collaboration Manager for Teen Creators",  description: "Stop chasing collabs in DMs. Manage collaboration requests, approvals, and payments with AI-powered parsing and smart reminders."};
  alternates: {
    canonical: "https://creatorflow.io"},
  openGraph: {
    title: "CreatorFlow — Stop Chasing Collabs in DMs",    description: "The all-in-one dashboard for teen creators to manage collaboration requests, track approvals, and never chase payment again.",    url: "https://creatorflow.io",    siteName: "CreatorFlow",    type: "website",    images: [
      {
        url: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/a-modern-sleek-dashboard-interface-for-t-1772775426370-766daa52.png",        alt: "CreatorFlow dashboard interface"},
    ],
  },
  twitter: {
    card: "summary_large_image",    title: "CreatorFlow — Collab Manager for Teen Creators",    description: "Auto-parse DMs, approve collabs one-click, track payments. Free forever.",    images: [
      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/a-modern-sleek-dashboard-interface-for-t-1772775426370-766daa52.png"],
  },
  robots: {
    index: true,
    follow: true,
  },
 };
 export default function RootLayout({
  children,
-}: Readonly<{
+}: {
  children: React.ReactNode;
-}>) {
+}) {
  return (
-    <html lang="en" suppressHydrationWarning>
+    <html lang="en">
-      <ServiceWrapper>
+      <body className={inter.className}>{children}
        <body className={`${dmSans.variable} ${inter.variable} antialiased`}>
          <Tag />
          {children}
        <script
          dangerouslySetInnerHTML={{
            __html: `
@@ -1412,7 +1382,6 @@ export default function RootLayout({
          }}
        />
      </body>
      </ServiceWrapper>
    </html>
  );
 }
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -4,11 +4,12 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
 import HeroCentered from "@/components/sections/hero/HeroCentered";
 import FeatureBento from "@/components/sections/feature/FeatureBento";
-import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
+import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
 import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
 import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
 import ContactCenter from "@/components/sections/contact/ContactCenter";
 import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
 import BlogCardTwo from "@/components/sections/blog/BlogCardTwo";
 import {
  Mail,
  MessageCircle,
@@ -103,16 +104,6 @@ export default function LandingPage() {
                { icon: Zap, label: "Keywords", value: "AI-detected" },
              ],
            },
            {
              title: "Approval Pipeline",              description: "Drag-and-drop your collabs through Review → Approved → Paid stages. Real-time pipeline visibility.",              bentoComponent: "3d-task-list",              items: [
                { icon: Clock, label: "Pending Review", time: "2 requests" },
                { icon: CheckCircle, label: "Approved", time: "5 approved" },
                { icon: DollarSign, label: "Payout Due", time: "3 pending" },
              ],
            },
            {
              title: "One-Click Approvals",              description: "Generate contract links and send approval confirmations instantly. No back-and-forth emails.",              bentoComponent: "reveal-icon",              icon: CheckCircle,
            },
            {
              title: "Smart Reminders",              description: "Push notifications remind you when payments are due or collabs need follow-up. Never chase again.",              bentoComponent: "orbiting-icons",              centerIcon: Bell,
              items: [
@@ -121,42 +112,64 @@ export default function LandingPage() {
                { icon: CheckCircle, ring: 3, duration: 12 },
              ],
            },
            {
              title: "One-Click Approvals",              description: "Generate contract links and send approval confirmations instantly. No back-and-forth emails.",              bentoComponent: "reveal-icon",              icon: CheckCircle,
            },
            {
              title: "Approval Pipeline",              description: "Drag-and-drop your collabs through Review → Approved → Paid stages. Real-time pipeline visibility.",              bentoComponent: "3d-task-list",              items: [
                { icon: Clock, label: "Pending Review", time: "2 requests" },
                { icon: CheckCircle, label: "Approved", time: "5 approved" },
                { icon: DollarSign, label: "Payout Due", time: "3 pending" },
              ],
            },
          ]}
        />
      </div>
      <div id="advanced-features" data-section="advanced-features">
-        <FeatureBorderGlow
+        <HeroBillboardScroll
          title="Built for Teen Creators"
-          description="Simple enough for solopreneurs. Powerful enough for growing channels."
+          description="Simple enough for solopreneurs. Powerful enough for growing channels. Experience smooth scroll-triggered animations as you explore what makes CreatorFlow unique."
          tag="Why CreatorFlow"
          tagAnimation="slide-up"
          buttonAnimation="slide-up"
          background={{ variant: "canvas-reveal" }}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/portrait-photo-of-a-15-16-year-old-conte-1772775425499-81ffd161.png?_wi=1"
          imageAlt="CreatorFlow Dashboard Preview"
          buttons={[
            { text: "Explore Features", href: "#features" },
            { text: "Get Started", href: "https://app.creatorflow.io/signup" },
          ]}
        />
      </div>
      <div id="blog" data-section="blog">
        <BlogCardTwo
          title="Creator Insights & Stories"
          description="Learn from teen creators who are crushing it with CreatorFlow. Get tips, tricks, and insider perspectives on managing collaborations."
          tag="Latest Articles"
          tagAnimation="slide-up"
          buttonAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
-          features={[
+          carouselMode="buttons"
          blogs={[
            {
-              icon: Smartphone,
+              id: "1",              category: ["Creator Story", "Tips"],
-              title: "Mobile First",              description: "Manage collabs on the go. Full app experience on iPhone and Android."
+              title: "How Alex Chen Turned Chaos Into Cash",              excerpt: "From 3 hours of DM chasing per week to 15 minutes of admin work. See how one TikTok creator saved $2k in missed payments.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/portrait-photo-of-a-15-16-year-old-conte-1772775425499-81ffd161.png?_wi=2",              imageAlt: "Alex Chen, TikTok Creator",              authorName: "Alex Chen",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/portrait-photo-of-a-15-16-year-old-conte-1772775425499-81ffd161.png",              date: "15 Jan 2025"
            },
            {
-              icon: Zap,
+              id: "2",              category: ["Guide", "Collaboration"],
-              title: "Lightning Fast",              description: "Dashboard loads in under 2 seconds. Instant notifications and updates."
+              title: "5 Red Flags to Spot in Shady Collab Offers",              excerpt: "Not all brand deals are created equal. Learn how to identify legitimate collaboration requests and protect your personal brand.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/portrait-of-a-young-teen-creator-confide-1772775427139-8b25320f.png",              imageAlt: "Red flags in collaborations",              authorName: "Jamie Torres",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/portrait-of-a-young-teen-creator-confide-1772775427139-8b25320f.png",              date: "12 Jan 2025"
            },
            {
-              icon: Lock,
+              id: "3",              category: ["Strategy", "Growth"],
-              title: "Your Data, Your Control",              description: "Private by default. No enterprise tracking or data selling. GDPR compliant."
+              title: "Scaling Your Collab Pipeline: From 5 to 50 Requests",              excerpt: "What changes when you go from managing a handful of collabs to juggling dozens? A deep dive into structuring your workflow for growth.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/young-teen-creator-portrait-with-energet-1772775425917-e85c9147.png",              imageAlt: "Scaling collaborations",              authorName: "Casey Kim",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/young-teen-creator-portrait-with-energet-1772775425917-e85c9147.png",              date: "10 Jan 2025"
            },
            {
-              icon: BarChart3,
+              id: "4",              category: ["Payment", "Legal"],
-              title: "Analytics Built-In",              description: "Track collab ROI, payment history, and creator network insights at a glance."
+              title: "Getting Paid on Time: Contracts 101 for Teen Creators",              excerpt: "Why you need a contract template, what should be in it, and how CreatorFlow's auto-link system keeps everyone on the same page.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/teen-creator-portrait-showing-diverse-re-1772775425799-73c2858b.png",              imageAlt: "Creator contracts",              authorName: "Morgan Lee",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AYfbtCZ5l0aNcatN56DdYclF2R/teen-creator-portrait-showing-diverse-re-1772775425799-73c2858b.png",              date: "8 Jan 2025"
            },
            {
              icon: Share2,
              title: "Export Anywhere",              description: "One-click export to Google Sheets. Sync your data with your existing tools."
            },
            {
              icon: Users,
              title: "Team Ready",              description: "Invite team members (producers, managers) without extra cost. Share workflows instantly."
            },
          ]}
        />
@@ -259,7 +272,7 @@ export default function LandingPage() {
            {
              title: "Company",              items: [
                { label: "About", href: "#" },
-                { label: "Blog", href: "#" },
+                { label: "Blog", href: "#blog" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#" },
              ],
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
  --accent: #ffffff;
  --background-accent: #ffffff; */
-  --background: #ffffff;
+  --background: #fbfaff;
-  --card: #f9f9f9;
+  --card: #f7f5ff;
-  --foreground: #000612e6;
+  --foreground: #0f0022;
-  --primary-cta: #106EFB;
+  --primary-cta: #8b5cf6;
-  --primary-cta-text: #ffffff;
+  --primary-cta-text: #fbfaff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #ffffff;
-  --secondary-cta-text: #000612e6;
+  --secondary-cta-text: #0f0022;
-  --accent: #e2e2e2;
+  --accent: #d8cef5;
-  --background-accent: #106EFB;
+  --background-accent: #c4a8f9;
  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
Author	SHA1	Message	Date
bender	aee5e0ec22	Update theme colors	2026-03-06 11:00:14 +00:00
bender	4added6461	Update src/app/page.tsx	2026-03-06 05:46:36 +00:00
bender	c75f606b5a	Update src/app/layout.tsx	2026-03-06 05:46:35 +00:00
bender	e5f6b7c81e	Merge version_2 into main Merge version_2 into main	2026-03-06 05:45:35 +00:00
bender	22960b159e	Update src/app/page.tsx	2026-03-06 05:45:31 +00:00
bender	36f800c326	Merge version_2 into main Merge version_2 into main	2026-03-06 05:44:50 +00:00
bender	e0daec37c6	Update src/app/page.tsx	2026-03-06 05:44:46 +00:00
bender	298b67786f	Merge version_1 into main Merge version_1 into main	2026-03-06 05:43:01 +00:00
bender	8966c65711	Merge version_1 into main Merge version_1 into main	2026-03-06 05:39:02 +00:00