Switch to version 1: modified src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -2,7 +2,6 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import { useState, useEffect, useRef } from "react";
 import ContactText from '@/components/sections/contact/ContactText';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
@@ -12,31 +11,6 @@ import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 
 export default function LandingPage() {
-  const [alarmEnabled, setAlarmEnabled] = useState(false);
-  const audioRef = useRef<HTMLAudioElement | null>(null);
-
-  useEffect(() => {
-    const saved = localStorage.getItem('alarmEnabled');
-    if (saved) {
-      try {
-        const parsed = JSON.parse(saved);
-        setAlarmEnabled(parsed);
-      } catch (e) {
-        console.error("Failed to parse alarm state", e);
-      }
-    }
-    audioRef.current = new Audio('/alarm-sound.mp3');
-  }, []);
-
-  const toggleAlarm = () => {
-    const newState = !alarmEnabled;
-    setAlarmEnabled(newState);
-    localStorage.setItem('alarmEnabled', JSON.stringify(newState));
-    if (newState && audioRef.current) {
-      audioRef.current.play().catch(e => console.log("Playback prevented:", e));
-    }
-  };
-
   return (
     <ThemeProvider
         defaultButtonVariant="hover-bubble"
@@ -51,100 +25,146 @@ export default function LandingPage() {
         headingFontWeight="semibold"
     >
       <ReactLenis root>
-        <div id="nav" data-section="nav">
+  <div id="nav" data-section="nav">
-          <NavbarLayoutFloatingInline
+      <NavbarLayoutFloatingInline
-            navItems={[
+      navItems={[
-              { name: "Home", id: "hero" },
+        {
-              { name: "Features", id: "features" },
+          name: "Home",          id: "hero"},
-              { name: "FAQ", id: "faq" },
+        {
-            ]}
+          name: "Features",          id: "features"},
-            brandName="StudyReminder"
+        {
-            button={{ text: "Get Started", href: "#" }}
+          name: "FAQ",          id: "faq"},
-          />
+      ]}
-        </div>
+      brandName="StudyReminder"
+      button={{
+        text: "Log In",        href: "#"
+      }}
+    />
+  </div>
 
-        <div id="hero" data-section="hero">
+  <div id="hero" data-section="hero">
-          <HeroBillboard
+      <HeroBillboard
-            background={{ variant: "sparkles-gradient" }}
+      background={{
-            title="Master Your Study Schedule"
+        variant: "sparkles-gradient"}}
-            description="Never miss a study session again. Smart, automated reminders to keep you on track, focused, and ready for every exam."
+      title="Master Your Study Schedule"
-            buttons={[
+      description="Never miss a study session again. Smart, automated reminders to keep you on track, focused, and ready for every exam."
-              { text: alarmEnabled ? "Alarm ON" : "Enable Alarm", onClick: toggleAlarm },
+      buttons={[
-            ]}
+        {
-            imageSrc="http://img.b2bpic.net/free-photo/high-angle-bullet-journal-keyboard_23-2149740042.jpg"
+          text: "Get Started",          href: "#"},
-            imageAlt="Digital Study Dashboard"
+      ]}
-            mediaAnimation="blur-reveal"
+      imageSrc="http://img.b2bpic.net/free-photo/high-angle-bullet-journal-keyboard_23-2149740042.jpg"
-          />
+      imageAlt="Digital Study Dashboard"
-        </div>
+      mediaAnimation="blur-reveal"
+      avatars={[
+        {
+          src: "http://img.b2bpic.net/free-photo/schedule-time-management-planner-concept_53876-120482.jpg",          alt: "Student 1"},
+        {
+          src: "http://img.b2bpic.net/free-photo/young-man-learning-virtual-classroom_23-2149200215.jpg",          alt: "Student 2"},
+        {
+          src: "http://img.b2bpic.net/free-photo/light-equipment-grey-technology-serious_1134-1423.jpg",          alt: "Student 3"},
+        {
+          src: "http://img.b2bpic.net/free-photo/high-angle-bullet-journal-keyboard_23-2149740042.jpg",          alt: "Student 4"},
+        {
+          src: "http://img.b2bpic.net/free-photo/support-community-aid-help-team-assistance-concept_53876-123806.jpg",          alt: "Student 5"},
+      ]}
+      avatarText="Used by 10,000+ students"
+      marqueeItems={[
+        {
+          type: "text",          text: "Productivity Boosted"},
+        {
+          type: "text",          text: "Grade Improvement"},
+        {
+          type: "text",          text: "Stress Reduced"},
+        {
+          type: "text",          text: "Better Scheduling"},
+        {
+          type: "text",          text: "Exam Ready"},
+      ]}
+    />
+  </div>
 
-        <div id="features" data-section="features">
+  <div id="features" data-section="features">
-          <FeatureCardSeven
+      <FeatureCardSeven
-            animationType="slide-up"
+      animationType="slide-up"
-            textboxLayout="split"
+      textboxLayout="split"
-            useInvertedBackground={true}
+      useInvertedBackground={true}
-            features={[
+      features={[
-              { title: "Timely Notifications", description: "Get pinged exactly when you need to start, ensuring no session goes forgotten.", imageSrc: "http://img.b2bpic.net/free-photo/schedule-time-management-planner-concept_53876-120482.jpg", imageAlt: "Reminder Bell" },
+        {
-              { title: "Workspace Focus", description: "Tools that help you maintain a dedicated study environment and keep distractions at bay.", imageSrc: "http://img.b2bpic.net/free-photo/young-man-learning-virtual-classroom_23-2149200215.jpg", imageAlt: "Focused Student" },
+          title: "Timely Notifications",          description: "Get pinged exactly when you need to start, ensuring no session goes forgotten.",          imageSrc: "http://img.b2bpic.net/free-photo/schedule-time-management-planner-concept_53876-120482.jpg",          imageAlt: "Reminder Bell"},
-              { title: "Smart Scheduling", description: "AI-optimized schedules that adapt to your pace and academic requirements.", imageSrc: "http://img.b2bpic.net/free-photo/light-equipment-grey-technology-serious_1134-1423.jpg", imageAlt: "Schedule Data" },
+        {
-            ]}
+          title: "Workspace Focus",          description: "Tools that help you maintain a dedicated study environment and keep distractions at bay.",          imageSrc: "http://img.b2bpic.net/free-photo/young-man-learning-virtual-classroom_23-2149200215.jpg",          imageAlt: "Focused Student"},
-            title="Stay Productive, Stay Ahead"
+        {
-            description="Powerful tools designed specifically for students to manage their time and workload effectively."
+          title: "Smart Scheduling",          description: "AI-optimized schedules that adapt to your pace and academic requirements.",          imageSrc: "http://img.b2bpic.net/free-photo/light-equipment-grey-technology-serious_1134-1423.jpg",          imageAlt: "Schedule Data"},
-          />
+      ]}
-        </div>
+      title="Stay Productive, Stay Ahead"
+      description="Powerful tools designed specifically for students to manage their time and workload effectively."
+    />
+  </div>
 
-        <div id="faq" data-section="faq">
+  <div id="faq" data-section="faq">
-          <FaqSplitMedia
+      <FaqSplitMedia
-            textboxLayout="default"
+      textboxLayout="default"
-            useInvertedBackground={false}
+      useInvertedBackground={false}
-            faqs={[
+      faqs={[
-              { id: "f1", title: "How do I set a reminder?", content: "Simply input your subject name and the date/time you plan to study in the add-reminder form." },
+        {
-              { id: "f2", title: "Can I delete a reminder?", content: "Yes, just tap the 'X' button next to the reminder in your list to remove it." },
+          id: "f1",          title: "How do I set a reminder?",          content: "Simply input your subject name and the date/time you plan to study in the add-reminder form."},
-              { id: "f3", title: "Do I need an account?", content: "No, your reminders are stored locally in your browser so you can start right away." },
+        {
-            ]}
+          id: "f2",          title: "Can I delete a reminder?",          content: "Yes, just tap the 'X' button next to the reminder in your list to remove it."},
-            imageSrc="http://img.b2bpic.net/free-photo/support-community-aid-help-team-assistance-concept_53876-123806.jpg"
+        {
-            mediaAnimation="slide-up"
+          id: "f3",          title: "Do I need an account?",          content: "No, your reminders are stored locally in your browser so you can start right away."},
-            mediaPosition="right"
+      ]}
-            title="Common Questions"
+      imageSrc="http://img.b2bpic.net/free-photo/support-community-aid-help-team-assistance-concept_53876-123806.jpg"
-            description="Everything you need to know about using our study reminder platform effectively."
+      mediaAnimation="slide-up"
-            faqsAnimation="blur-reveal"
+      mediaPosition="right"
-            imageAlt="FAQ Help Support"
+      title="Common Questions"
-          />
+      description="Everything you need to know about using our study reminder platform effectively."
-        </div>
+      faqsAnimation="blur-reveal"
+      imageAlt="FAQ Help Support"
+    />
+  </div>
 
-        <div id="metric" data-section="metric">
+  <div id="metric" data-section="metric">
-          <MetricCardFourteen
+      <MetricCardFourteen
-            useInvertedBackground={false}
+      useInvertedBackground={false}
-            title="Proven Results"
+      title="Proven Results"
-            tag="Our Impact"
+      tag="Our Impact"
-            metrics={[
+      metrics={[
-              { id: "m1", value: "10k+", description: "Happy Students" },
+        {
-              { id: "m2", value: "50k+", description: "Sessions Scheduled" },
+          id: "m1",          value: "10k+",          description: "Happy Students"},
-              { id: "m3", value: "95%", description: "Goal Achievement" },
+        {
-              { id: "m4", value: "24/7", description: "Always Available" },
+          id: "m2",          value: "50k+",          description: "Sessions Scheduled"},
-            ]}
+        {
-            metricsAnimation="slide-up"
+          id: "m3",          value: "95%",          description: "Goal Achievement"},
-          />
+        {
-        </div>
+          id: "m4",          value: "24/7",          description: "Always Available"},
+      ]}
+      metricsAnimation="slide-up"
+    />
+  </div>
 
-        <div id="contact" data-section="contact">
+  <div id="contact" data-section="contact">
-          <ContactText
+      <ContactText
-            useInvertedBackground={true}
+      useInvertedBackground={true}
-            background={{ variant: "sparkles-gradient" }}
+      background={{
-            text="Ready to excel in your studies? Start organizing your schedule now."
+        variant: "sparkles-gradient"}}
-            buttons={[
+      text="Ready to excel in your studies? Start organizing your schedule now."
-              { text: "Start Organizing", href: "#" },
+      buttons={[
-            ]}
+        {
-          />
+          text: "Start Organizing",          href: "#"},
-        </div>
+      ]}
+    />
+  </div>
 
-        <div id="footer" data-section="footer">
+  <div id="footer" data-section="footer">
-          <FooterLogoReveal
+      <FooterLogoReveal
-            logoText="StudyReminder"
+      logoText="StudyReminder"
-            leftLink={{ text: "Privacy Policy", href: "#" }}
+      leftLink={{
-            rightLink={{ text: "Contact Support", href: "#" }}
+        text: "Privacy Policy",        href: "#"}}
-          />
+      rightLink={{
-        </div>
+        text: "Contact Support",        href: "#"}}
+    />
+  </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}