Merge version_1 into main #2
365
src/app/page.tsx
365
src/app/page.tsx
@@ -16,267 +16,126 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
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">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="iConnect Automation"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Categories", id: "categories" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="iConnect Automation"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
title="Welcome to iConnect Automation"
|
||||
description="Master QA Automation with structured questions & answers designed for beginners and professionals alike. Accelerate your testing career."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Categories",
|
||||
href: "#categories",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/businesswoman-explaining-her-renovation-vision-laptop_482257-90952.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
imageAlt="qa testing software automation"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/data-center-manager-berating-employee-reproaching-performance-issues_482257-126743.jpg",
|
||||
alt: "Data center manager",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/black-corporate-team-collaborate-global-investment-strategy_482257-125289.jpg",
|
||||
alt: "Corporate team collaboration",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/computer-scientist-working-high-tech-server-hub_482257-124060.jpg",
|
||||
alt: "Computer scientist",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/focus-lines-code-laptop-screen-used-by-data-center-engineers_482257-117920.jpg",
|
||||
alt: "Lines of code screen",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/hacker-girl-with-her-team-stealing-online-information-using-super-computers_482257-21774.jpg",
|
||||
alt: "Hacker team",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 5,000+ QA Engineers"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Selenium Masterclass",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "API Automation Tips",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Playwright Certified",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Performance Testing",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "CI/CD Pipeline",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="home" data-section="home">
|
||||
<HeroSplit
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Welcome to iConnect Automation"
|
||||
description="Master QA Automation with structured questions & answers designed for beginners and professionals alike. Accelerate your testing career."
|
||||
buttons={[{ text: "Explore Categories", href: "#categories" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/businesswoman-explaining-her-renovation-vision-laptop_482257-90952.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
imageAlt="qa testing software automation"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/data-center-manager-berating-employee-reproaching-performance-issues_482257-126743.jpg", alt: "Data center manager" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/black-corporate-team-collaborate-global-investment-strategy_482257-125289.jpg", alt: "Corporate team collaboration" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/computer-scientist-working-high-tech-server-hub_482257-124060.jpg", alt: "Computer scientist" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/focus-lines-code-laptop-screen-used-by-data-center-engineers_482257-117920.jpg", alt: "Lines of code screen" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/hacker-girl-with-her-team-stealing-online-information-using-super-computers_482257-21774.jpg", alt: "Hacker team" }
|
||||
]}
|
||||
avatarText="Join 5,000+ QA Engineers"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Selenium Masterclass" },
|
||||
{ type: "text", text: "API Automation Tips" },
|
||||
{ type: "text", text: "Playwright Certified" },
|
||||
{ type: "text", text: "Performance Testing" },
|
||||
{ type: "text", text: "CI/CD Pipeline" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="categories" data-section="categories">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Manual Testing",
|
||||
description: "Foundations of software quality assurance.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/system-admin-working-diverse-computer-network-security-data-center_482257-118332.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Selenium",
|
||||
description: "Master web browser automation.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/scripts-running-desktop-pc-monitors-upgrading-servers-data-center_482257-124076.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Java",
|
||||
description: "The backbone of robust test frameworks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-it-department-office-used-building-machine-learning-software_482257-124290.jpg",
|
||||
},
|
||||
{
|
||||
title: "Playwright",
|
||||
description: "Modern web automation for developers.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/annoyed-worker-work-raging-after-losing-all-progress-due-computer-crash_482257-124211.jpg",
|
||||
},
|
||||
{
|
||||
title: "JavaScript",
|
||||
description: "Learn scripting for automated tests.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/data-center-manager-berating-employee-reproaching-performance-issues_482257-126743.jpg",
|
||||
},
|
||||
{
|
||||
title: "API Testing",
|
||||
description: "Backend testing efficiency.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-corporate-team-collaborate-global-investment-strategy_482257-125289.jpg",
|
||||
},
|
||||
]}
|
||||
title="Master Your Craft"
|
||||
description="Choose a category to start your journey into automated testing excellence."
|
||||
/>
|
||||
</div>
|
||||
<div id="categories" data-section="categories">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Master Your Craft"
|
||||
description="Choose a category to start your journey into automated testing excellence."
|
||||
features={[
|
||||
{ title: "Manual Testing", description: "Foundations of software quality assurance.", imageSrc: "http://img.b2bpic.net/free-photo/system-admin-working-diverse-computer-network-security-data-center_482257-118332.jpg", imageAlt: "Manual Testing" },
|
||||
{ title: "Selenium", description: "Master web browser automation.", imageSrc: "http://img.b2bpic.net/free-photo/scripts-running-desktop-pc-monitors-upgrading-servers-data-center_482257-124076.jpg", imageAlt: "Selenium" },
|
||||
{ title: "Java", description: "The backbone of robust test frameworks.", imageSrc: "http://img.b2bpic.net/free-photo/empty-it-department-office-used-building-machine-learning-software_482257-124290.jpg", imageAlt: "Java" },
|
||||
{ title: "Playwright", description: "Modern web automation for developers.", imageSrc: "http://img.b2bpic.net/free-photo/annoyed-worker-work-raging-after-losing-all-progress-due-computer-crash_482257-124211.jpg", imageAlt: "Playwright" },
|
||||
{ title: "JavaScript", description: "Learn scripting for automated tests.", imageSrc: "http://img.b2bpic.net/free-photo/data-center-manager-berating-employee-reproaching-performance-issues_482257-126743.jpg", imageAlt: "JavaScript" },
|
||||
{ title: "API Testing", description: "Backend testing efficiency.", imageSrc: "http://img.b2bpic.net/free-photo/black-corporate-team-collaborate-global-investment-strategy_482257-125289.jpg", imageAlt: "API Testing" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What is Selenium?",
|
||||
content: "Selenium is an open-source tool used for automating web browsers.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "What are locators?",
|
||||
content: "Locators identify web elements like id, name, or xpath.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "What is WebDriver?",
|
||||
content: "WebDriver is an interface for browser interaction.",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Why TestNG?",
|
||||
content: "TestNG provides powerful testing framework capabilities.",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "What is POM?",
|
||||
content: "Page Object Model manages elements effectively.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Quick answers to the most frequently asked QA automation questions."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqsAnimation="slide-up"
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Quick answers to the most frequently asked QA automation questions."
|
||||
faqs={[
|
||||
{ id: "1", title: "What is Selenium?", content: "Selenium is an open-source tool used for automating web browsers." },
|
||||
{ id: "2", title: "What are locators?", content: "Locators identify web elements like id, name, or xpath." },
|
||||
{ id: "3", title: "What is WebDriver?", content: "WebDriver is an interface for browser interaction." },
|
||||
{ id: "4", title: "Why TestNG?", content: "TestNG provides powerful testing framework capabilities." },
|
||||
{ id: "5", title: "What is POM?", content: "Page Object Model manages elements effectively." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Success Stories"
|
||||
description="Hear from QA professionals who have advanced their careers with iConnect."
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
role: "Senior QA",
|
||||
testimonial: "The structured path made learning Playwright incredibly fast.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/computer-scientist-working-high-tech-server-hub_482257-124060.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark D.",
|
||||
role: "Automation Lead",
|
||||
testimonial: "Best repository of Selenium interview questions I've found.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/focus-lines-code-laptop-screen-used-by-data-center-engineers_482257-117920.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elena R.",
|
||||
role: "Software Engineer",
|
||||
testimonial: "I transitioned into testing thanks to these clear explanations.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hacker-girl-with-her-team-stealing-online-information-using-super-computers_482257-21774.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Kevin L.",
|
||||
role: "QA Analyst",
|
||||
testimonial: "API testing sections are top-tier.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/system-admin-working-diverse-computer-network-security-data-center_482257-118332.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Nina P.",
|
||||
role: "DevOps Engineer",
|
||||
testimonial: "Practical and industry-relevant content.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/scripts-running-desktop-pc-monitors-upgrading-servers-data-center_482257-124076.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Success Stories"
|
||||
description="Hear from QA professionals who have advanced their careers with iConnect."
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah J.", role: "Senior QA", testimonial: "The structured path made learning Playwright incredibly fast.", imageSrc: "http://img.b2bpic.net/free-photo/computer-scientist-working-high-tech-server-hub_482257-124060.jpg" },
|
||||
{ id: "t2", name: "Mark D.", role: "Automation Lead", testimonial: "Best repository of Selenium interview questions I've found.", imageSrc: "http://img.b2bpic.net/free-photo/focus-lines-code-laptop-screen-used-by-data-center-engineers_482257-117920.jpg" },
|
||||
{ id: "t3", name: "Elena R.", role: "Software Engineer", testimonial: "I transitioned into testing thanks to these clear explanations.", imageSrc: "http://img.b2bpic.net/free-photo/hacker-girl-with-her-team-stealing-online-information-using-super-computers_482257-21774.jpg" },
|
||||
{ id: "t4", name: "Kevin L.", role: "QA Analyst", testimonial: "API testing sections are top-tier.", imageSrc: "http://img.b2bpic.net/free-photo/system-admin-working-diverse-computer-network-security-data-center_482257-118332.jpg" },
|
||||
{ id: "t5", name: "Nina P.", role: "DevOps Engineer", testimonial: "Practical and industry-relevant content.", imageSrc: "http://img.b2bpic.net/free-photo/scripts-running-desktop-pc-monitors-upgrading-servers-data-center_482257-124076.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Contact Us"
|
||||
title="Need Help?"
|
||||
description="Reach out to our team if you have questions or want to contribute to our library."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Support",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
tag="Contact Us"
|
||||
title="Need Help?"
|
||||
description="Reach out to our team if you have questions or want to contribute to our library."
|
||||
buttons={[{ text: "Contact Support" }]}
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Product",
|
||||
items: [
|
||||
{
|
||||
label: "Categories",
|
||||
href: "#categories",
|
||||
},
|
||||
{
|
||||
label: "Q&A Archive",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 iConnect Automation. All rights reserved."
|
||||
bottomRightText="Built for QA Excellence"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Categories", href: "#categories" }, { label: "Q&A Archive", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Contact Us", href: "#contact" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 iConnect Automation. All rights reserved."
|
||||
bottomRightText="Built for QA Excellence"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user