Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0cc73c302a | |||
| 1b0c146b3f | |||
| 23f892cf18 | |||
| 875e76ca26 | |||
| 78e2d3dea0 |
@@ -8,19 +8,72 @@ import Tag from "@/tag/Tag";
|
||||
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
||||
|
||||
const halant = Halant({
|
||||
variable: "--font-halant",
|
||||
subsets: ["latin"],
|
||||
variable: "--font-halant", subsets: ["latin"],
|
||||
weight: ["300", "400", "500", "600", "700"],
|
||||
});
|
||||
|
||||
const inter = Inter({
|
||||
variable: "--font-inter",
|
||||
subsets: ["latin"],
|
||||
variable: "--font-inter", subsets: ["latin"],
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'SaaS Development Solutions | Build Your Next Product',
|
||||
description: 'Launch your innovative SaaS product faster with expert development services. From concept to deployment, we provide scalable, robust, and user-friendly solutions.',
|
||||
title: 'SaasApp - Build Modern Web Experiences',
|
||||
description: 'Create stunning, responsive SaaS websites with our comprehensive component library. Accelerate your product launch with scalable, secure, and performant solutions.',
|
||||
openGraph: {
|
||||
title: 'SaaS Development Solutions | Build Scalable Products | SaasApp',
|
||||
description: 'Launch innovative SaaS products faster with SaasApp\'s expert development services. Offering scalable, robust, and user-friendly solutions for modern web experiences.',
|
||||
url: 'https://www.saasapp.com',
|
||||
siteName: 'SaasApp',
|
||||
images: [
|
||||
{
|
||||
url: 'https://www.saasapp.com/og-image.jpg', // Replace with an actual Open Graph image URL
|
||||
width: 1200,
|
||||
height: 630,
|
||||
alt: 'SaasApp - SaaS Development Solutions',
|
||||
},
|
||||
],
|
||||
locale: 'en_US',
|
||||
type: 'website',
|
||||
},
|
||||
jsonLd: [
|
||||
{
|
||||
"@context": "https://schema.org", "@type": "Organization", "name": "SaasApp", "url": "https://www.saasapp.com", "logo": "https://www.saasapp.com/logo.png", "contactPoint": {
|
||||
"@type": "ContactPoint", "telephone": "+1-800-555-1234", // Replace with actual contact number
|
||||
"contactType": "customer service"
|
||||
}
|
||||
},
|
||||
{
|
||||
"@context": "https://schema.org", "@type": "SoftwareApplication", "name": "SaasApp", "operatingSystem": "Any", "applicationCategory": "DeveloperApplication", // More specific than general software
|
||||
"offers": {
|
||||
"@type": "Offer", "price": "0", // Assuming a free trial or entry-level free offering
|
||||
"priceCurrency": "USD", "availability": "https://schema.org/InStock"
|
||||
}
|
||||
},
|
||||
{
|
||||
"@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [
|
||||
{
|
||||
"@type": "Question", "name": "How does SaasApp ensure data security?", "acceptedAnswer": {
|
||||
"@type": "Answer", "text": "SaasApp employs bank-level encryption, regular security audits, and strict compliance protocols to protect your data. We ensure all data is securely stored and transmitted."
|
||||
}
|
||||
},
|
||||
{
|
||||
"@type": "Question", "name": "What kind of support can I expect with SaasApp?", "acceptedAnswer": {
|
||||
"@type": "Answer", "text": "We offer 24/7 email support for all plans, with priority support for Pro users and a dedicated account manager for Enterprise clients. Our comprehensive documentation and community forums are also available."
|
||||
}
|
||||
},
|
||||
{
|
||||
"@type": "Question", "name": "Can I customize SaasApp to fit my specific needs?", "acceptedAnswer": {
|
||||
"@type": "Answer", "text": "Yes, SaasApp is designed with a modular architecture and clean APIs, allowing for extensive customization and seamless integration with your existing workflows. Enterprise plans offer custom integrations."
|
||||
}
|
||||
},
|
||||
{
|
||||
"@type": "Question", "name": "Is there a free trial available for SaasApp?", "acceptedAnswer": {
|
||||
"@type": "Answer", "text": "Absolutely! All of our plans come with a 14-day free trial, allowing you to explore SaasApp's powerful features and see how it can accelerate your SaaS development."
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
|
||||
182
src/app/page.tsx
182
src/app/page.tsx
@@ -10,49 +10,50 @@ 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, MessageCircleMore } from "lucide-react";
|
||||
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
||||
|
||||
export default function SaasTemplatePage() {
|
||||
const navItems = [
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Pricing", 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 Reach", description: "Connect with users worldwide through our distributed infrastructure"
|
||||
},
|
||||
{
|
||||
bentoComponent: "marquee",
|
||||
variant: "text",
|
||||
centerIcon: Zap,
|
||||
bentoComponent: "marquee", variant: "text", centerIcon: Zap,
|
||||
texts: ["Fast", "Reliable", "Secure", "Scalable", "Modern"],
|
||||
title: "Built for Speed",
|
||||
description: "Lightning fast performance with optimized delivery",
|
||||
title: "Built for Speed", description: "Lightning fast performance with optimized delivery"
|
||||
},
|
||||
{
|
||||
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: "Built for Scale", description: "Deploy to any region with automatic failover support"
|
||||
}
|
||||
];
|
||||
|
||||
const faqItems = [
|
||||
{ id: "faq-1", title: "How does SaasApp ensure data security?", content: "SaasApp employs bank-level encryption, regular security audits, and strict compliance protocols to protect your data. We ensure all data is securely stored and transmitted." },
|
||||
{ id: "faq-2", title: "What kind of support can I expect with SaasApp?", content: "We offer 24/7 email support for all plans, with priority support for Pro users and a dedicated account manager for Enterprise clients. Our comprehensive documentation and community forums are also available." },
|
||||
{ id: "faq-3", title: "Can I customize SaasApp to fit my specific needs?", content: "Yes, SaasApp is designed with a modular architecture and clean APIs, allowing for extensive customization and seamless integration with your existing workflows. Enterprise plans offer custom integrations." },
|
||||
{ id: "faq-4", title: "Is there a free trial available for SaasApp?", content: "Absolutely! All of our plans come with a 14-day free trial, allowing you to explore SaasApp's powerful features and see how it can accelerate your SaaS development." }
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider defaultButtonVariant="hover-bubble" defaultTextAnimation="entrance-slide" borderRadius="pill" contentWidth="medium" sizing="medium" background="none" cardStyle="gradient-bordered" primaryButtonStyle="primary-glow" secondaryButtonStyle="layered" headingFontWeight="medium">
|
||||
<ReactLenis root>
|
||||
@@ -64,65 +65,59 @@ export default function SaasTemplatePage() {
|
||||
<HeroCentered
|
||||
background={{ variant: "rotated-rays-animated-grid" }}
|
||||
avatars={avatars}
|
||||
avatarText="Trusted by 1000+ users"
|
||||
title="Build Modern Web Experiences-Out of the world california apple"
|
||||
description="Create stunning, responsive websites with our comprehensive component library designed"
|
||||
avatarText="Trusted by 1000+ SaaS innovators"
|
||||
title="Build Modern Web Experiences with SaasApp - Your Go-To SaaS Development Partner"
|
||||
description="Create stunning, responsive SaaS websites with our comprehensive component library. Accelerate your product launch with scalable, secure, and performant solutions."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
onClick: () => console.log("Get Started clicked"),
|
||||
text: "Get Started", onClick: () => console.log("Get Started clicked")
|
||||
},
|
||||
{
|
||||
text: "Learn More",
|
||||
onClick: () => console.log("Learn More clicked"),
|
||||
},
|
||||
text: "Learn More", 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: "AI Powered", icon: Sparkles }
|
||||
]}
|
||||
/>
|
||||
<FeatureBento
|
||||
features={features}
|
||||
animationType="none"
|
||||
tag="Features"
|
||||
title="Powerful Features"
|
||||
description="Everything you need to build and scale your product"
|
||||
title="Powerful SaaS Development Features for Rapid Growth"
|
||||
description="Everything you need to build, deploy, and scale your SaaS product with unparalleled efficiency and innovation."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
<FeatureBorderGlow
|
||||
tag="Why Choose Us"
|
||||
tagIcon={Users}
|
||||
title="Built by developers, for developers"
|
||||
description="We understand the challenges of modern software development because we face them every day."
|
||||
title="Why Choose SaasApp: Built by Developers, for SaaS Innovators"
|
||||
description="We understand the unique challenges of modern SaaS development because we build and scale our own products daily."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
icon: Layers,
|
||||
title: "Modular Architecture",
|
||||
description: "Build with composable components that scale with your needs",
|
||||
title: "Modular Architecture", description: "Build with composable components that scale with your needs"
|
||||
},
|
||||
{
|
||||
icon: Code,
|
||||
title: "Developer Experience",
|
||||
description: "Clean APIs and comprehensive documentation for faster development",
|
||||
title: "Developer Experience", description: "Clean APIs and comprehensive documentation for faster development"
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Enterprise Security",
|
||||
description: "Bank-level encryption and compliance with industry standards",
|
||||
title: "Enterprise Security", description: "Bank-level encryption and compliance with industry standards"
|
||||
},
|
||||
{
|
||||
icon: Rocket,
|
||||
title: "Lightning Fast",
|
||||
description: "Optimized for performance with sub-second response times",
|
||||
},
|
||||
title: "Lightning Fast", description: "Optimized for performance with sub-second response times"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
<TestimonialCardFifteen
|
||||
@@ -137,69 +132,60 @@ export default function SaasTemplatePage() {
|
||||
<PricingCardEight
|
||||
tag="Pricing"
|
||||
tagIcon={Sparkles}
|
||||
title="Simple, transparent pricing"
|
||||
description="Choose the plan that works best for you. All plans include a 14-day free trial."
|
||||
title="Flexible SaaS Pricing Plans for Every Stage of Your Journey"
|
||||
description="Choose the ideal plan to power your SaaS growth. All plans include a 14-day free trial and robust support."
|
||||
animationType="opacity"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "starter",
|
||||
badge: "Starter",
|
||||
badgeIcon: Zap,
|
||||
price: "$19/mo",
|
||||
subtitle: "Perfect for individuals",
|
||||
buttons: [
|
||||
{ text: "Get Started", onClick: () => console.log("Starter clicked") },
|
||||
id: "starter", badge: "Starter", badgeIcon: Zap,
|
||||
price: "$19/mo", subtitle: "Perfect for individuals", buttons: [
|
||||
{ text: "Get Started", onClick: () => console.log("Starter clicked") }
|
||||
],
|
||||
features: [
|
||||
"Up to 5 projects",
|
||||
"Basic analytics",
|
||||
"24/7 email support",
|
||||
"API access",
|
||||
],
|
||||
"Up to 5 projects", "Basic analytics", "24/7 email support", "API access"
|
||||
]
|
||||
},
|
||||
{
|
||||
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: "Pro", badgeIcon: Rocket,
|
||||
price: "$49/mo", subtitle: "For growing teams", buttons: [
|
||||
{ text: "Get Started", onClick: () => console.log("Pro clicked") }
|
||||
],
|
||||
features: [
|
||||
"Unlimited projects",
|
||||
"Advanced analytics",
|
||||
"Priority support",
|
||||
"Custom integrations",
|
||||
"Team collaboration",
|
||||
],
|
||||
"Unlimited projects", "Advanced analytics", "Priority support", "Custom integrations", "Team collaboration"
|
||||
]
|
||||
},
|
||||
{
|
||||
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: "Enterprise", badgeIcon: Crown,
|
||||
price: "$99/mo", subtitle: "For large organizations", 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 Pro", "Dedicated account manager", "Custom SLA", "On-premise deployment", "Advanced security"
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
faqs={faqItems}
|
||||
title="Frequently Asked Questions about SaasApp"
|
||||
description="Find answers to common questions about SaasApp's features, pricing, and support."
|
||||
tag="FAQ"
|
||||
tagIcon={MessageCircleMore}
|
||||
faqsAnimation="slide-up"
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/fintech/image12.avif"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<ContactCenter
|
||||
tag="Contact"
|
||||
tagIcon={Mail}
|
||||
title="Ready to get started?"
|
||||
description="Join thousands of developers building better products with our platform."
|
||||
title="Ready to Accelerate Your SaaS Product Development?"
|
||||
description="Join thousands of successful SaaS founders and developers building better products with our platform today."
|
||||
background={{ variant: "animated-grid" }}
|
||||
useInvertedBackground={false}
|
||||
inputPlaceholder="Enter your email"
|
||||
@@ -207,45 +193,41 @@ export default function SaasTemplatePage() {
|
||||
onSubmit={(email) => console.log("Email submitted:", email)}
|
||||
/>
|
||||
<FooterBaseReveal
|
||||
logoText="SaaSify"
|
||||
logoText="SaasApp"
|
||||
columns={[
|
||||
{
|
||||
title: "Product",
|
||||
items: [
|
||||
title: "Product", items: [
|
||||
{ label: "Features", href: "#features" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
{ label: "Integrations", href: "#" },
|
||||
{ label: "Changelog", href: "#" },
|
||||
],
|
||||
{ label: "Changelog", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Blog", href: "#" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
title: "Resources", items: [
|
||||
{ label: "Documentation", href: "#" },
|
||||
{ label: "Help Center", href: "#" },
|
||||
{ label: "Community", href: "#" },
|
||||
{ label: "Status", href: "#" },
|
||||
],
|
||||
{ label: "Status", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy", href: "#" },
|
||||
{ label: "Terms", href: "#" },
|
||||
{ label: "Security", href: "#" },
|
||||
],
|
||||
},
|
||||
{ label: "Security", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
copyrightText="2024 SaasApp. All rights reserved."
|
||||
copyrightText="© 2024 SaasApp. All rights reserved."
|
||||
/>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
|
||||
@@ -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: #000000;
|
||||
--card: #0c0c0c;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #cee7ff;
|
||||
--primary-cta-text: #000000;
|
||||
--secondary-cta: #000000;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #535353;
|
||||
--background-accent: #CEE7FF;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user