diff --git a/src/app/page.tsx b/src/app/page.tsx index 25fa826..d1fbbcf 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -10,46 +10,39 @@ import TestimonialCardFifteen from "@/components/sections/testimonial/Testimonia import PricingCardEight from "@/components/sections/pricing/PricingCardEight"; import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal"; import ContactCenter from "@/components/sections/contact/ContactCenter"; -import { Zap, Shield, Rocket, Target, Sparkles, Crown, Mail, Users, Layers, Code } from "lucide-react"; +import { Zap, Shield, Rocket, Target, Sparkles, Crown, Mail, Users, Layers, Code, CreditCard, Smartphone, ShieldCheck, ArrowRightLeft, DollarSign, Wallet, Gem, Building, MessageCircle } from "lucide-react"; export default function SaasTemplatePage() { const navItems = [ - { name: "Features", id: "features" }, - { name: "Pricing", id: "pricing" }, + { name: "Services", id: "features" }, + { name: "Plans", id: "pricing" }, { name: "About", id: "about" }, - { name: "Contact", id: "contact" }, + { name: "Contact", id: "contact" } ]; const avatars = [ { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/luxury-travel-agency/testimonial/testimonial1.webp", alt: "User 1" }, { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/skincare/image5.avif", alt: "User 1" }, { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/skincare/image7.avif", alt: "User 1" }, - { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/skincare/image8.avif", alt: "User 1" }, + { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/skincare/image8.avif", alt: "User 1" } ]; const features: FeatureCard[] = [ { - bentoComponent: "globe", - title: "Global Reach", - description: "Connect with users worldwide through our distributed infrastructure", + bentoComponent: "globe", title: "Global Payments", description: "Send and receive money across borders with competitive rates and instant transfers." }, { - bentoComponent: "marquee", - variant: "text", - centerIcon: Zap, - texts: ["Fast", "Reliable", "Secure", "Scalable", "Modern"], - title: "Built for Speed", - description: "Lightning fast performance with optimized delivery", + bentoComponent: "marquee", variant: "text", centerIcon: Zap, + texts: ["Instant", "Secure", "Global", "Easy", "Smart"], + title: "Lightning-Fast Services", description: "Enjoy immediate transactions for bills, airtime, and data." }, { - bentoComponent: "3d-stack-cards", - items: [ + bentoComponent: "3d-stack-cards", items: [ { icon: Shield, title: "Security", subtitle: "Enterprise-grade", detail: "Bank-level encryption" }, { icon: Rocket, title: "Performance", subtitle: "99.9% uptime", detail: "Always available" }, - { icon: Target, title: "Accuracy", subtitle: "100% reliable", detail: "Data you can trust" }, + { icon: Target, title: "Accuracy", subtitle: "100% reliable", detail: "Data you can trust" } ], - title: "Built for Scale", - description: "Deploy to any region with automatic failover support", + title: "Secure & Compliant", description: "Industry-leading security protocols protect your transactions and data." } ]; @@ -58,196 +51,163 @@ export default function SaasTemplatePage() { console.log("Get Started clicked"), + text: "Start Free Now", onClick: () => console.log("Get Started clicked") }, { - text: "Learn More", - onClick: () => console.log("Learn More clicked"), - }, + text: "Explore Features", onClick: () => console.log("Learn More clicked") + } ]} marqueeItems={[ - { type: "text-icon", text: "Lightning Fast", icon: Zap }, - { type: "text-icon", text: "Enterprise Security", icon: Shield }, - { type: "text-icon", text: "99.9% Uptime", icon: Rocket }, - { type: "text-icon", text: "Precision Targeting", icon: Target }, - { type: "text-icon", text: "AI Powered", icon: Sparkles }, + { type: "text-icon", text: "Instant Payments", icon: Zap }, + { type: "text-icon", text: "Secure Transactions", icon: Shield }, + { type: "text-icon", text: "Always Available", icon: Rocket }, + { type: "text-icon", text: "Global Reach", icon: Target }, + { type: "text-icon", text: "Smart Financials", icon: Sparkles } ]} /> console.log("Starter clicked") }, + id: "starter", badge: "Basic", badgeIcon: Wallet, + price: "$0/month", subtitle: "Ideal for everyday transactions", buttons: [ + { text: "Get Started", onClick: () => console.log("Starter clicked") } ], features: [ - "Up to 5 projects", - "Basic analytics", - "24/7 email support", - "API access", - ], + "Unlimited Bills Payment", "Airtime & Data Top-ups", "Access to Gift Cards", "Standard Customer Support" + ] }, { - id: "pro", - badge: "Pro", - badgeIcon: Rocket, - price: "$49/mo", - subtitle: "For growing teams", - buttons: [ - { text: "Get Started", onClick: () => console.log("Pro clicked") }, + id: "pro", badge: "Premium", badgeIcon: Gem, + price: "$9.99/month", subtitle: "Enhance your financial experience", buttons: [ + { text: "Get Started", onClick: () => console.log("Pro clicked") } ], features: [ - "Unlimited projects", - "Advanced analytics", - "Priority support", - "Custom integrations", - "Team collaboration", - ], + "Everything in Basic", "Social Media Boosts", "Priority Customer Support", "Advanced Spending Analytics", "Exclusive Discounts" + ] }, { - id: "enterprise", - badge: "Enterprise", - badgeIcon: Crown, - price: "$99/mo", - subtitle: "For large organizations", - buttons: [ - { text: "Contact Sales", onClick: () => console.log("Enterprise clicked") }, + id: "enterprise", badge: "Business", badgeIcon: Building, + price: "Custom", subtitle: "Tailored for businesses", buttons: [ + { text: "Contact Sales", onClick: () => console.log("Enterprise clicked") } ], features: [ - "Everything in Pro", - "Dedicated account manager", - "Custom SLA", - "On-premise deployment", - "Advanced security", - ], - }, + "Everything in Premium", "Dedicated Account Manager", "Customizable Features", "Bulk Payment Solutions", "Fraud Prevention Suite" + ] + } ]} /> console.log("Email submitted:", email)} /> ); -} +} \ No newline at end of file diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index 76c7cc4..571f6aa 100644 --- a/src/app/styles/variables.css +++ b/src/app/styles/variables.css @@ -10,15 +10,15 @@ --accent: #ffffff; --background-accent: #ffffff; */ - --background: #050012; - --card: #040121; - --foreground: #f0e6ff; - --primary-cta: #c89bff; - --primary-cta-text: #050012; - --secondary-cta: #1d123b; - --secondary-cta-text: #f0e6ff; - --accent: #684f7b; - --background-accent: #65417c; + --background: #020617; + --card: #0f172a; + --foreground: #e2e8f0; + --primary-cta: #c4d8f9; + --primary-cta-text: #020617; + --secondary-cta: #041633; + --secondary-cta-text: #e2e8f0; + --accent: #2d30f3; + --background-accent: #1d4ed8; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);