Nitya-003 · vedhapprakashni · Feb 4, 2026 · Feb 15, 2026 · Feb 16, 2026 · Feb 16, 2026
diff --git a/.eslintrc.js b/.eslintrc.js
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,6 +1,5 @@
 import './globals.css';
 import { ClientLayout } from '@/components/ClientLayout';
-import { Footer } from '@/components/Footer';
 import { BackToTop } from '@/components/BackToTop';
 import type { Metadata } from 'next';
 import { Inter } from 'next/font/google';
@@ -25,8 +24,6 @@ export default function RootLayout({
         <ClientLayout>
           {children}
         </ClientLayout>
-        {children}
-        <Footer />
         <BackToTop />
         <Toaster position="top-right" />
       </body>

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,92 +1,24 @@
 'use client';
 
-
 import { useState, useEffect } from 'react';
 import Link from 'next/link';
 import { motion } from 'framer-motion';
 import { MoodCard } from '@/components/MoodCard';
 import { SkeletonMoodCard } from '@/components/SkeletonMoodCard';
 import { FloatingBackground } from '@/components/FloatingBackground';
 import { ErrorState } from '@/components/ErrorState';
-
-import { motion } from 'framer-motion';
-import Link from 'next/link';
-import { FloatingBackground } from '@/components/FloatingBackground';
-import { Hero } from '@/components/landing/Hero';
-import { usePageTransition } from '@/components/TransitionProvider';
-
-import { Heart, BarChart3, Music } from 'lucide-react';
-
-export default function LandingPage() {
-  const { startTransition } = usePageTransition();
-  // Page transition variants
-  const pageVariants = {
-    initial: { 
-      opacity: 0,
-    },
-    animate: { 
-      opacity: 1,
-      transition: {
-        duration: 0.8,
-        ease: [0.25, 0.46, 0.45, 0.94],
-      }
-    },
-    exit: { 
-      opacity: 0,
-      scale: 0.98,
-      transition: {
-        duration: 0.4,
-        ease: 'easeInOut',
-      }
-    }
-  };
-const moods = [
-  { id: 'happy', name: 'Happy', emoji: '😊', color: '#FFD93D', glow: '#FFF176' },
-  { id: 'sad', name: 'Sad', emoji: '😢', color: '#42A5F5', glow: '#64B5F6' },
-  { id: 'anxious', name: 'Anxious', emoji: '😰', color: '#FF7043', glow: '#FF8A65' },
-  { id: 'excited', name: 'Excited', emoji: '🤩', color: '#AB47BC', glow: '#BA68C8' },
-  { id: 'calm', name: 'Calm', emoji: '😌', color: '#66BB6A', glow: '#81C784' },
-  { id: 'angry', name: 'Angry', emoji: '😡', color: '#EF5350', glow: '#E57373' },
-  { id: 'confused', name: 'Confused', emoji: '😕', color: '#FFA726', glow: '#FFB74D' },
-  { id: 'grateful', name: 'Grateful', emoji: '🙏', color: '#26A69A', glow: '#4DB6AC' },
-  { id: 'lonely', name: 'Lonely', emoji: '😔', color: '#7E57C2', glow: '#9575CD' },
-  { id: 'hopeful', name: 'Hopeful', emoji: '🌟', color: '#FFCA28', glow: '#FFD54F' },
-  { id: 'stressed', name: 'Stressed', emoji: '😤', color: '#FF5722', glow: '#FF6F00' },
-  { id: 'peaceful', name: 'Peaceful', emoji: '🕊️', color: '#4FC3F7', glow: '#81D4FA' },
-  { id: 'energized', name: 'Energized', emoji: '⚡', color: '#FFEB3B', glow: '#FFF176' },
-  { id: 'overwhelmed', name: 'Overwhelmed', emoji: '🤯', color: '#F06292', glow: '#F48FB1' },
-  { id: 'content', name: 'Content', emoji: '😊', color: '#AED581', glow: '#C5E1A5' },
-  { id: 'frustrated', name: 'Frustrated', emoji: '😠', color: '#FF8A65', glow: '#FFAB91' },
-  { id: 'inspired', name: 'Inspired', emoji: '💡', color: '#FFD740', glow: '#FFE082' },
-  { id: 'melancholy', name: 'Melancholy', emoji: '🌧️', color: '#90A4AE', glow: '#B0BEC5' },
-  { id: 'motivated', name: 'Motivated', emoji: '🔥', color: '#FF6D00', glow: '#FF8F00' },
-  { id: 'vulnerable', name: 'Vulnerable', emoji: '🥺', color: '#F8BBD9', glow: '#FCE4EC' },
-  { id: 'empowered', name: 'Empowered', emoji: '💪', color: '#6A1B9A', glow: '#8E24AA' },
-  { id: 'nostalgic', name: 'Nostalgic', emoji: '📸', color: '#D4A574', glow: '#DDBF94' },
-  { id: 'jealous', name: 'Jealous', emoji: '😒', color: '#8BC34A', glow: '#9CCC65' },
-  { id: 'proud', name: 'Proud', emoji: '😤', color: '#FF9800', glow: '#FFB74D' },
-  { id: 'curious', name: 'Curious', emoji: '🤔', color: '#9C27B0', glow: '#BA68C8' },
-  { id: 'bored', name: 'Bored', emoji: '😑', color: '#607D8B', glow: '#78909C' },
-  { id: 'surprised', name: 'Surprised', emoji: '😲', color: '#FF5722', glow: '#FF7043' },
-  { id: 'disgusted', name: 'Disgusted', emoji: '🤢', color: '#4CAF50', glow: '#66BB6A' },
-  { id: 'embarrassed', name: 'Embarrassed', emoji: '😳', color: '#E91E63', glow: '#F06292' },
-  { id: 'determined', name: 'Determined', emoji: '😤', color: '#3F51B5', glow: '#5C6BC0' },
-  { id: 'playful', name: 'Playful', emoji: '😜', color: '#FF4081', glow: '#FF80AB' },
-  { id: 'dreamy', name: 'Dreamy', emoji: '😴', color: '#9FA8DA', glow: '#C5CAE9' },
-  { id: 'adventurous', name: 'Adventurous', emoji: '🗺️', color: '#FF6F00', glow: '#FF8F00' },
-  { id: 'romantic', name: 'Romantic', emoji: '💕', color: '#E1BEE7', glow: '#F3E5F5' },
-  { id: 'creative', name: 'Creative', emoji: '🎨', color: '#FF7043', glow: '#FFAB91' },
-  { id: 'philosophical', name: 'Philosophical', emoji: '🤯', color: '#5E35B1', glow: '#7E57C2' },
-  { id: 'rebellious', name: 'Rebellious', emoji: '😈', color: '#D32F2F', glow: '#F44336' },
-  { id: 'silly', name: 'Silly', emoji: '🤪', color: '#FFC107', glow: '#FFD54F' }
-];
+import { Heart } from 'lucide-react';
+import { MoodData } from '@/lib/moodData';
 
 export default function Home() {
   const [selectedMoods, setSelectedMoods] = useState<string[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<boolean>(false);
   const maxSelections = 3;
 
+  // Use data from MoodData
+  const moods = Object.values(MoodData.moods);
+
   // Simulate API Fetch
   const fetchData = () => {
     setIsLoading(true);
@@ -96,38 +28,50 @@ export default function Home() {
     }, 2000);
   };
 
+  const [backgroundElements, setBackgroundElements] = useState<any[]>([]);
+
   useEffect(() => {
+    // Generate background elements on client side only to avoid hydration mismatch
+    const elements = [...Array(8)].map((_, i) => ({
+      color: ['#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEAA7', '#DDA0DD', '#98D8C8', '#F7DC6F'][i],
+      width: Math.random() * 300 + 100,
+      height: Math.random() * 300 + 100,
+      left: Math.random() * 100,
+      top: Math.random() * 100,
+      animateX: Math.random() * 100 - 50,
+      animateY: Math.random() * 100 - 50,
+      duration: 8 + Math.random() * 4
+    }));
+    setBackgroundElements(elements);
+
     fetchData();
   }, []);
 
   return (
-
     <div className="min-h-screen bg-gradient-to-br from-purple-900 via-blue-900 to-indigo-900 relative overflow-x-hidden">
 
-      {/* ACCESSIBILITY UPDATE: 
-        Added aria-hidden="true" to background elements so screen readers ignore them.
-      */}
+      {/* Background elements */}
       <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
         <div className="absolute inset-0 overflow-hidden">
-          {[...Array(8)].map((_, i) => (
+          {backgroundElements.map((element, i) => (
             <motion.div
               key={i}
               className="absolute rounded-full opacity-20"
               style={{
-                background: `radial-gradient(circle, ${['#FF6B6B', '#4ECDC4', '#45B7D1', '#96CEB4', '#FFEAA7', '#DDA0DD', '#98D8C8', '#F7DC6F'][i]} 0%, transparent 70%)`,
-                width: Math.random() * 300 + 100,
-                height: Math.random() * 300 + 100,
-                left: `${Math.random() * 100}%`,
-                top: `${Math.random() * 100}%`,
+                background: `radial-gradient(circle, ${element.color} 0%, transparent 70%)`,
+                width: element.width,
+                height: element.height,
+                left: `${element.left}%`,
+                top: `${element.top}%`,
               }}
               animate={{
-                x: [0, Math.random() * 100 - 50],
-                y: [0, Math.random() * 100 - 50],
+                x: [0, element.animateX],
+                y: [0, element.animateY],
                 scale: [1, 1.2, 1],
                 opacity: [0.1, 0.3, 0.1]
               }}
               transition={{
-                duration: 8 + Math.random() * 4,
+                duration: element.duration,
                 repeat: Infinity,
                 ease: "easeInOut",
                 delay: i * 0.5
@@ -148,120 +92,18 @@ export default function Home() {
           <div className="flex items-center space-x-2">
             <Heart className="text-pink-400 w-6 h-6 md:w-8 md:h-8" />
             <h1 className="text-2xl md:text-3xl font-bold bg-gradient-to-r from-pink-400 to-purple-400 bg-clip-text text-transparent">
-
-    <motion.div 
-      variants={pageVariants}
-      initial="initial"
-      animate="animate"
-      exit="exit"
-      className="min-h-screen bg-gradient-to-br from-purple-900 via-blue-900 to-indigo-900 relative overflow-hidden"
-    >
-      {/* Soft Animated Background - Slower and more subtle for landing */}
-      <div className="absolute inset-0 overflow-hidden">
-        {[...Array(6)].map((_, i) => (
-          <motion.div
-            key={i}
-            className="absolute rounded-full"
-            style={{
-              background: `radial-gradient(circle, ${[
-                'rgba(139, 92, 246, 0.15)',
-                'rgba(236, 72, 153, 0.12)',
-                'rgba(59, 130, 246, 0.15)',
-                'rgba(167, 139, 250, 0.12)',
-                'rgba(244, 114, 182, 0.10)',
-                'rgba(96, 165, 250, 0.12)'
-              ][i]} 0%, transparent 70%)`,
-              width: 300 + i * 50,
-              height: 300 + i * 50,
-              left: `${[10, 70, 20, 80, 50, 30][i]}%`,
-              top: `${[20, 60, 70, 10, 40, 80][i]}%`,
-              transform: 'translate(-50%, -50%)',
-            }}
-            animate={{
-              x: [0, 30, -30, 0],
-              y: [0, -20, 20, 0],
-              scale: [1, 1.1, 0.95, 1],
-              opacity: [0.3, 0.5, 0.3],
-            }}
-            transition={{
-              duration: 15 + i * 2,
-              repeat: Infinity,
-              ease: "easeInOut",
-              delay: i * 1.5,
-            }}
-          />
-        ))}
-      </div>
-
-      <FloatingBackground />
-
-      {/* Minimal Header for Landing */}
-      <motion.header
-        initial={{ opacity: 0, y: -20 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ delay: 0.2, duration: 0.6 }}
-        className="relative z-10 p-6"
-      >
-        <div className="max-w-6xl mx-auto flex justify-between items-center">
-          <div className="flex items-center space-x-2">
-            <Heart className="text-pink-400 w-7 h-7" />
-            <span className="text-2xl font-semibold bg-gradient-to-r from-pink-400 to-purple-400 bg-clip-text text-transparent">
-
               InnerHue
-            </span>
+            </h1>
           </div>
-
 
-          <nav className="flex space-x-3 md:space-x-4">
-            <Link href="/analytics" aria-label="View Analytics">
-              <motion.div 
-
-
-          <nav className="flex space-x-3">
-            <motion.button
-              onClick={() => startTransition('/explore')}
-              whileHover={{ scale: 1.05 }}
-              className="px-4 py-2 rounded-full bg-white/5 backdrop-blur-xl text-white/70 text-sm font-medium 
-                         hover:bg-white/10 hover:text-white transition-all duration-300 border border-white/10"
-            >
-              Explore
-            </motion.button>
-            <Link href="/analytics">
-              <motion.div
-
-                whileHover={{ scale: 1.05 }}
-                className="p-2 rounded-full bg-white/5 backdrop-blur-xl hover:bg-white/10 transition-all duration-300 border border-white/10"
-              >
-
-                <BarChart3 className="w-5 h-5 md:w-6 md:h-6 text-white" />
-              </motion.div>
-            </Link>
-            <Link href="/music" aria-label="Relaxing Music">
-              <motion.div 
-
-                <BarChart3 className="w-5 h-5 text-white/70 hover:text-white" />
-              </motion.div>
-            </Link>
-            <Link href="/music">
-              <motion.div
-
-                whileHover={{ scale: 1.05 }}
-                className="p-2 rounded-full bg-white/5 backdrop-blur-xl hover:bg-white/10 transition-all duration-300 border border-white/10"
-              >
-
-                <Music className="w-5 h-5 md:w-6 md:h-6 text-white" />
-
-                <Music className="w-5 h-5 text-white/70 hover:text-white" />
-
-              </motion.div>
+          <nav className="flex space-x-4">
+            <Link href="/analytics" className="text-white/70 hover:text-white transition-colors">
+               Analytics
             </Link>
           </nav>
         </div>
       </motion.header>
 
-      {/* Hero Section */}
-      <Hero />
-    </motion.div>
       {/* Main Content */}
       <main className="relative z-10 px-4 md:px-6 pb-20">
         <div className="max-w-6xl mx-auto">
@@ -364,4 +206,4 @@ export default function Home() {
       </main>
     </div>
   );
-}
+}
diff --git a/app/test/page.tsx b/app/test/page.tsx
@@ -1,11 +1,19 @@
 'use client';
 
+import { useState, useEffect } from 'react';
+
 export default function TestPage() {
+  const [time, setTime] = useState<string>('');
+
+  useEffect(() => {
+    setTime(new Date().toLocaleString());
+  }, []);
+
   return (
     <div style={{ padding: '20px', fontFamily: 'Arial' }}>
       <h1>Test Page - InnerHue</h1>
       <p>If you can see this, Next.js is working!</p>
-      <p>Current time: {new Date().toLocaleString()}</p>
+      <p>Current time: {time}</p>
       <style jsx>{`
         h1 { color: purple; }
         p { color: #333; }