diff options
Diffstat (limited to 'components/home')
| -rw-r--r-- | components/home/content.js | 17 | ||||
| -rw-r--r-- | components/home/genres.js | 1 | ||||
| -rw-r--r-- | components/home/schedule.js | 27 |
3 files changed, 23 insertions, 22 deletions
diff --git a/components/home/content.js b/components/home/content.js index 651d276..678549c 100644 --- a/components/home/content.js +++ b/components/home/content.js @@ -13,8 +13,8 @@ import { parseCookies } from "nookies"; import { ChevronLeftIcon } from "@heroicons/react/20/solid"; import { ExclamationCircleIcon, PlayIcon } from "@heroicons/react/24/solid"; import { useRouter } from "next/router"; -import { toast } from "react-toastify"; import HistoryOptions from "./content/historyOptions"; +import { toast } from "sonner"; export default function Content({ ids, @@ -24,6 +24,7 @@ export default function Content({ og, userName, setRemoved, + type = "anime", }) { const router = useRouter(); @@ -53,6 +54,7 @@ export default function Content({ } else if (lang === "id") { setLang("id"); } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const [scrollLeft, setScrollLeft] = useState(false); @@ -174,14 +176,7 @@ export default function Content({ setRemoved(id || aniId); if (data?.message === "Episode deleted") { - toast.success("Episode removed from history", { - position: "bottom-right", - autoClose: 5000, - hideProgressBar: false, - closeOnClick: true, - draggable: true, - theme: "dark", - }); + toast.success("Episode removed from history"); } } else { if (id) { @@ -259,7 +254,7 @@ export default function Content({ href={ ids === "listManga" ? `/en/manga/${anime.id}` - : `/${lang}/anime/${anime.id}` + : `/en/${type}/${anime.id}` } className="hover:scale-105 hover:shadow-lg duration-300 ease-out group relative" title={anime.title.romaji} @@ -352,7 +347,7 @@ export default function Content({ href={ ids === "listManga" ? `/en/manga/${anime.id}` - : `/en/anime/${anime.id}` + : `/en/${type.toLowerCase()}/${anime.id}` } className="w-[135px] lg:w-[185px] line-clamp-2" title={anime.title.romaji} diff --git a/components/home/genres.js b/components/home/genres.js index f054fc9..cd247ce 100644 --- a/components/home/genres.js +++ b/components/home/genres.js @@ -47,6 +47,7 @@ export default function Genres() { } else if (lang === "id") { setLang("id"); } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( <div className="antialiased"> diff --git a/components/home/schedule.js b/components/home/schedule.js index a0ab691..bb35d08 100644 --- a/components/home/schedule.js +++ b/components/home/schedule.js @@ -48,21 +48,26 @@ export default function Schedule({ data, scheduleData, anime, update }) { <h1 className="font-bold font-karla text-[20px] lg:px-5"> Don't miss out! </h1> - <div className="rounded mb-5 shadow-md shadow-black"> + <div className="rounded mb-5 shadow-tersier/50 shadow-button"> <div className="overflow-hidden w-full h-[96px] lg:h-[10rem] rounded relative"> - <div className="absolute flex flex-col lg:gap-1 justify-center pl-5 lg:pl-16 rounded z-20 bg-gradient-to-r from-30% from-tersier to-transparent w-full h-full"> - <h1 className="text-xs lg:text-lg">Coming Up Next!</h1> - <div className="w-1/2 lg:w-2/5 hidden lg:block font-karla font-medium"> + <div className="absolute flex flex-col -space-y-1 lg:gap-1 justify-center pl-5 lg:pl-16 rounded z-20 bg-gradient-to-r from-30% from-tersier to-transparent w-full h-full"> + <h1 className="text-xs lg:text-lg font-karla font-thin"> + Coming Up Next! + </h1> + <div className="w-1/2 lg:w-2/5 hidden lg:flex font-karla font-semibold line-clamp-2"> <Link href={`/en/anime/${data.id}`} - className="hover:underline underline-offset-4 decoration-2 leading-3 lg:text-[1.5vw]" + className="hover:underline underline-offset-4 decoration-2 leading-8 line-clamp-2 lg:text-[1.5vw]" > {data.title.romaji || data.title.english || data.title.native} </Link> </div> - <h1 className="w-1/2 lg:hidden font-medium font-karla leading-9 text-white line-clamp-1"> + <Link + href={`/en/anime/${data.id}`} + className="w-1/2 lg:hidden font-medium font-karla leading-9 text-white line-clamp-1" + > {data.title.romaji || data.title.english || data.title.native} - </h1> + </Link> </div> {data.bannerImage ? ( <Image @@ -79,16 +84,16 @@ export default function Schedule({ data, scheduleData, anime, update }) { height={500} sizes="100vw" alt="banner next anime" - className="absolute z-10 top-0 right-0 h-full object-contain object-right brightness-[90%]" + className="absolute z-10 top-0 right-0 w-3/4 lg:w-auto h-full object-cover lg:object-contain object-right opacity-30 lg:opacity-100 brightness-[90%]" /> )} <div - className={`absolute flex justify-end items-center pr-5 gap-5 md:gap-10 z-20 w-1/2 h-full right-0 ${ - data.bannerImage ? "md:pr-16" : "md:pr-48" + className={`absolute flex justify-end items-center pr-5 gap-5 lg:gap-10 z-20 w-1/2 h-full right-0 ${ + data.bannerImage ? "lg:pr-16" : "lg:pr-48" }`} > {/* Countdown Timer */} - <div className="flex items-center gap-2 md:gap-5 font-bold font-karla text-sm md:text-xl"> + <div className="flex items-center gap-2 lg:gap-5 font-bold font-karla text-sm lg:text-xl"> {/* Countdown Timer */} <div className="flex flex-col items-center"> <span className="text-action/80">{day}</span> |