Files
f51dbb83-e16f-4e42-abf4-95d…/src/app/page.tsx
2026-01-28 18:31:30 +02:00

276 lines
15 KiB
TypeScript

"use client"
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
// import NavbarLayoutFloatitlengOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Award, BookOpen, HelpCircle, Star, Users, Zap } from 'lucide-react';
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
export default function ITAcademyPage() {
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="mediumLargeSizeLargeTitles"
background="floatingGradient"
cardStyle="inset"
primaryButtonStyle="inset-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="IT Academy"
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Courses", id: "courses" },
{ name: "Team", id: "team" },
{ name: "Testimonials", id: "testimonials" }
]}
button={{
text: "Enroll Now", href: "contact"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
title="123"
description="Measurable Results That Speak for Themselves"
tag="Start Your Journey"
tagIcon={Zap}
background={{ variant: "glowing-orb" }}
imageSrc="https://img.b2bpic.net/free-photo/man-working-energy-innovations-his-laptop_23-2148820170.jpg"
imageAlt="Students learning coding and IT skills"
imagePosition="right"
buttons={[
{ text: "Browse Courses", href: "courses" },
{ text: "Free Demo", href: "contact" }
]}
containerClassName="mt-8"
/>
</div>
<div id="team" data-section="team">
<TeamCardOne
title="Meet Our Expert Instructors"
description="Experienced professionals with proven track records in the tech industry"
tag="Instructors"
tagIcon={Users}
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
useInvertedBackground="true"
members={[
{
id: "1", name: "Rajesh Kumar", role: "Full-Stack Developer", imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-man-scientist_23-2148820194.jpg", imageAlt: "Rajesh Kumar"
},
{
id: "2", name: "Priya Sharma", role: "Data Scientist", imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-business-person-doing-internship_23-2149305396.jpg", imageAlt: "Priya Sharma"
},
{
id: "3", name: "Amit Verma", role: "Security Expert", imageSrc: "https://img.b2bpic.net/free-photo/close-up-colleagues-learning-work_23-2149300706.jpg", imageAlt: "Amit Verma"
},
{
id: "4", name: "Deepa Singh", role: "UI/UX Designer", imageSrc: "https://img.b2bpic.net/free-photo/closeup-senior-lecturer-with-arms-crossed_1262-1753.jpg", imageAlt: "Deepa Singh"
}
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
tag="About Us"
tagIcon={Award}
title="Test Title"
description="Founded in 2015, IT Academy has trained over 5,000 students in cutting-edge technology. Our mission is to provide accessible, high-quality IT education that bridges the gap between academic learning and industry demands."
metrics={[
{ value: "5000+", title: "Students Trained Successfully" },
{ value: "35%", title: "Job Placement Rate" }
]}
imageSrc="https://img.b2bpic.net/free-photo/row-serious-focused-coworkers-sitting-table-typing-laptops_74855-10363.jpg"
imageAlt="IT Academy classroom"
useInvertedBackground="invertDefault"
className="hover:shadow-xl transition-shadow duration-300"
className="animate-zoom-in"
/>
</div>
<div id="courses" data-section="courses">
<FeatureCardThree
title="Our Signature Courses"
description="Comprehensive curriculum designed by industry professionals"
tag="Featured Programs"
tagIcon={BookOpen}
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
gridVariant="three-columns-all-equal-width"
gridVariant="three-columns-all-equal-width"
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
useInvertedBackground="noInvert"
features={[
{
id: "01", title: "Full-Stack Web Development", description: "Master HTML, CSS, JavaScript, React, Node.js, and databases. Build complete web applications from frontend to backend.", imageSrc: "https://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104516.jpg", imageAlt: "Web development course"
},
{
id: "02", title: "Python & Data Science", description: "Learn Python programming, data analysis, machine learning, and AI. Prepare for data science and analytics careers.", imageSrc: "https://img.b2bpic.net/free-photo/person-computing-software-code-laptop_482257-85707.jpg", imageAlt: "Python and data science course"
},
{
id: "03", title: "Cybersecurity Essentials", description: "Understand security principles, ethical hacking, and network protection. Earn industry-recognized certifications.", imageSrc: "https://img.b2bpic.net/free-photo/man-working-energy-innovations-his-laptop_23-2148820170.jpg", imageAlt: "Cybersecurity course"
}
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFourteen
title="Measurable Results That Speak for Themselves"
tag="Success Stats"
metrics={[
{
id: "1", value: "12 weeks", description: "Average time to complete a comprehensive course while maintaining flexible schedules"
},
{
id: "2", value: "₹3-8 LPA", description: "Average salary increase for graduates within 6 months of completing our programs"
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
title="What Our Students Say"
description="Real success stories from graduates who transformed their careers"
tag="Testimonials"
tagIcon={Star}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="invertDefault"
speed={40}
topMarqueeDirection="left"
testimonials={[
{
id: "1", name: "Arjun Patel", handle: "@arjunpatel", testimonial: "IT Academy transformed my career. Within 3 months of the course, I landed my dream job as a full-stack developer. Highly recommended!", imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-business-person-doing-internship_23-2149305397.jpg", imageAlt: "Arjun Patel"
},
{
id: "2", name: "Neha Gupta", handle: "@nehagupta", testimonial: "The instructors were incredibly knowledgeable and the curriculum was industry-relevant. Best investment in my future!", imageSrc: "https://img.b2bpic.net/free-photo/mid-shot-counselor-cabinet_23-2148759108.jpg", imageAlt: "Neha Gupta"
},
{
id: "3", name: "Vikram Singh", handle: "@vikramsingh", testimonial: "From zero coding experience to building production-ready applications. The hands-on approach here is unmatched.", imageSrc: "https://img.b2bpic.net/free-photo/teacher-holding-english-class_23-2149402693.jpg", imageAlt: "Vikram Singh"
},
{
id: "4", name: "Anjali Reddy", handle: "@anjalitech", testimonial: "The mentorship and career guidance I received were invaluable. I got 3 job offers after completing the course!", imageSrc: "https://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg", imageAlt: "Anjali Reddy"
},
{
id: "5", name: "Rohan Kapoor", handle: "@rohankapoor", testimonial: "Excellent curriculum with real-world projects. The community support and peer learning made it even better.", imageSrc: "https://img.b2bpic.net/free-photo/smiley-teacher-holding-tablet_23-2148668619.jpg", imageAlt: "Rohan Kapoor"
},
{
id: "6", name: "Sneha Nair", handle: "@snehanair", testimonial: "Not just a course, but a complete career transformation program. I transitioned into tech successfully!", imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-smiley-woman-library_23-2149204753.jpg", imageAlt: "Sneha Nair"
}
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
title="Frequently Asked Questions"
description="Everything you need to know about our programs and enrollment"
tag="FAQ"
tagIcon={HelpCircle}
textboxLayout="default"
useInvertedBackground="noInvert"
mediaPosition="left"
imageSrc="https://img.b2bpic.net/free-photo/young-distraught-call-center-agent-communicating-with-client-while-using-desktop-pc-office_637285-6461.jpg"
imageAlt="Customer support illustration"
faqs={[
{
id: "1", title: "What are the prerequisites for enrolling?", content: "Most of our courses are beginner-friendly and don't require prior programming experience. Basic computer literacy is helpful. We offer starter modules for absolute beginners."
},
{
id: "2", title: "What is the course duration?", content: "Our courses typically range from 8-16 weeks depending on the program. You can learn at your own pace with flexible schedules, and lifetime access to course materials."
},
{
id: "3", title: "Do you provide job placement assistance?", content: "Yes! We provide career coaching, resume building, interview preparation, and direct job placement assistance. Our 95% job placement rate speaks for itself."
},
{
id: "4", title: "What certifications will I receive?", content: "You'll receive an IT Academy completion certificate recognized by industry partners. We also offer prep for industry certifications like AWS, CompTIA, and others."
},
{
id: "5", title: "Is there a money-back guarantee?", content: "Yes, we offer a 30-day money-back guarantee if you're not satisfied with the course. No questions asked."
},
{
id: "6", title: "Can I access the course materials after completion?", content: "Absolutely! You get lifetime access to all course materials, including updated content and new modules added in the future."
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to launch your IT career? Join hundreds of successful graduates who transformed their futures at IT Academy."
animationType="background-highlight"
buttons={[
{ text: "Start Your Journey", href: "https://example.com/enroll" },
{ text: "Schedule a Consultation", href: "contact" }
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Navigate", items: [
{ label: "Home", href: "#hero" },
{ label: "Courses", href: "#courses" },
{ label: "About Us", href: "#about" },
{ label: "Team", href: "#team" }
]
},
{
title: "Programs", items: [
{ label: "Web Development", href: "https://example.com/web-dev" },
{ label: "Data Science", href: "https://example.com/data-science" },
{ label: "Cybersecurity", href: "https://example.com/cybersecurity" },
{ label: "Cloud Computing", href: "https://example.com/cloud" }
]
},
{
title: "Resources", items: [
{ label: "Blog", href: "https://example.com/blog" },
{ label: "FAQ", href: "#faq" },
{ label: "Testimonials", href: "#testimonials" },
{ label: "Contact", href: "#contact" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "https://example.com/privacy" },
{ label: "Terms of Service", href: "https://example.com/terms" },
{ label: "Refund Policy", href: "https://example.com/refund" }
]
}
]}
bottomLeftText="© 2025 IT Academy. All rights reserved."
bottomRightText="Empowering Tech Careers Since 2015"
className="mt-10"
/>
</div>
</ThemeProvider>
);
}