fixing footer

This commit is contained in:
Tejas Panchal
2025-07-27 15:22:17 +05:30
parent 3bd074bfd8
commit 2a4a3e33fb
3 changed files with 34 additions and 44 deletions

BIN
public/footer.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

View File

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

View File

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