Merge version_1 into main #1
454
src/app/page.tsx
454
src/app/page.tsx
@@ -20,323 +20,165 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Verification",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Security",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Help",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Support",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="AliSecurity"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Verification", id: "hero" },
|
||||
{ name: "Security", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Help", id: "faq" },
|
||||
{ name: "Support", id: "contact" },
|
||||
]}
|
||||
brandName="AliSecurity"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Secure Verification Portal"
|
||||
description="We have detected unusual traffic from your network. Please slide to verify your identity to ensure safe and continuous access to our services."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Verification",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cybersecurity-digital-padlock-protection-concept_23-2152004113.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-monitoring-company-systems-using-notebook-while-standing-office_482257-124884.jpg",
|
||||
alt: "Secure user 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-94558.jpg",
|
||||
alt: "Secure user 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-121538.jpg",
|
||||
alt: "Secure user 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/employee-using-ai-technology-design-machine-learning-algorithms_482257-107566.jpg",
|
||||
alt: "Secure user 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/apply-voucher-code-starting-download_53876-134031.jpg",
|
||||
alt: "Secure user 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 50,000+ verified users"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "ISO 27001 Certified",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "256-bit Encryption",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Real-time Monitoring",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "GDPR Compliant",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Verified Access",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{ variant: "plain" }}
|
||||
title="Secure Verification Portal"
|
||||
description="We have detected unusual traffic from your network. Please slide to verify your identity to ensure safe and continuous access to our services."
|
||||
buttons={[{ text: "Start Verification", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cybersecurity-digital-padlock-protection-concept_23-2152004113.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/man-monitoring-company-systems-using-notebook-while-standing-office_482257-124884.jpg", alt: "Secure user 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-94558.jpg", alt: "Secure user 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-121538.jpg", alt: "Secure user 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/employee-using-ai-technology-design-machine-learning-algorithms_482257-107566.jpg", alt: "Secure user 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/apply-voucher-code-starting-download_53876-134031.jpg", alt: "Secure user 5" },
|
||||
]}
|
||||
avatarText="Trusted by 50,000+ verified users"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "ISO 27001 Certified" },
|
||||
{ type: "text", text: "256-bit Encryption" },
|
||||
{ type: "text", text: "Real-time Monitoring" },
|
||||
{ type: "text", text: "GDPR Compliant" },
|
||||
{ type: "text", text: "Verified Access" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Why Verification is Necessary"
|
||||
description="Protecting our network from unusual traffic patterns ensures that all users experience consistent speed and security. This verification step identifies human users from automated bot systems."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Secure Transactions",
|
||||
description: "Ensure your data remains protected from unauthorized access.",
|
||||
},
|
||||
{
|
||||
title: "Bot Prevention",
|
||||
description: "Distinguish genuine users from malicious automated scripts.",
|
||||
},
|
||||
{
|
||||
title: "Network Stability",
|
||||
description: "Reduce server load to provide a seamless browsing experience.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/enjoyment-activities-festivities-movies-pastime_53876-21360.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Why Verification is Necessary"
|
||||
description="Protecting our network from unusual traffic patterns ensures that all users experience consistent speed and security. This verification step identifies human users from automated bot systems."
|
||||
bulletPoints={[
|
||||
{ title: "Secure Transactions", description: "Ensure your data remains protected from unauthorized access." },
|
||||
{ title: "Bot Prevention", description: "Distinguish genuine users from malicious automated scripts." },
|
||||
{ title: "Network Stability", description: "Reduce server load to provide a seamless browsing experience." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/enjoyment-activities-festivities-movies-pastime_53876-21360.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Advanced Traffic Filtering",
|
||||
description: "Intelligent nodes filter out suspicious bots from real traffic.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/data-analytics-dashboard_23-2152001529.jpg",
|
||||
},
|
||||
{
|
||||
title: "Data Encryption",
|
||||
description: "Every interaction is protected with industry-standard encryption.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-lock-with-digital-particles_23-2152004084.jpg",
|
||||
},
|
||||
{
|
||||
title: "Privacy Compliance",
|
||||
description: "Full compliance with global digital privacy standards.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-data-protection-concepts_23-2152001154.jpg",
|
||||
},
|
||||
]}
|
||||
title="Core Security Technologies"
|
||||
description="Advanced systems protecting your digital footprint every step of the way."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Advanced Traffic Filtering", description: "Intelligent nodes filter out suspicious bots from real traffic.", imageSrc: "http://img.b2bpic.net/free-photo/data-analytics-dashboard_23-2152001529.jpg" },
|
||||
{ title: "Data Encryption", description: "Every interaction is protected with industry-standard encryption.", imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-lock-with-digital-particles_23-2152004084.jpg" },
|
||||
{ title: "Privacy Compliance", description: "Full compliance with global digital privacy standards.", imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-data-protection-concepts_23-2152001154.jpg" },
|
||||
]}
|
||||
title="Core Security Technologies"
|
||||
description="Advanced systems protecting your digital footprint every step of the way."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"CloudScale",
|
||||
"SecureNet",
|
||||
"DataFlow",
|
||||
"ArmorCloud",
|
||||
"WebGuard",
|
||||
"TrafficOps",
|
||||
"CyberLink",
|
||||
]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Global brands rely on our security standards to keep their customers safe."
|
||||
/>
|
||||
</div>
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["CloudScale", "SecureNet", "DataFlow", "ArmorCloud", "WebGuard", "TrafficOps", "CyberLink"]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Global brands rely on our security standards to keep their customers safe."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "99.9%",
|
||||
title: "Uptime",
|
||||
description: "Consistent platform performance.",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "2M+",
|
||||
title: "Threats Blocked",
|
||||
description: "Daily automated threats neutralized.",
|
||||
icon: Shield,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15ms",
|
||||
title: "Latency",
|
||||
description: "Optimized verification speed.",
|
||||
icon: Zap,
|
||||
},
|
||||
]}
|
||||
title="Our Security Impact"
|
||||
description="Real-time statistics on our platform stability and user protection."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "99.9%", title: "Uptime", description: "Consistent platform performance.", icon: CheckCircle },
|
||||
{ id: "m2", value: "2M+", title: "Threats Blocked", description: "Daily automated threats neutralized.", icon: Shield },
|
||||
{ id: "m3", value: "15ms", title: "Latency", description: "Optimized verification speed.", icon: Zap },
|
||||
]}
|
||||
title="Our Security Impact"
|
||||
description="Real-time statistics on our platform stability and user protection."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex Riv",
|
||||
handle: "@alex_riv",
|
||||
testimonial: "The verification was seamless and gave me peace of mind about my data security.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-mechanic-standing-repair-shop_1170-1349.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Sarah Lane",
|
||||
handle: "@slane",
|
||||
testimonial: "Fast and effective security verification that didn't interrupt my shopping.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169856.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mike Chen",
|
||||
handle: "@mchen",
|
||||
testimonial: "Highly secure platform, appreciate the focus on keeping bots off the site.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-businesswoman-taking-break_1139-421.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Jane Doe",
|
||||
handle: "@jdoe",
|
||||
testimonial: "Simple verification flow. Security done right for regular users.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-exhausted-workaholic-man-manager-typing-financial-strategy-using-laptop-computer-while-sitting-desk-table-business-company-office_482257-2321.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Mark Wu",
|
||||
handle: "@mwu",
|
||||
testimonial: "Reliable security standards that make me feel safe while browsing online.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-talking-phone-browsing-digital-tablet_329181-16301.jpg",
|
||||
},
|
||||
]}
|
||||
title="Verified User Experiences"
|
||||
description="Hear from those who trust our verification processes."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Alex Riv", handle: "@alex_riv", testimonial: "The verification was seamless and gave me peace of mind about my data security.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-mechanic-standing-repair-shop_1170-1349.jpg" },
|
||||
{ id: "t2", name: "Sarah Lane", handle: "@slane", testimonial: "Fast and effective security verification that didn't interrupt my shopping.", imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169856.jpg" },
|
||||
{ id: "t3", name: "Mike Chen", handle: "@mchen", testimonial: "Highly secure platform, appreciate the focus on keeping bots off the site.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businesswoman-taking-break_1139-421.jpg" },
|
||||
{ id: "t4", name: "Jane Doe", handle: "@jdoe", testimonial: "Simple verification flow. Security done right for regular users.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-exhausted-workaholic-man-manager-typing-financial-strategy-using-laptop-computer-while-sitting-desk-table-business-company-office_482257-2321.jpg" },
|
||||
{ id: "t5", name: "Mark Wu", handle: "@mwu", testimonial: "Reliable security standards that make me feel safe while browsing online.", imageSrc: "http://img.b2bpic.net/free-photo/man-talking-phone-browsing-digital-tablet_329181-16301.jpg" },
|
||||
]}
|
||||
title="Verified User Experiences"
|
||||
description="Hear from those who trust our verification processes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Why did I get this error?",
|
||||
content: "Our system detected traffic patterns that resemble automated bots.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Is my data secure?",
|
||||
content: "Yes, we use advanced encryption to protect your sensitive information.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I bypass the captcha?",
|
||||
content: "Verification is mandatory to ensure the stability of the platform.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions regarding security and traffic verification."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Why did I get this error?", content: "Our system detected traffic patterns that resemble automated bots." },
|
||||
{ id: "f2", title: "Is my data secure?", content: "Yes, we use advanced encryption to protect your sensitive information." },
|
||||
{ id: "f3", title: "Can I bypass the captcha?", content: "Verification is mandatory to ensure the stability of the platform." },
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions regarding security and traffic verification."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
tag="Support"
|
||||
title="Need Help? Reach Out"
|
||||
description="Contact our security team if you continue to face access issues."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Support"
|
||||
title="Need Help? Reach Out"
|
||||
description="Contact our security team if you continue to face access issues."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Security Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Help Center",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Community",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="AliSecurity"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "Security Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
|
||||
{ items: [{ label: "Help Center", href: "#" }, { label: "Community", href: "#" }] },
|
||||
]}
|
||||
logoText="AliSecurity"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user