fixing footer

src/components/footer/Footer.jsx

@@ -4,55 +4,46 @@ import { Link } from "react-router-dom";
 
 function Footer() {
   return (
-    <footer className="flex flex-col w-full mt-[100px] px-4 max-[500px]:px-0">
-      <div
-        style={{ borderBottom: "1px solid rgba(255, 255, 255, .075)" }}
-        className="w-full text-left max-[500px]:hidden"
-      >
-        <img
-          src="https://i.postimg.cc/SsKY6Y9f/2H76i57.png"
-          alt={logoTitle}
-          className="w-[200px] h-[100px]"
-        />
-      </div>
-      <div className="flex py-5 flex-col w-full space-y-4 max-md:items-center max-[500px]:bg-[#373646]">
-        <div className="flex w-fit items-center space-x-6 max-[500px]:hidden">
-          <p className="text-2xl font-bold max-md:text-lg">A-Z LIST</p>
-          <p
-            style={{ borderLeft: "1px solid rgba(255, 255, 255, 0.6)" }}
-            className="text-md font-semibold pl-6"
-          >
-            Searching anime order by alphabet name A to Z
-          </p>
+    <footer className="w-full mt-16 bg-[#0a0a0a] border-t border-white/5">
+      <div className="max-w-[1920px] mx-auto px-4 py-6">
+        {/* Logo Section */}
+        <div className="hidden sm:block mb-6">
+          <img
+            src="/footer.png"
+            width={200}
+            alt={logoTitle}
+            className="h-16 w-auto object-contain"
+          />
         </div>
-        <div className="flex gap-x-[7px] flex-wrap justify-start gap-y-2 max-md:justify-start max-[500px]:hidden">
-          {[
-            "All",
-            "#",
-            "0-9",
-            ...Array.from({ length: 26 }, (_, i) =>
-              String.fromCharCode(65 + i)
-            ),
-          ].map((item, index) => (
-            <Link
-              to={`az-list/${item === "All" ? "" : item}`}
-              key={index}
-              className="text-lg bg-[#373646] px-2 rounded-md font-bold hover:text-black hover:bg-[#FFBADE] hover:cursor-pointer transition-all ease-out"
-            >
-              {item}
-            </Link>
-          ))}
+
+        {/* A-Z List Section */}
+        <div className="hidden sm:block mb-6">
+          <div className="flex items-center gap-4 mb-4 ">
+            <h2 className="text-sm font-medium text-white">A-Z LIST</h2>
+            <span className="text-sm text-white/60">Browse anime alphabetically</span>
+          </div>
+          <div className="flex flex-wrap gap-1.5">
+            {["All", "#", "0-9", ...Array.from({ length: 26 }, (_, i) => String.fromCharCode(65 + i))].map((item, index) => (
+              <Link
+                to={`az-list/${item === "All" ? "" : item}`}
+                key={index}
+                className="px-2.5 py-1 text-sm bg-white/5 hover:bg-white/10 text-white/60 hover:text-white rounded transition-colors"
+              >
+                {item}
+              </Link>
+            ))}
+          </div>
         </div>
-        <div className="flex flex-col w-full text-left space-y-2 pt-4 max-md:items-center max-[470px]:px-[5px]">
-          <p className="text-[#9B9BA3] text-[16px] max-md:text-center max-md:text-[12px]">
+
+        {/* Legal Text */}
+        <div className="space-y-2 text-sm text-white/40">
+          <p className="max-w-4xl">
             {website_name} does not host any files, it merely pulls streams from
             3rd party services. Legal issues should be taken up with the file
             hosts and providers. {website_name} is not responsible for any media
             files shown by the video providers.
           </p>
-          <p className="text-[#9B9BA3] max-md:text-[14px]">
-            © {website_name}. All rights reserved.
-          </p>
+          <p>© {website_name}. All rights reserved.</p>
         </div>
       </div>
     </footer>

src/components/sidebar/Sidebar.jsx

@@ -1,6 +1,6 @@
 import { FaChevronLeft } from "react-icons/fa";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faFilm, faRandom, faHome, faClock, faFire, faTv, faPlay, faCirclePlay, faFilePen, faPaperPlane } from "@fortawesome/free-solid-svg-icons";
+import { faFilm, faRandom, faHome, faClock, faFire, faTv, faPlay, faCirclePlay, faFilePen } from "@fortawesome/free-solid-svg-icons";
 import { useLanguage } from "@/src/context/LanguageContext";
 import { useEffect, useRef } from "react";
 import { Link, useLocation } from "react-router-dom";
@@ -16,7 +16,6 @@ const MENU_ITEMS = [
   { name: "OVAs", path: "/ova", icon: faCirclePlay },
   { name: "ONAs", path: "/ona", icon: faPlay },
   { name: "Specials", path: "/special", icon: faClock },
-  { name: "Join Telegram", path: "https://t.me/zenime_discussion", icon: faPaperPlane },
 ];
 
 const Sidebar = ({ isOpen, onClose }) => {