Initial commit
This commit is contained in:
183
src/app/page.tsx
Normal file
183
src/app/page.tsx
Normal file
@@ -0,0 +1,183 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroLogoBillboard from "@/components/sections/hero/HeroLogoBillboard";
|
||||
import MediaAbout from "@/components/sections/about/MediaAbout";
|
||||
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
|
||||
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
||||
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
|
||||
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
||||
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
||||
import { TrendingUp, Clock, Users, Zap } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noise"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Dashboard", id: "dashboard" },
|
||||
{ name: "My Plan", id: "plan" },
|
||||
{ name: "Progress", id: "progress" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
]}
|
||||
brandName="ExamFlow"
|
||||
button={{
|
||||
text: "Start Free", href: "#onboarding"}}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
logoText="ExamFlow"
|
||||
description="Stop panicking. Start planning. ExamFlow helps you create a personalized study schedule, track daily progress, and ace your exams with confidence."
|
||||
buttons={[
|
||||
{ text: "Create Your Plan", href: "#onboarding" },
|
||||
{ text: "See How It Works", href: "#features" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-tablet-papers-with-data-charts-desk-used-by-workmates-business-development-corporate-colleagues-working-project-presentation-management-marketing-strategy_482257-32053.jpg"
|
||||
imageAlt="dashboard interface study analytics clean"
|
||||
frameStyle="browser"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="onboarding" data-section="onboarding">
|
||||
<MediaAbout
|
||||
tag="Step 1: Setup"
|
||||
title="Four Simple Questions"
|
||||
description="Tell us your exam date, how many courses you're taking, how hard each one is, and how much time you have each day. That's all we need."
|
||||
tagIcon={Zap}
|
||||
buttons={[{ text: "Get Started", href: "#" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/task-management-app-template_23-2148663598.jpg"
|
||||
imageAlt="form setup onboarding interface modern"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentySeven
|
||||
tag="How It Works"
|
||||
title="Three Core Features"
|
||||
description="From exam details to daily accountability."
|
||||
features={[
|
||||
{
|
||||
id: "1", title: "Smart Plan Generator", description: "We auto-distribute your courses across the days until your exam. Harder courses get more study time. Each day shows exactly what to study and for how long.", imageSrc: "http://img.b2bpic.net/free-photo/schedule-activity-calendar-appointment-concept_53876-122362.jpg", imageAlt: "schedule planning calendar study organization"},
|
||||
{
|
||||
id: "2", title: "Daily 25-Min Focus Timer", description: "Start focused study sessions with our built-in 25-minute timer. No distractions. Just deep work. Mark sessions complete and watch your progress grow.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-alarm-clock_53876-31264.jpg", imageAlt: "timer focus productivity clock study"},
|
||||
{
|
||||
id: "3", title: "Real Progress Dashboard", description: "See exactly where you stand. % syllabus covered. Hours studied this week. Days left to exam. No guessing. Pure accountability.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-digital-tablet-with-bar-graph_1098-3523.jpg", imageAlt: "progress metrics statistics chart analytics"},
|
||||
]}
|
||||
gridVariant="uniform-4-items"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="invertDefault"
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardThree
|
||||
tag="Why Students Love ExamFlow"
|
||||
title="Proven Results"
|
||||
description="Real students. Real outcomes."
|
||||
metrics={[
|
||||
{ id: "1", icon: TrendingUp, title: "Avg Score Boost", value: "+18%" },
|
||||
{ id: "2", icon: Clock, title: "Study Hours Logged", value: "2,400+" },
|
||||
{ id: "3", icon: Users, title: "Active Students", value: "1,200+" },
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
uniformGridCustomHeightClasses="min-h-80 2xl:min-h-90"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
tag="Student Stories"
|
||||
title="Hear From Real Users"
|
||||
description="Students who went from panic to prepared."
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Chen", role: "Engineering Student", company: "UC Berkeley", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-girl-student-looking-camera-sitting-cafe-table_1163-5164.jpg", imageAlt: "student woman university portrait professional"},
|
||||
{
|
||||
id: "2", name: "Marcus Johnson", role: "Med School Candidate", company: "Harvard Med", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-man-holding-folder-outdoor_74855-2121.jpg", imageAlt: "student man medical professional portrait"},
|
||||
{
|
||||
id: "3", name: "Priya Patel", role: "Law Student", company: "Yale Law", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-lady_1163-3171.jpg", imageAlt: "student woman professional law portrait"},
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "96%", label: "Say ExamFlow saved them time" },
|
||||
{ value: "89%", label: "Would recommend to friends" },
|
||||
{ value: "2.5 hrs", label: "Average daily study consistency" },
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
uniformGridCustomHeightClasses="min-h-80 2xl:min-h-90"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Questions?"
|
||||
title="Frequently Asked"
|
||||
description="Everything you need to know about ExamFlow."
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "How long does it take to set up my plan?", content: "Less than 2 minutes. Answer four quick questions about your exam, courses, and available study time, and we'll generate a complete study plan instantly."},
|
||||
{
|
||||
id: "2", title: "Can I adjust my plan after I start?", content: "Yes. Life happens. You can update your study hours, exam date, or course difficulty anytime. Your plan recalculates automatically."},
|
||||
{
|
||||
id: "3", title: "What if I miss a study session?", content: "No penalty. Just log back in and continue. Your progress dashboard shows your weekly consistency, so you can see the big picture, not just one missed session."},
|
||||
{
|
||||
id: "4", title: "Is there a premium version?", content: "Not yet. This MVP is completely free. We're proving the core value first. Future versions may include custom timetables and past exam questions."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/flat-composition-with-telephone-operators-lending-online-support-client_1284-58936.jpg"
|
||||
imageAlt="faq help support questions illustration"
|
||||
mediaAnimation="slide-up"
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
mediaPosition="right"
|
||||
animationType="smooth"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactSplit
|
||||
tag="Ready?"
|
||||
title="Stop Procrastinating. Start Studying."
|
||||
description="Create your personalized study plan in under 2 minutes. No credit card. No commitment. Just clarity."
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/smart-pretty-young-woman-working-with-laptop-table-library-studying-university-learning-freelancer-working-searching-internet-clever-student-hard-working_197531-1856.jpg"
|
||||
imageAlt="student studying laptop learning focused"
|
||||
mediaAnimation="blur-reveal"
|
||||
inputPlaceholder="your@email.com"
|
||||
buttonText="Create Plan Free"
|
||||
termsText="Join 1,000+ students already preparing smarter."
|
||||
mediaPosition="left"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user