Added smoothe page scrolling across all pages using lenis

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@tailwindcss/vite": "^4.1.13",
+    "lenis": "^1.3.11",
     "lucide-react": "^0.542.0",
     "postcss": "^8.5.6",
     "react": "^19.1.1",
@@ -29,4 +30,4 @@
     "globals": "^16.3.0",
     "vite": "^7.1.2"
   }
-}
+}

src/App.jsx

@@ -1,4 +1,5 @@
-
+import { useEffect } from "react";
+import Lenis from "lenis";
 import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
 import Navbar from "./components/Navbar";
 import Footer from "./components/Footer";
@@ -10,6 +11,28 @@ import CommunityPage from "./pages/CommunityPage";
 import BackToTop from "./components/shared/BackToTop";
 
 export default function App() {
+  useEffect(() => {
+    // Initialize Lenis for smooth scroll
+    const lenis = new Lenis({
+      duration: 0.8, // scroll speed (1.2s for smooth flow)
+      easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)), // default easing
+      smooth: true,
+      smoothTouch: false, // disable smooth on mobile for performance
+    });
+
+    // RAF loop
+    const raf = (time) => {
+      lenis.raf(time);
+      requestAnimationFrame(raf);
+    };
+    requestAnimationFrame(raf);
+
+    // Cleanup when component unmounts
+    return () => {
+      lenis.destroy();
+    };
+  }, []);
+
   return (
     <Router>
       <div className="min-h-screen flex flex-col bg-gradient-to-br from-gray-100 to-indigo-50 dark:from-gray-900 dark:to-gray-800">