Files
2c3b9f6b-097d-4d86-b836-adb…/src/app/page.tsx
2026-02-09 22:48:29 +00:00

225 lines
13 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSignup from '@/components/sections/hero/HeroSignup';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Crown, HelpCircle, Heart, Linkedin, Mail, Sparkles, Star, Twitter, Zap } from "lucide-react";
export default function NewsletterPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="mediumLargeSizeMediumTitles"
background="floatingGradient"
cardStyle="gradient-radial"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="NewsHub"
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Articles", id: "blog" },
{ name: "Plans", id: "pricing" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Subscribe", href: "contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSignup
title="Stay Connected with Premium Insights"
description="Discover curated stories, industry trends, and exclusive content delivered straight to your inbox every week. Join thousands of engaged readers building their knowledge."
background={{ variant: "sparkles-gradient" }}
tag="Weekly Newsletter"
tagIcon={Sparkles}
inputPlaceholder="Enter your email address"
buttonText="Get Early Access"
onSubmit={(email) => console.log('Email:', email)}
/>
</div>
<div id="about" data-section="about">
<MediaSplitTabsAbout
title="Why NewsHub"
description="We believe in the power of quality information to transform perspectives and fuel growth. Our platform brings together thoughtful analysis, timely insights, and stories that matter."
tabs={[
{
id: "quality", label: "Curated Quality", description: "Every article is carefully selected by our editorial team to ensure you receive only the most relevant and insightful content that truly matters for your growth."
},
{
id: "community", label: "Engaged Community", description: "Join a thriving community of readers, thinkers, and innovators who discuss ideas, share perspectives, and build meaningful connections around shared interests."
},
{
id: "exclusive", label: "Exclusive Access", description: "Premium subscribers unlock in-depth analysis, early article access, member-only webinars, and direct communication with our writing team and expert contributors."
}
]}
imageSrc="https://img.b2bpic.net/free-photo/man-wheelchair-having-office-job_23-2149571066.jpg"
imageAlt="NewsHub team collaborating"
imagePosition="right"
useInvertedBackground="noInvert"
/>
</div>
<div id="blog" data-section="blog">
<BlogCardThree
title="Featured Articles"
description="Explore our latest stories and insights handpicked for you"
tag="Latest"
tagIcon={Zap}
blogs={[
{
id: "1", category: "Technology", title: "The Future of AI in Content Creation", excerpt: "Exploring how artificial intelligence is reshaping the way we discover and consume information online.", imageSrc: "https://img.b2bpic.net/free-photo/working-office_1150-129.jpg", imageAlt: "AI and content creation", authorName: "Sarah Chen", authorAvatar: "/placeholders/placeholder1.webp", date: "Jan 15, 2025"
},
{
id: "2", category: "Marketing", title: "5 Email Strategies That Convert", excerpt: "Learn proven tactics to improve engagement and grow your subscriber base with effective email marketing.", imageSrc: "https://img.b2bpic.net/free-photo/young-woman-with-glasses-cafe_273609-3980.jpg", imageAlt: "Email marketing strategies", authorName: "Marcus Williams", authorAvatar: "/placeholders/placeholder1.webp", date: "Jan 12, 2025"
},
{
id: "3", category: "Insights", title: "Newsletter Trends: What Works in 2025", excerpt: "An in-depth analysis of the latest trends shaping the newsletter landscape and subscriber expectations.", imageSrc: "https://img.b2bpic.net/free-photo/working-office_1150-120.jpg", imageAlt: "2025 newsletter trends", authorName: "Emma Rodriguez", authorAvatar: "/placeholders/placeholder1.webp", date: "Jan 10, 2025"
}
]}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
carouselMode="buttons"
/>
</div>
<div id="testimonial" data-section="testimonial">
<TestimonialCardTwo
title="Loved by Subscribers"
description="See what our community has to say about their experience"
tag="Reviews"
tagIcon={Heart}
testimonials={[
{
id: "1", name: "Jessica Park", role: "Content Strategist", testimonial: "NewsHub transformed how I stay informed. The curated content saves me hours each week while keeping me ahead of industry trends.", imageSrc: "https://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-green-shirt_141793-122624.jpg", imageAlt: "Jessica Park"
},
{
id: "2", name: "Michael Torres", role: "Product Manager", testimonial: "The quality of articles is exceptional. I've discovered insights and perspectives I wouldn't have found anywhere else. Highly recommended!", imageSrc: "https://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", imageAlt: "Michael Torres"
},
{
id: "3", name: "Amanda Liu", role: "Marketing Director", testimonial: "Finally a newsletter that respects my time. Smart curation means I get exactly what I need without overwhelming information overload.", imageSrc: "https://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-black-t-shirt-isolated-pink-wall_141793-82450.jpg", imageAlt: "Amanda Liu"
},
{
id: "4", name: "David Kumar", role: "Startup Founder", testimonial: "The community aspect is what sets NewsHub apart. Engaging with other subscribers and experts has been incredibly valuable for my business.", imageSrc: "https://img.b2bpic.net/free-photo/smiling-man_1098-15443.jpg", imageAlt: "David Kumar"
}
]}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
carouselMode="buttons"
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
title="Choose Your Plan"
description="Select the perfect subscription to match your reading habits and interests"
tag="Pricing"
tagIcon={Zap}
plans={[
{
id: "free", badge: "Popular", badgeIcon: Sparkles,
price: "Free", subtitle: "Perfect for curious minds", buttons: [{ text: "Get Started", href: "#" }],
features: [
"5 articles per week", "Email delivery", "Basic filtering options", "Community access"
]
},
{
id: "pro", badge: "Most Popular", badgeIcon: Star,
price: "$12/mo", subtitle: "For avid readers", buttons: [{ text: "Subscribe Now", href: "#" }],
features: [
"Unlimited articles", "Priority email delivery", "Advanced filtering", "Exclusive webinars", "Offline reading", "Ad-free experience"
]
},
{
id: "premium", badge: "Ultimate Access", badgeIcon: Crown,
price: "$29/mo", subtitle: "For industry leaders", buttons: [{ text: "Go Premium", href: "#" }],
features: [
"Everything in Pro", "1-on-1 curator consultations", "Custom digest creation", "Analytics dashboard", "API access", "Priority support"
]
}
]}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
carouselMode="buttons"
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Frequently Asked Questions"
description="Find answers to common questions about NewsHub subscriptions and features"
tag="Help"
tagIcon={HelpCircle}
faqs={[
{
id: "1", title: "How often do you send newsletters?", content: "We send our main newsletter every Thursday morning with a curated selection of the week's best articles. Premium subscribers also receive daily briefings and special topic digests."
},
{
id: "2", title: "Can I cancel my subscription anytime?", content: "Absolutely! You can cancel your subscription at any time from your account settings. No questions asked, no cancellation fees. Your access continues until the end of your billing period."
},
{
id: "3", title: "What topics do you cover?", content: "We cover a wide range of topics including technology, business, marketing, design, and personal development. You can customize your interests in your preferences to receive content most relevant to you."
},
{
id: "4", title: "Is there a free trial for Pro?", content: "Yes! We offer a 14-day free trial of our Pro plan. No credit card required to start. Experience all premium features and decide if it's right for you."
},
{
id: "5", title: "Can I share my subscription?", content: "Subscriptions are for individual use. However, we offer family plans for up to 4 people at a discounted rate. Contact our support team for more information."
},
{
id: "6", title: "How do you curate articles?", content: "Our team of experienced editors manually reviews hundreds of sources daily. We apply strict quality standards to ensure every article adds value and matches our high editorial standards."
}
]}
textboxLayout="default"
useInvertedBackground="noInvert"
animationType="smooth"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Get Started"
tagIcon={Mail}
title="Ready to Transform Your Reading?"
description="Join thousands of subscribers who've revolutionized how they stay informed. Start your journey today and never miss a story that matters."
buttons={[
{ text: "Subscribe Free", href: "#" },
{ text: "Learn More", href: "#" }
]}
background={{ variant: "radial-gradient" }}
useInvertedBackground="noInvert"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="NewsHub"
copyrightText="© 2025 NewsHub | Thoughtful content, delivered daily"
socialLinks={[
{ icon: Twitter, href: "https://twitter.com/newshub", ariaLabel: "Twitter" },
{ icon: Linkedin, href: "https://linkedin.com/company/newshub", ariaLabel: "LinkedIn" },
{ icon: Mail, href: "mailto:hello@newshub.com", ariaLabel: "Email" }
]}
/>
</div>
</ThemeProvider>
);
}