fix(app): removed AlanAiComponent causing bug #441

Author: theunhackable

next.config.js

@@ -1,6 +1,9 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
+  images: {
+   domains:['avatars.githubusercontent.com'],        
+  }
 };
 
 module.exports = nextConfig;

src/components/Navbar.jsx

@@ -15,7 +15,7 @@ const Navbar = () => {
   ];
   let [open, setOpen] = useState(false);
   return (
-    <div className="w-full z-999 top-0 left-0 sticky bg-black bg-opacity-75 shadow-lg">
+    <div className="w-full z-999 top-0 left-0 sticky bg-black/75 backdrop-blur-sm shadow-lg">
       <div className="md:flex md:items-center md:justify-between py-4 px-7">
         <div className="font-bold text-base cursor-pointer flex flex-col md:items-center font-secondary text-white">
           <span>
@@ -37,7 +37,7 @@ const Navbar = () => {
             >
               <Link
                 href={link.link}
-                className="text-white font-3 hover:text-transparent bg-clip-text bg-gradient-to-r from-[#AF7AF2] via-[#A5F7A8] to-[#AF7AF2] duration-200 relative  transition-all duration-500 before:content-[''] before:absolute before:-bottom-2 before:left-0 before:w-0 before:h-1 before:opacity-0  before:transition-all before:duration-500 before:bg-gradient-to-r hover:before:w-full  hover:before:opacity-100"
+                className="text-white font-3 hover:text-transparent bg-clip-text bg-gradient-to-r from-[#AF7AF2] via-[#A5F7A8] to-[#AF7AF2] relative  transition-all duration-200 before:content-[''] before:absolute before:-bottom-2 before:left-0 before:w-0 before:h-1 before:opacity-0  before:transition-all before:duration-500 before:bg-gradient-to-r hover:before:w-full  hover:before:opacity-100"
               >
                 {link.name}
               </Link>

src/pages/Contributors.js

@@ -1,6 +1,7 @@
 import Footer from "@/components/Footer";
 import Navbar from "@/components/Navbar";
 import axios from "axios";
+import Image from "next/image";
 import { useEffect, useState } from "react";
 import { BsGithub } from "react-icons/bs";
 
@@ -31,13 +32,13 @@ const Contributors = () => {
       </h1>
       <div className="contributor-container relative z-[1] flex justify-center items-center flex-wrap p-[1em]">
         {contributors.map((i) => (
-          <div className="contributor-card relative w-[300px] h-[400px] shadow-[0_15px_35px_rgba(0,0,0,0.9)] flex justify-center items-center flex-col backdrop-blur-2xl bg-clip-padding shadow-[0px_10px_10px_rgba(46,54,68,0.03)] m-[1em] rounded-[15px] border-[solid] border-transparent bg-gray-900 cursor-auto" key={i.login}>
+          <div className="contributor-card relative w-[300px] h-[400px] shadow-[0_15px_35px_rgba(0,0,0,0.9)] flex justify-center items-center flex-col backdrop-blur-2xl bg-clip-padding  m-[1em] rounded-[15px]  bg-gray-900 cursor-auto" key={i.login}>
             <div className="contributor-content  relative flex justify-center items-center flex-col opacity-50 transition duration-[0.5s]">
-              <div class="relative w-[150px] h-[150px] overflow-hidden rounded-[50%] border-[10px] border-solid border-[rgba(0,0,0,0.25)]">
-                <img className="absolute w-full h-full object-cover left-0 top-0" src={i.avatar_url} alt={i.login} />
+              <div className="relative w-[150px] h-[150px] overflow-hidden rounded-[50%] border-[10px] border-solid border-[rgba(0,0,0,0.25)]">
+                <Image className="absolute w-full h-full object-cover left-0 top-0" src={i.avatar_url} alt={i.login} width={400} height={400} />
               </div>
 
-              <div class="contributor-details">
+              <div className="contributor-details">
                 <h3 className="text-white uppercase tracking-[2px] font-medium text-lg text-center leading-[1.1em] mt-5 mb-2.5 mx-0">
                   {i.login}<br />
                   <span className="text-xs font-light">Commits: {i.contributions}</span>

src/pages/_app.js

@@ -1,11 +1,8 @@
 import "@/styles/globals.css";
-import AlanAIComponent from "./alan";
 
 export default function App({ Component, pageProps }) {
   return (
     <>
-      {/* <AlanAIComponent/> */}
-      <AlanAIComponent />
       <Component {...pageProps} />
     </>
   );

src/pages/events/index.jsx

@@ -51,7 +51,7 @@ const Events = () => {
       link: "/events/spaces",
     },
   ];
-  const [EventsData, SetEventsData] = useState(eventsData);
+  const [EventsData,] = useState(eventsData);
   const FilteredData = EventsData.filter((event) =>
     event.name.toLowerCase().includes(searchInput.toLowerCase())
   );
@@ -88,7 +88,7 @@ const Events = () => {
             data-aos-duration="500"
           >
             <h1 className="text-5xl mb-7 font-bold text-blue-500">Features</h1>
-            <p className="team-description text-left ml-3 text-3xl">
+            <ul className="team-description text-left ml-3 text-3xl">
               <li className="mb-5">Networking Opportunities</li>
               <li className="mb-5">Learning from Industry Experts</li>
               <li className="mb-5">Collaboration and Partnership <span className="ml-10">Opportunities</span> </li>