Files
3cf85039-a4f5-460c-8c87-78e…/src/app/page.tsx
2026-04-20 11:23:29 +00:00

174 lines
9.3 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { Award, CheckCircle, Clock } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Prüfung", id: "#hero" },
{ name: "Features", id: "#features" },
{ name: "Module", id: "#modules" },
{ name: "Kontakt", id: "#contact" },
]}
brandName="IHK Prep"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
background={{ variant: "rotated-rays-animated-grid" }}
title="Dein Weg zur perfekten IHK-Prüfung"
description="Simuliere echte Prüfungssituationen, trainiere gezielt Fachbereiche und bestehe mit unserem intelligenten Lernalgorithmus."
buttons={[{ text: "Jetzt kostenlos starten", href: "#contact" }]}
carouselItems={[
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg", imageAlt: "Dashboard" },
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/girl-with-book-tablet-table_23-2147655874.jpg", imageAlt: "Karteikarten" },
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/graduation-high-school-university-concept-top-view_185193-109745.jpg", imageAlt: "Prüfung" },
{ id: "4", imageSrc: "http://img.b2bpic.net/free-vector/20-online-learning-flat-color-icon-presentation-vector-icons-illustration_1142-15564.jpg", imageAlt: "Lernmodule" },
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/student-home-taking-notes-while-watching-presentation-closeup_482257-118737.jpg", imageAlt: "Analytics" },
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/children-desk-interior-design_23-2148569175.jpg", imageAlt: "Lernumgebung" },
]}
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Erfolge messbar machen"
metrics={[
{ icon: Award, label: "Bestehensquote", value: "98%" },
{ icon: Clock, label: "Zeit Ersparnis", value: "40%" },
{ icon: CheckCircle, label: "Fragenpool", value: "15.000+" },
]}
metricsAnimation="blur-reveal"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwelve
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{ id: "f1", label: "Simulation", title: "Prüfungs-Simulation", items: ["Echte Zeitlimits", "Punktesimulation", "IHK-Feeling pur"] },
{ id: "f2", label: "Training", title: "Spaced Repetition", items: ["Intelligenter Algorithmus", "Schwierige Fragen öfter", "Effektiver Lernfortschritt"] },
{ id: "f3", label: "Analyse", title: "Fortschritts-Tracker", items: ["Lücken erkennen", "Visuelle Statistiken", "Stärken ausbauen"] },
]}
title="Intelligente Lern-Tools"
description="Unsere App kombiniert bewährte Lernmethoden mit der speziellen IHK-Logik."
/>
</div>
<div id="modules" data-section="modules">
<ProductCardFour
animationType="blur-reveal"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Kaufmännische Berufe", price: "Basis", variant: "WISO & KLR", imageSrc: "http://img.b2bpic.net/free-photo/pile-3d-facebook-logos_1379-875.jpg" },
{ id: "p2", name: "IT-Berufe", price: "Technik", variant: "Code & Security", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-retro-computer_23-2151004370.jpg" },
{ id: "p3", name: "Logistik & Handel", price: "Lager", variant: "Prozesse & Recht", imageSrc: "http://img.b2bpic.net/free-photo/pointer-pin-location-earth-global-world-with-cardboard-boxes-transportation-logistics-concept-pink-background-icon-symbol-3d-rendering_56104-1283.jpg" },
{ id: "p4", name: "WISO-Basics", price: "Recht", variant: "Alle Berufe", imageSrc: "http://img.b2bpic.net/free-vector/ebook-icon_632498-3933.jpg" },
{ id: "p5", name: "Rechnungswesen", price: "Finanz", variant: "Buchführung", imageSrc: "http://img.b2bpic.net/free-photo/stock-market-exchange-economics-investment-graph_53876-21258.jpg" },
{ id: "p6", name: "Komplexaufgaben", price: "Pro", variant: "Transfertraining", imageSrc: "http://img.b2bpic.net/free-photo/last-piece-puzzle_1156-390.jpg" },
]}
title="Spezialisierte Fachbereiche"
description="Lerninhalte maßgeschneidert auf deinen Bildungsgang."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardNine
animationType="scale-rotate"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{ id: "plan-1", title: "Einstieg", price: "19,99€", period: "einmalig", features: ["Basis-Prüfungen", "WISO-Modul", "Erster Überblick"], button: { text: "Starten" }, imageSrc: "http://img.b2bpic.net/free-photo/bullet-journal-pens-view_23-2149740077.jpg" },
{ id: "plan-2", title: "Premium", price: "49,99€", period: "einmalig", features: ["Alle Fachbereiche", "Vollständige Simulation", "Lern-Tracker & Statistik"], button: { text: "Empfohlen" }, imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg" },
{ id: "plan-3", title: "Master", price: "89,99€", period: "einmalig", features: ["Alles in Premium", "Persönliches Coaching", "Prüfungs-Garantie"], button: { text: "Maximum" }, imageSrc: "http://img.b2bpic.net/free-photo/girl-with-book-tablet-table_23-2147655874.jpg" },
]}
title="Wähle dein Lernpaket"
description="Bereite dich effizient und ohne Stress auf deine Prüfung vor."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={false}
testimonials={[
{ id: "t1", name: "Sarah Müller", imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-caucasian-happy-teacher-glasses_74855-9736.jpg" },
{ id: "t2", name: "Kevin Schmidt", imageSrc: "http://img.b2bpic.net/free-photo/freelancer-noting-down-ideas-paper-using-pen-while-teleworking_482257-118182.jpg" },
{ id: "t3", name: "Lisa Weber", imageSrc: "http://img.b2bpic.net/free-photo/young-delivery-man-red-uniform-holding-clipboard-looking-camera-skeptic-nervous-isolated-white-background_141793-19565.jpg" },
{ id: "t4", name: "Tom Fischer", imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-woman-having-notepad-pen-hands-planning-expertising-analyzing-isolated_231208-10439.jpg" },
{ id: "t5", name: "Anna Becker", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-woman-looking-camera_23-2148273321.jpg" },
]}
cardTitle="Erfolgsgeschichten"
cardAnimation="blur-reveal"
cardTag="Stimmen unserer Nutzer"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{ id: "q1", title: "Wie aktuell sind die Fragen?", content: "Unser Team hält die Fragen stets auf dem neuesten Stand der IHK-Verordnungen." },
{ id: "q2", title: "Gibt es eine App?", content: "Ja, unsere Plattform ist als PWA für alle mobilen Endgeräte optimiert." },
{ id: "q3", title: "Kann ich die Lernpläne anpassen?", content: "Natürlich! Jeder Lernplan lässt sich an deinen Zeitplan anpassen." },
]}
sideTitle="Noch Fragen?"
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={false}
background={{ variant: "rotated-rays-static" }}
tag="Bereit?"
title="Starte dein IHK-Training"
description="Werde Teil der Tausenden erfolgreichen Azubis und starte noch heute."
buttons={[{ text: "Jetzt loslegen", href: "#hero" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="IHK Prep App"
leftLink={{ text: "Datenschutz", href: "#" }}
rightLink={{ text: "Impressum", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}