Remove 3 console error and add more styling to buttons and added a pa…

…rallex feature

package.json

@@ -12,7 +12,7 @@
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@mui/material": "^6.1.1",
-    "next": "14.2.13",
+    "next": "^15.0.1",
     "react": "^18",
     "react-dom": "^18",
     "react-icons": "^5.3.0",

src/app/layout.jsx

@@ -21,7 +21,7 @@ export default function RootLayout({ children }) {
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
-    const timeout = setTimeout(() => setIsLoading(false), 3000); // Simulated loading delay
+    const timeout = setTimeout(() => setIsLoading(false), 1700); // Simulated loading delay
     return () => clearTimeout(timeout);
   }, []);
 

src/app/page.jsx

@@ -30,30 +30,43 @@ export default function Home() {
       }, 600);
     }
   };
+
   return (
     <>
       <Navbar />
+      <div
+      id="fixed-image"
+      className="fixed top-[-10] left-0 w-full h-full z-[-1] bg-cover bg-center opacity-40"
+      style={{
+        backgroundImage: "url('https://gdg-oncampus-bu.github.io/landing-page/assets/image1.png')",
+        backgroundRepeat:"none",
+        backgroundSize:"cover",
+      }}
+    ></div>
 
       <div
         className="flex flex-col items-center justify-center min-h-screen p-8 pb-20 gap-8 sm:p-20 text-center"
-        style={{
-          // we are hardcoding the image url here due to gh pages and next contraints
-          backgroundImage: `url('https://gdg-oncampus-bu.github.io/landing-page/assets/image1.png')`,
-          backgroundSize: "contain",
-          backgroundRepeat: "no-repeat",
-          backgroundPosition: "bottom",
-        }}
       >
-        <h1 className="text-4xl sm:text-5xl font-bold text-white">
+        <h1 className="text-4xl sm:text-5xl font-bold text-white tracking-wide shadow-lg bg-gradient-to-r bg-white bg-clip-text text-transparent">
           We are GDG-BU
         </h1>
 
+
         <button
           onClick={scrollToSection}
-          className="rounded-full border border-solid border-transparent bg-foreground text-background hover:bg-[#383838] dark:hover:bg-[#ccc] text-lg sm:text-xl h-12 sm:h-14 px-6 sm:px-8 transition-colors"
+          className="flex items-center justify-center rounded-full border border-transparent bg-gradient-to-r bg-white text-black text-lg sm:text-xl h-10 sm:h-12 px-4 sm:px-6 transition-all duration-300 ease-in-out transform hover:scale-105 hover:shadow-xl hover:rotate-1 focus:outline-none focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-800"
         >
+          <svg
+            className="w-5 h-5 mr-2 animate-bounce"
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 20 20"
+            fill="currentColor"
+          >
+            <path d="M10 5a1 1 0 011 1v3h3a1 1 0 110 2h-3v3a1 1 0 11-2 0v-3H8a1 1 0 110-2h3V6a1 1 0 011-1z" />
+          </svg>
           Discover More
         </button>
+
       </div>
 
       {/* Second Section */}

src/components/Loader.jsx

@@ -10,8 +10,8 @@ export default function Loader() {
           <Image
             src={public_path+"/assets/logo_gdg.png"}
             alt="GDG Logo"
-            width={40}
-            height={20}
+            width={80}
+            height={40}
           />
         </div>
       </div>

src/components/Navbar.jsx

@@ -42,17 +42,19 @@ export default function Navbar() {
               height={32}
             />
 
-            <span className="self-center text-2xl font-semibold whitespace-nowrap dark:text-white">
-              GDG Bennett University
-            </span>
+        <span className="self-center text-3xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-500 to-blue-700 whitespace-nowrap dark:text-white shadow-lg">
+          GDG Bennett University
+        </span>
+
           </a>
           <div className="flex md:order-2 space-x-3 md:space-x-0 rtl:space-x-reverse">
-            <button
-              type="button"
-              className="text-white  hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 text-center dark:bg-blue-600 dark:hover: dark:focus:ring-blue-800"
-            >
-              Get started
-            </button>
+          <button
+            type="button"
+            className="bg-gradient-to-r from-blue-500 to-blue-700 text-white font-semibold rounded-full text-sm px-6 py-3 transition-all duration-300 ease-in-out transform hover:scale-105 hover:from-blue-600 hover:to-blue-800 focus:outline-none focus:ring-4 focus:ring-blue-300 shadow-lg shadow-blue-500/30 dark:shadow-blue-800/40"
+          >
+            Get Started
+          </button>
+
             <button
               data-collapse-toggle="navbar-sticky"
               type="button"
@@ -70,9 +72,9 @@ export default function Navbar() {
               >
                 <path
                   stroke="currentColor"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  stroke-width="2"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                  strokeWidth="2"
                   d="M1 1h15M1 7h15M1 13h15"
                 />
               </svg>