493 lines
25 KiB
TypeScript
493 lines
25 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
|
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
|
|
import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
|
|
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
|
|
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
|
|
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
|
|
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
|
import FaqBase from "@/components/sections/faq/FaqBase";
|
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
|
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
|
|
import Link from "next/link";
|
|
import { Shield, Lock, Leaf, BarChart3, CreditCard, Users, HelpCircle, Mail, CheckCircle, Sparkles } from "lucide-react";
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="blurBottom"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="bold"
|
|
>
|
|
{/* Navbar */}
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Xenon"
|
|
navItems={[
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Security", id: "about" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "FAQ", id: "faq" },
|
|
]}
|
|
button={{
|
|
text: "Get Started", href: "https://app.xenon.io"
|
|
}}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
{/* Hero Section */}
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDoubleCarousel
|
|
title="Your Privacy, Encrypted and Protected"
|
|
description="Store, manage, and secure your most important documents with enterprise-grade encryption. Xenon ensures your sensitive data remains confidential and accessible only to you."
|
|
tag="Secure by Design"
|
|
tagIcon={Shield}
|
|
tagAnimation="opacity"
|
|
background={{ variant: "glowing-orb" }}
|
|
leftCarouselItems={[
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/modern-encryption-algorithm-visualizatio-1772794803538-1013a3cd.png", imageAlt: "End-to-end encryption interface"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/multi-factor-authentication-dashboard-sh-1772794803619-2d8790c2.png", imageAlt: "Multi-factor authentication dashboard"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/digital-vault-interface-showing-secure-d-1772794804006-7c1122f3.png", imageAlt: "Secure document vault"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/automatic-backup-and-disaster-recovery-s-1772794805542-ac9eb48f.png", imageAlt: "Automatic backup system"
|
|
},
|
|
]}
|
|
rightCarouselItems={[
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/clean-user-dashboard-showing-document-ov-1772794804069-612c47d0.png", imageAlt: "User dashboard interface"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/secure-document-sharing-interface-showin-1772794804367-a783a314.png", imageAlt: "Secure document sharing"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/compliance-certifications-display-showin-1772794804112-4f652ce0.png", imageAlt: "Compliance certifications"
|
|
},
|
|
{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/activity-monitoring-and-audit-trail-syst-1772794803745-4b375e1c.png", imageAlt: "Activity monitoring system"
|
|
},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Start Free Trial", href: "https://app.xenon.io/signup"
|
|
},
|
|
{
|
|
text: "Learn More", href: "#features"
|
|
},
|
|
]}
|
|
buttonAnimation="opacity"
|
|
carouselPosition="right"
|
|
ariaLabel="Xenon secure document storage hero section"
|
|
/>
|
|
</div>
|
|
|
|
{/* Features Section */}
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTen
|
|
title="Enterprise-Grade Security Features"
|
|
description="Comprehensive tools designed to protect your sensitive documents and personal information with military-level encryption and compliance standards."
|
|
tag="Advanced Protection"
|
|
tagIcon={Lock}
|
|
tagAnimation="opacity"
|
|
features={[
|
|
{
|
|
id: "1", title: "End-to-End Encryption", description:
|
|
"All documents are encrypted on your device before being transmitted. Only you control the decryption keys.", media: {
|
|
imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/advanced-encryption-process-visualizatio-1772794804177-a97e401f.png"
|
|
},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "AES-256 bit encryption"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Zero-knowledge architecture"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Automatic key rotation"
|
|
},
|
|
],
|
|
reverse: false,
|
|
},
|
|
{
|
|
id: "2", title: "Multi-Factor Authentication", description:
|
|
"Add multiple layers of security with biometric, SMS, and authenticator app options to protect your account.", media: {
|
|
imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/multi-factor-authentication-system-showi-1772794803438-bb541452.png"
|
|
},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Biometric fingerprint recognition"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Time-based one-time passwords"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "SMS and email verification"
|
|
},
|
|
],
|
|
reverse: true,
|
|
},
|
|
{
|
|
id: "3", title: "Secure Sharing & Access Control", description:
|
|
"Share documents with fine-grained permissions. Set expiration dates, revoke access instantly, and track who accesses your files.", media: {
|
|
imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/secure-document-sharing-dashboard-with-g-1772794804161-ec44d0cd.png"
|
|
},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Granular permission controls"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Time-limited access links"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Activity logging and audit trails"
|
|
},
|
|
],
|
|
reverse: false,
|
|
},
|
|
{
|
|
id: "4", title: "Automated Backups & Recovery", description:
|
|
"Your documents are automatically backed up across multiple secure data centers. Restore any version instantly.", media: {
|
|
imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/automated-backup-system-showing-continuo-1772794806298-9a9a5a9e.png"
|
|
},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Continuous automatic backups"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Geographic redundancy"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "99.9% uptime guarantee"
|
|
},
|
|
],
|
|
reverse: true,
|
|
},
|
|
{
|
|
id: "5", title: "Compliance & Certifications", description:
|
|
"Meet regulatory requirements with our compliance framework supporting GDPR, HIPAA, SOC 2, and ISO 27001.", media: {
|
|
imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/compliance-framework-dashboard-showing-g-1772794805018-00143a9d.png"
|
|
},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "GDPR compliant data handling"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "HIPAA ready for healthcare"
|
|
},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "SOC 2 Type II certified"
|
|
},
|
|
],
|
|
reverse: false,
|
|
},
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* About Section */}
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
tag="Our Mission"
|
|
tagIcon={Leaf}
|
|
tagAnimation="opacity"
|
|
title="Privacy is a Fundamental Right"
|
|
description="Xenon was founded on the principle that everyone deserves privacy and security. We've built the most trustworthy platform for storing sensitive documents and personal data, used by individuals and enterprises worldwide."
|
|
metrics={[
|
|
{
|
|
value: "500K+", title: "Users Worldwide"
|
|
},
|
|
{
|
|
value: "2B+", title: "Documents Secured"
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/modern-office-environment-with-diverse-t-1772794803600-d4e1377c.png"
|
|
imageAlt="Xenon mission and values"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* Metrics Section */}
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardTwo
|
|
title="Security By The Numbers"
|
|
description="Industry-leading security metrics demonstrating our commitment to protection"
|
|
tag="Performance"
|
|
tagIcon={BarChart3}
|
|
tagAnimation="opacity"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "256-Bit", description: "Military-Grade Encryption"
|
|
},
|
|
{
|
|
id: "2", value: "99.99%", description: "Uptime Guarantee"
|
|
},
|
|
{
|
|
id: "3", value: "4", description: "Geographic Datacenters"
|
|
},
|
|
{
|
|
id: "4", value: "0ms", description: "Zero-Knowledge Access"
|
|
},
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* Pricing Section */}
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
title="Flexible Plans for Every Need"
|
|
description="Choose the perfect plan to secure your documents. All plans include core encryption and security features."
|
|
tag="Transparent Pricing"
|
|
tagIcon={CreditCard}
|
|
tagAnimation="opacity"
|
|
plans={[
|
|
{
|
|
id: "personal", tag: "Personal Plan", price: "$9.99", period: "/month", description:
|
|
"Perfect for individuals wanting personal data security.", button: {
|
|
text: "Get Started", href: "https://app.xenon.io/signup?plan=personal"
|
|
},
|
|
featuresTitle: "What's Included:", features: [
|
|
"100 GB encrypted storage", "End-to-end encryption", "Multi-factor authentication", "Secure sharing with time limits", "Mobile apps (iOS & Android)", "Email support"
|
|
],
|
|
},
|
|
{
|
|
id: "professional", tag: "Professional Plan", tagIcon: Sparkles,
|
|
price: "$29.99", period: "/month", description:
|
|
"Ideal for professionals managing multiple document projects.", button: {
|
|
text: "Start Free Trial", href: "https://app.xenon.io/signup?plan=professional"
|
|
},
|
|
featuresTitle: "What's Included:", features: [
|
|
"1 TB encrypted storage", "Everything in Personal, plus:", "Advanced audit logging", "Team collaboration (up to 5 members)", "Custom expiration policies", "Priority email & chat support", "API access"
|
|
],
|
|
},
|
|
{
|
|
id: "enterprise", tag: "Enterprise Plan", price: "Custom", period: "/billed annually", description:
|
|
"Unlimited security and compliance for large organizations.", button: {
|
|
text: "Contact Sales", href: "/contact"
|
|
},
|
|
featuresTitle: "What's Included:", features: [
|
|
"Unlimited encrypted storage", "Everything in Professional, plus:", "Dedicated account manager", "Custom compliance configurations", "SSO & SAML integration", "Advanced threat detection", "24/7 phone & email support", "99.99% SLA guarantee"
|
|
],
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* Testimonials Section */}
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
title="Trusted by Thousands"
|
|
description="See how individuals and organizations use Xenon to protect their most important information."
|
|
tag="User Stories"
|
|
tagIcon={Users}
|
|
tagAnimation="opacity"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Mitchell", role: "Healthcare Administrator", testimonial:
|
|
"Xenon gives us peace of mind knowing patient records are encrypted and compliant. The audit trails help us meet HIPAA requirements effortlessly.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-female-health-1772794804232-a2d87178.png", imageAlt: "Sarah Mitchell"
|
|
},
|
|
{
|
|
id: "2", name: "James Chen", role: "Legal Professional", testimonial:
|
|
"The security features and granular access controls make sharing confidential documents with clients worry-free. It's become essential to our practice.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-male-lawyer-i-1772794803515-f7afc858.png", imageAlt: "James Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Maria Rodriguez", role: "Finance Manager", testimonial:
|
|
"We store sensitive financial records without concern. Xenon's automatic backups and disaster recovery have saved us multiple times.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-female-financ-1772794802650-7deab746.png", imageAlt: "Maria Rodriguez"
|
|
},
|
|
{
|
|
id: "4", name: "David Kim", role: "IT Director", testimonial:
|
|
"Implementing Xenon across our organization was smooth. The compliance certifications and SSO integration aligned perfectly with our security policies.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-male-it-direc-1772794803490-0a179421.png", imageAlt: "David Kim"
|
|
},
|
|
{
|
|
id: "5", name: "Elena Rossi", role: "Small Business Owner", testimonial:
|
|
"As a solo entrepreneur, I needed enterprise-grade security without the enterprise cost. Xenon is exactly what I was looking for.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-female-busine-1772794802624-3e70eff9.png", imageAlt: "Elena Rossi"
|
|
},
|
|
{
|
|
id: "6", name: "Robert Thompson", role: "Compliance Officer", testimonial:
|
|
"Xenon's built-in compliance features make our audit processes straightforward. It demonstrates our commitment to data protection to regulators.", imageSrc:
|
|
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/professional-headshot-of-a-male-complian-1772794803158-30cde223.png", imageAlt: "Robert Thompson"
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* FAQ Section */}
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
title="Frequently Asked Questions"
|
|
description="Get answers to common questions about Xenon's security, pricing, and features."
|
|
tag="Support"
|
|
tagIcon={HelpCircle}
|
|
tagAnimation="opacity"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "How secure is Xenon?", content:
|
|
"Xenon uses military-grade AES-256 encryption with a zero-knowledge architecture. This means we cannot access your documents—only you hold the decryption keys. All data is encrypted before transmission and stored encrypted in our secure data centers."
|
|
},
|
|
{
|
|
id: "2", title: "Can I share documents securely with others?", content:
|
|
"Yes. You can generate secure share links with granular permissions (view-only, download, edit). Set expiration dates and revoke access instantly. All shared documents remain end-to-end encrypted, and we track every access."
|
|
},
|
|
{
|
|
id: "3", title: "What happens if I forget my password?", content:
|
|
"For security reasons, we cannot recover encrypted documents if you lose your master password. However, you can set up recovery keys during setup. We strongly recommend using multi-factor authentication to protect your account."
|
|
},
|
|
{
|
|
id: "4", title: "Is Xenon compliant with GDPR and HIPAA?", content:
|
|
"Yes. Xenon is GDPR compliant for EU data protection and HIPAA-ready for healthcare organizations. We also maintain SOC 2 Type II and ISO 27001 certifications. Enterprise customers can customize compliance configurations."
|
|
},
|
|
{
|
|
id: "5", title: "Can I access my documents offline?", content:
|
|
"With our mobile and desktop apps, you can cache encrypted documents locally for offline access. Changes sync automatically when you reconnect to the internet."
|
|
},
|
|
{
|
|
id: "6", title: "How do I migrate from another service?", content:
|
|
"We provide import tools for common document formats and cloud storage services. Our support team can assist with large migrations. Contact us for enterprise migration support at support@xenon.io."
|
|
},
|
|
{
|
|
id: "7", title: "What's your data retention policy?", content:
|
|
"You retain full control over your data. Upon account deletion, your documents are permanently deleted from all servers within 30 days. We maintain encrypted backups for disaster recovery."
|
|
},
|
|
{
|
|
id: "8", title: "Do you offer API access?", content:
|
|
"Yes, Professional and Enterprise plans include API access for integrating Xenon with your applications. Contact sales for detailed API documentation and integration support."
|
|
},
|
|
]}
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="smooth"
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
{/* Contact/Newsletter Section */}
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Stay Updated"
|
|
title="Join Our Security Community"
|
|
description="Subscribe to our newsletter for security tips, feature updates, and exclusive access to new Xenon capabilities."
|
|
tagIcon={Mail}
|
|
tagAnimation="opacity"
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZKb1tD5apiUPcUpIwNTqomAIY/newsletter-signup-interface-with-email-i-1772794803353-c32dd791.png"
|
|
imageAlt="Newsletter signup"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email address"
|
|
buttonText="Subscribe Now"
|
|
termsText="We respect your privacy. Unsubscribe anytime. By subscribing, you agree to our Terms and Privacy Policy."
|
|
/>
|
|
</div>
|
|
|
|
{/* Footer */}
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Xenon"
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{ label: "Features", href: "#features" },
|
|
{ label: "Security", href: "#about" },
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "Mobile Apps", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "/" },
|
|
{ label: "Blog", href: "/" },
|
|
{ label: "Careers", href: "/" },
|
|
{ label: "Contact", href: "/contact" },
|
|
],
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "/" },
|
|
{ label: "Terms of Service", href: "/" },
|
|
{ label: "Cookie Policy", href: "/" },
|
|
{ label: "Compliance", href: "/" },
|
|
],
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{ label: "Documentation", href: "/" },
|
|
{ label: "API Reference", href: "/" },
|
|
{ label: "Security Status", href: "https://status.xenon.io" },
|
|
{ label: "Support Center", href: "/" },
|
|
],
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{
|
|
label: "Twitter", href: "https://twitter.com/xenonsecure"
|
|
},
|
|
{
|
|
label: "LinkedIn", href: "https://linkedin.com/company/xenon-security"
|
|
},
|
|
{ label: "GitHub", href: "https://github.com/xenon-security" },
|
|
{ label: "Discord", href: "https://discord.gg/xenon" },
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2025 Xenon. All rights reserved. Your privacy is our priority."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |