Files
bb0ee7d6-a00a-4ae0-b731-087…/src/app/page.tsx
2026-03-11 02:15:16 +00:00

228 lines
12 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroCarouselLogo from "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo";
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import Link from "next/link";
import { Star, Rocket } from "lucide-react";
export default function HomePage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="fluid"
cardStyle="glass-elevated"
primaryButtonStyle="shadow"
secondaryButtonStyle="layered"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="ANLY"
navItems={[
{ name: "Templates", id: "templates" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
]}
button={{
text: "Browse Templates", href: "/templates"}}
animateOnLoad={true}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="ANLY"
description="Professional Website Templates, Built for Business. Choose your template, select your service level, and launch in minutes."
buttons={[
{ text: "Launch Your Website", href: "/templates" },
{ text: "View Pricing", href: "#pricing" },
]}
slides={[
{
imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-with-photo_23-2148248047.jpg", imageAlt: "Portfolio template showcase"},
{
imageSrc: "http://img.b2bpic.net/free-vector/business-landing-page-with-photo_23-2148293486.jpg", imageAlt: "Business website template"},
{
imageSrc: "http://img.b2bpic.net/free-vector/healthy-restaurant-landing-page-template_23-2148757974.jpg", imageAlt: "Restaurant template showcase"},
]}
autoplayDelay={5000}
showDimOverlay={true}
/>
</div>
<div id="features" data-section="features">
<FeatureCardSeven
title="How ANLY Works"
description="Three simple steps to launch your professional website"
tag="Easy Process"
textboxLayout="default"
useInvertedBackground={false}
animationType="blur-reveal"
features={[
{
id: 1,
title: "Choose Your Template", description:
"Browse 50+ professionally designed templates across portfolio, business, restaurant, and agency categories. Filter by style, industry, and features to find your perfect match.", imageSrc: "http://img.b2bpic.net/free-psd/flat-design-landing-page-gardening-template_23-2149357558.jpg", imageAlt: "Template selection interface"},
{
id: 2,
title: "Select Your Service Level", description:
"Pick from Template Only, Template + Setup, or Customized Template options. Choose your editing subscription tier based on your customization needs.", imageSrc: "http://img.b2bpic.net/free-vector/flat-business-infographic-with-photo_23-2148228064.jpg", imageAlt: "Service tier selection"},
{
id: 3,
title: "Launch & Customize", description:
"Get instant access to your template with our editing tools. Use our subscription service for ongoing customizations or manage edits yourself through our intuitive interface.", imageSrc: "http://img.b2bpic.net/free-vector/content-management-system-home-page_23-2148811885.jpg", imageAlt: "Website customization interface"},
]}
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
title="Trusted by Thousands"
description="Join freelancers, agencies, and small business owners using ANLY templates"
tag="Social Proof"
textboxLayout="default"
useInvertedBackground={false}
names={[
"Freelance Creative Co", "TechFlow Agencies", "BuildMore Studios", "DesignHub Pro", "StartUp Launch", "Portfolio Masters", "Business Growth Inc", "Web Innovation Lab"]}
speed={40}
showCard={true}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardThree
title="Subscription Tiers"
description="Flexible editing subscriptions to match your customization needs"
tag="Pricing Plans"
textboxLayout="default"
useInvertedBackground={false}
animationType="scale-rotate"
plans={[
{
id: "basic", price: "$29/year", name: "Basic", features: [
"5 edits per year", "Email support", "Template library access", "Basic customization tools"],
buttons: [
{ text: "Get Started", href: "/contact" },
{ text: "Learn More", href: "#" },
],
},
{
id: "standard", badge: "Most Popular", badgeIcon: Star,
price: "$59/year", name: "Standard", features: [
"10 edits per year", "Priority email support", "Template library access", "Advanced customization", "Analytics dashboard"],
buttons: [
{ text: "Get Started", href: "/contact" },
{ text: "Learn More", href: "#" },
],
},
{
id: "premium", price: "$149/year", name: "Premium", features: [
"Unlimited edits", "24/7 priority support", "Template library access", "Custom design requests", "Advanced analytics", "White-label options"],
buttons: [
{ text: "Get Started", href: "/contact" },
{ text: "Learn More", href: "#" },
],
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
title="What Our Users Say"
description="Real feedback from creators, agencies, and business owners who've launched with ANLY"
tag="Testimonials"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
testimonials={[
{
id: "1", name: "Sarah Johnson", role: "Freelance Designer", company: "Creative Collective", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-professional-business-woman-suit_23-2148603020.jpg", imageAlt: "Sarah Johnson"},
{
id: "2", name: "Michael Chen", role: "Agency Owner", company: "TechFlow Designs", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-suit-looking-camera_23-2148112202.jpg", imageAlt: "Michael Chen"},
{
id: "3", name: "Emily Rodriguez", role: "Restaurant Owner", company: "Modern Bistro Group", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-businesswoman-holding-diary-looking-camera-workplace_23-2148187204.jpg", imageAlt: "Emily Rodriguez"},
{
id: "4", name: "David Kim", role: "Small Business Owner", company: "StartUp Ventures", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5353.jpg", imageAlt: "David Kim"},
]}
kpiItems={[
{ value: "2500+", label: "Active Users" },
{ value: "98%", label: "Satisfaction Rate" },
{ value: "50+", label: "Template Library" },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Frequently Asked Questions"
description="Everything you need to know about ANLY templates and services"
tag="Help & Support"
textboxLayout="default"
useInvertedBackground={false}
faqsAnimation="blur-reveal"
faqs={[
{
id: "1", title: "What's included in each template?", content:
"Every template includes a fully responsive design, SEO optimization, contact forms, social media integration, and access to our editing tools. Additional features vary by template type and tier."},
{
id: "2", title: "Can I customize the templates?", content:
"Yes! All templates are fully customizable. You can edit content, colors, fonts, and layout using our intuitive interface. Premium subscribers get unlimited edits and priority support for customizations."},
{
id: "3", title: "Do I need coding knowledge?", content:
"Not at all! Our templates and editing tools are designed for non-technical users. Everything is drag-and-drop, making it easy for anyone to create and maintain a professional website."},
{
id: "4", title: "What are the subscription tiers for?", content:
"Subscriptions cover editing services. Basic includes 5 edits/year, Standard includes 10 edits/year, and Premium includes unlimited edits with priority support. You can purchase templates separately or bundled with subscriptions."},
{
id: "5", title: "Can agencies use these templates for clients?", content:
"Yes! Our Professional & Agencies tier includes white-label options, making templates perfect for reselling to your clients. Volume pricing is available for agencies using multiple templates."},
{
id: "6", title: "What payment methods do you accept?", content:
"We accept all major credit cards, PayPal, and offer monthly billing options. Enterprise customers can arrange custom payment terms. All transactions are secure and encrypted."},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get Started"
title="Ready to Launch Your Professional Website?"
description="Join thousands of freelancers, agencies, and businesses already using ANLY templates. Browse templates, customize with ease, and launch today."
tagIcon={Rocket}
background={{ variant: "rotated-rays-animated-grid" }}
useInvertedBackground={false}
inputPlaceholder="Enter your email"
buttonText="Browse Templates"
termsText="By signing up, you agree to our Terms and Conditions. We respect your privacy and will only send template updates and special offers."
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="ANLY"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}