Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
234
src/app/page.tsx
234
src/app/page.tsx
@@ -2,19 +2,11 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import { DollarSign, TrendingUp, Users } from "lucide-react";
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import { ArrowRight } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
export default function BlogPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
@@ -29,191 +21,45 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Start", id: "hero"},
|
||||
{
|
||||
name: "My Story", id: "about"},
|
||||
{
|
||||
name: "Roadmap", id: "features"},
|
||||
{
|
||||
name: "Insights", id: "blog"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="TikTok Success Blog"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Начало", id: "hero" },
|
||||
{ name: "Моята История", id: "story" },
|
||||
{ name: "Контакти", id: "contact" },
|
||||
]}
|
||||
brandName="TikTok Success Blog"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
logoText="From Zero to Viral"
|
||||
description="My journey as a TikTok creator and how I turned views into a steady income stream. Get the exact blueprint I used to build my audience."
|
||||
buttons={[
|
||||
{
|
||||
text: "My Story", href: "#about"},
|
||||
{
|
||||
text: "Get the Roadmap", href: "#features"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-young-teenage-girl-her-room-recording-vlog-daily-lifestyle-video-social-media_1258-281837.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="story" data-section="story" className="py-24 px-6">
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<h1 className="text-4xl font-bold mb-8">Моята история в TikTok: От нулата до първите приходи</h1>
|
||||
<img
|
||||
src="http://img.b2bpic.net/free-photo/portrait-young-teenage-girl-her-room-recording-vlog-daily-lifestyle-video-social-media_1258-281837.jpg"
|
||||
alt="Тийнейджър записва видео"
|
||||
className="w-full h-auto rounded-lg mb-8"
|
||||
/>
|
||||
<p className="mb-6">Всичко започна съвсем случайно. Бях тийнейджър с много свободно време и една стара камера. Никога не съм мислил, че TikTok ще се превърне в моята основна работа.</p>
|
||||
<p className="mb-6">Първите месеци бяха трудни. Публикувах видеа без никакъв отклик, но не се отказах. Ключът беше в постоянството и разбирането на алгоритъма. Когато спрях да гоня тенденциите и започнах да бъда себе си, нещата се промениха.</p>
|
||||
<p>Днес мога да кажа, че изкарването на пари в TikTok не е въпрос на късмет, а на правилната стратегия. В този блог ще споделя стъпките, които ме доведоха до успех.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="Why I Started This"
|
||||
description={[
|
||||
"I started with nothing but an old phone and a dream to be creative. TikTok became my accidental career.", "After months of failing, I cracked the algorithm code. Now, I share those lessons so you can skip the struggle and start earning faster."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "Identifying Viral Niches", tags: [
|
||||
"Strategy"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/influencer-marketing-vectors_23-2147701909.jpg"},
|
||||
{
|
||||
id: "f2", title: "Building Community", tags: [
|
||||
"Engagement"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/vector-ui-illustration-health-donation-charity-concept_53876-8025.jpg"},
|
||||
{
|
||||
id: "f3", title: "Monetization Tactics", tags: [
|
||||
"Earnings"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tzj9m9"},
|
||||
]}
|
||||
title="The Growth Roadmap"
|
||||
description="The foundational steps I followed to turn my hobby into a business."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "1M+", title: "Total Views", description: "Global reach", icon: TrendingUp,
|
||||
},
|
||||
{
|
||||
id: "m2", value: "50k+", title: "Followers", description: "Community size", icon: Users,
|
||||
},
|
||||
{
|
||||
id: "m3", value: "10k+", title: "Earned", description: "Revenue generated", icon: DollarSign,
|
||||
},
|
||||
]}
|
||||
title="The Impact"
|
||||
description="Numbers behind the growth."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Alex", role: "Student", testimonial: "The tips here actually work! Hit my first 10k followers thanks to this.", imageSrc: "http://img.b2bpic.net/free-photo/male-graphic-designer-using-graphics-tablet_1170-871.jpg"},
|
||||
{
|
||||
id: "t2", name: "Sarah", role: "Creator", testimonial: "Life-changing content, finally understood how the algorithm works.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-holding-crossed-arms_23-2149362877.jpg"},
|
||||
{
|
||||
id: "t3", name: "Mike", role: "Entrepreneur", testimonial: "Monetization advice saved me months of trial and error.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-serious-handsome-man-with-trendy-hairdo_176532-7487.jpg"},
|
||||
{
|
||||
id: "t4", name: "Elena", role: "Student", testimonial: "Clear, concise, and actionable advice.", imageSrc: "http://img.b2bpic.net/free-photo/happy-lively-friendly-redhead-european-girl-pointing-herself-suggesting-help-boasting-telling-own-ac_1258-134592.jpg"},
|
||||
{
|
||||
id: "t5", name: "David", role: "Creator", testimonial: "Gave me the confidence to start my own channel.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-curly-blonde-hair-smiling_23-2148911877.jpg"},
|
||||
]}
|
||||
title="What Creators Say"
|
||||
description="Success stories from those following the blueprint."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Latest Insights"
|
||||
description="Deep dives into TikTok growth."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1", category: "Growth", title: "How to go viral in 2025", excerpt: "Focus on storytelling first.", imageSrc: "http://img.b2bpic.net/free-photo/tablet-showing-financial-data-with-coffee_23-2152020633.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/african-rastafarian-male-smiles-looks-camera-standing-with-his-arms-crossed-studio-portrait-blue-background_613910-3671.jpg", date: "Jan 2025"},
|
||||
{
|
||||
id: "b2", category: "Production", title: "Budget lighting setup", excerpt: "Good gear without breaking the bank.", imageSrc: "http://img.b2bpic.net/free-photo/tools-settings-configuration-setup-concept_53876-31450.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-cheerful-young-businesswoman_329181-13396.jpg", date: "Dec 2024"},
|
||||
{
|
||||
id: "b3", category: "Earnings", title: "Creator Fund vs Brand Deals", excerpt: "Which pays better for you?", imageSrc: "http://img.b2bpic.net/free-photo/excited-woman-filming-fashion-vlog-with-phone_482257-121799.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/stylish-woman-denim-suit-with-round-earrings-raises-her-fingers-up-laughs-smiling-woman-oversized-jacket-posing-pink_197531-19182.jpg", date: "Nov 2024"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1", title: "Is it too late to start?", content: "Never. TikTok is always hungry for fresh content."},
|
||||
{
|
||||
id: "q2", title: "Do I need expensive equipment?", content: "No, natural light and a decent phone are enough to start."},
|
||||
{
|
||||
id: "q3", title: "How do I get my first brand deal?", content: "Build an audience first, the deals follow automatically."},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Everything you need to know about starting out."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Newsletter"
|
||||
title="Get My Weekly Tips"
|
||||
description="Join thousands of creators getting my best advice every week."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/decorative-wedding-elements_23-2148098857.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="TikTok Success Blog"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{
|
||||
label: "Story", href: "#about"},
|
||||
{
|
||||
label: "Blog", href: "#blog"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources", items: [
|
||||
{
|
||||
label: "Guide", href: "#features"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="TikTok Success Blog"
|
||||
columns={[
|
||||
{
|
||||
title: "Навигация", items: [
|
||||
{ label: "Начало", href: "/" },
|
||||
{ label: "Моята история", href: "#story" },
|
||||
],
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user