aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/app/anime/[id]/page.jsx74
-rw-r--r--src/app/anime/components/infoTabs.jsx4
-rw-r--r--src/app/anime/components/search_results.jsx3
-rw-r--r--src/app/anime/page.jsx11
-rw-r--r--src/app/components/header/header.jsx28
-rw-r--r--src/app/kdrama/[id]/page.jsx74
-rw-r--r--src/app/kdrama/components/searchFormatter.jsx7
-rw-r--r--src/app/kdrama/page.jsx7
-rw-r--r--src/app/manga/[id]/page.jsx61
-rw-r--r--src/app/movies/[id]/page.jsx76
-rw-r--r--src/app/movies/components/descriptionTabs.jsx6
-rw-r--r--src/app/movies/components/searchFormatter.jsx7
-rw-r--r--src/app/movies/components/videoPlayer.jsx4
-rw-r--r--src/app/movies/page.jsx7
-rw-r--r--src/app/web-series/[id]/page.jsx76
-rw-r--r--src/app/web-series/components/descriptionTabs.jsx8
-rw-r--r--src/app/web-series/components/seriesSearchFormatter.jsx7
-rw-r--r--src/app/web-series/components/videoPlayer.jsx4
-rw-r--r--src/app/web-series/page.jsx7
19 files changed, 242 insertions, 229 deletions
diff --git a/src/app/anime/[id]/page.jsx b/src/app/anime/[id]/page.jsx
index 6740aac..53c125e 100644
--- a/src/app/anime/[id]/page.jsx
+++ b/src/app/anime/[id]/page.jsx
@@ -15,49 +15,39 @@ const AnimeInfoHomepage = async ({ params }) => {
}
return (
- <section
- style={{
- backgroundImage: `radial-gradient(gray 1px, transparent 1px)`,
- backgroundSize: "40px 40px",
- }}
- className="h-screen bg-white dark:bg-black"
- >
- <section className="absolute inset-0 bg-gradient-to-b from-transparent to-white dark:to-black">
- <section className="m-auto pt-16 lg:w-9/12">
- <div className="flex items-center justify-center md:justify-start lg:justify-start">
- <Image
- isBlurred
- width={190}
- src={data.image.toString()}
- alt="Anime Title Poster"
- className="m-2"
- />
- <div className="mx-5">
- <h4 className={`text-2xl`}>
- <strong>{data.title}</strong>
- </h4>
- <div>
- {data.genres &&
- data.genres.map((item, index) => (
- <Chip
- key={index}
- color="warning"
- variant="faded"
- className="mb-1 mr-1"
- >
- <p className="text-xs">{item}</p>
- </Chip>
- ))}
- </div>
- </div>
+ <section className="m-auto lg:w-9/12">
+ <div className="flex items-center justify-center md:justify-start lg:justify-start">
+ <Image
+ isBlurred
+ width={190}
+ src={data.image.toString()}
+ alt="Anime Title Poster"
+ className="m-2"
+ />
+ <div className="mx-5">
+ <h4 className={`text-2xl`}>
+ <strong>{data.title}</strong>
+ </h4>
+ <div>
+ {data.genres &&
+ data.genres.map((item, index) => (
+ <Chip
+ key={index}
+ color="warning"
+ variant="faded"
+ className="mb-1 mr-1"
+ >
+ <p className="text-xs">{item}</p>
+ </Chip>
+ ))}
</div>
- <DescriptionTabs data={data} />
- <EpisodesContainer data={data} />
- <br />
- <br />
- <br />
- </section>
- </section>
+ </div>
+ </div>
+ <DescriptionTabs data={data} />
+ <EpisodesContainer data={data} />
+ <br />
+ <br />
+ <br />
</section>
);
};
diff --git a/src/app/anime/components/infoTabs.jsx b/src/app/anime/components/infoTabs.jsx
index 68a1da1..aa0e9db 100644
--- a/src/app/anime/components/infoTabs.jsx
+++ b/src/app/anime/components/infoTabs.jsx
@@ -9,14 +9,14 @@ export default function DescriptionTabs({ data: data }) {
<div className="flex w-full flex-col">
<Tabs aria-label="Options" className={lexend.className}>
<Tab key="description" title="Description">
- <Card>
+ <Card shadow="sm">
<CardBody className={atkinson.className}>
{data.description || "No description found"}
</CardBody>
</Card>
</Tab>
<Tab key="episodes" title="Details">
- <Card>
+ <Card shadow="sm">
<CardBody className={atkinson.className}>
<h4>
<strong>Episodes</strong>:{" "}
diff --git a/src/app/anime/components/search_results.jsx b/src/app/anime/components/search_results.jsx
index ba5c7cf..bf9ec28 100644
--- a/src/app/anime/components/search_results.jsx
+++ b/src/app/anime/components/search_results.jsx
@@ -27,7 +27,8 @@ const SearchResults = async (title) => {
<Card
className="overflow-hidden"
isPressable
- shadow="lg"
+ isHoverable
+ shadow="sm"
>
<CardBody>
<Image
diff --git a/src/app/anime/page.jsx b/src/app/anime/page.jsx
index bb8d6f1..d06b344 100644
--- a/src/app/anime/page.jsx
+++ b/src/app/anime/page.jsx
@@ -35,14 +35,19 @@ const AnimeHomepage = async () => {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-visible" isPressable>
+ <Card
+ className="overflow-visible"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Anime Poster"
src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=${item.image}`}
width={270}
- height={160}
- className="h-60 overflow-hidden rounded-md"
+ height={170}
+ className="h-64 overflow-hidden rounded-md"
priority
/>
</CardBody>
diff --git a/src/app/components/header/header.jsx b/src/app/components/header/header.jsx
index 950b807..1ea4f13 100644
--- a/src/app/components/header/header.jsx
+++ b/src/app/components/header/header.jsx
@@ -16,7 +16,33 @@ export default async function Header() {
<Link href="/">Dramalama</Link>
</p>
</NavbarBrand>
-
+ <NavbarContent className="hidden sm:flex gap-4" justify="center">
+ <NavbarItem>
+ <Link href="/anime" className="text-sky-400">
+ Anime
+ </Link>
+ </NavbarItem>
+ <NavbarItem>
+ <Link href="/kdrama" className="text-green-300">
+ K-Dramas
+ </Link>
+ </NavbarItem>
+ <NavbarItem>
+ <Link href="/manga" className="text-orange-400">
+ Manga
+ </Link>
+ </NavbarItem>
+ <NavbarItem>
+ <Link href="/web-series" className="text-violet-300">
+ TV shows
+ </Link>
+ </NavbarItem>
+ <NavbarItem>
+ <Link href="/movies" className="text-teal-400">
+ Movies
+ </Link>
+ </NavbarItem>
+ </NavbarContent>
<NavbarContent justify="end">
<NavbarItem>
<ThemeSwitcher />
diff --git a/src/app/kdrama/[id]/page.jsx b/src/app/kdrama/[id]/page.jsx
index b18c0ee..b931760 100644
--- a/src/app/kdrama/[id]/page.jsx
+++ b/src/app/kdrama/[id]/page.jsx
@@ -11,49 +11,39 @@ export default async function DramaInfo({ params }) {
PreFetchVideoLinks(data.episodes, data.id);
return (
- <section
- style={{
- backgroundImage: `radial-gradient(gray 1px, transparent 1px)`,
- backgroundSize: "40px 40px",
- }}
- className="h-screen bg-white dark:bg-black"
- >
- <section className="to-white-400 absolute inset-0 bg-gradient-to-b from-transparent dark:to-black">
- <section className="m-auto pt-16 lg:w-9/12">
- <div className="flex items-center justify-center md:justify-start lg:justify-start">
- <Image
- isBlurred
- width={190}
- src={data.image.toString()}
- alt="Anime Title Poster"
- className="m-2"
- />
- <div className="mx-5">
- <h4 className={`text-2xl`}>
- <strong>{data.title}</strong>
- </h4>
- <div className="mt-1">
- {data.genres &&
- data.genres.map((item, index) => (
- <Chip
- key={index}
- color="warning"
- variant="faded"
- className="mb-1 mr-1"
- >
- <p className="text-xs">{item}</p>
- </Chip>
- ))}
- </div>
- </div>
+ <section className="m-auto lg:w-9/12">
+ <div className="flex items-center justify-center md:justify-start lg:justify-start">
+ <Image
+ isBlurred
+ width={190}
+ src={data.image.toString()}
+ alt="Anime Title Poster"
+ className="m-2"
+ />
+ <div className="mx-5">
+ <h4 className={`text-2xl`}>
+ <strong>{data.title}</strong>
+ </h4>
+ <div className="mt-1">
+ {data.genres &&
+ data.genres.map((item, index) => (
+ <Chip
+ key={index}
+ color="warning"
+ variant="faded"
+ className="mb-1 mr-1"
+ >
+ <p className="text-xs">{item}</p>
+ </Chip>
+ ))}
</div>
- <DescriptionTabs data={data} />
- <EpisodesContainer data={data} />
- <br />
- <br />
- <br />
- </section>
- </section>
+ </div>
+ </div>
+ <DescriptionTabs data={data} />
+ <EpisodesContainer data={data} />
+ <br />
+ <br />
+ <br />
</section>
);
}
diff --git a/src/app/kdrama/components/searchFormatter.jsx b/src/app/kdrama/components/searchFormatter.jsx
index 21a52a5..fad1585 100644
--- a/src/app/kdrama/components/searchFormatter.jsx
+++ b/src/app/kdrama/components/searchFormatter.jsx
@@ -19,7 +19,12 @@ const SearchedDataFormatter = async (data) => {
className="mx-1 flex flex-col items-center"
title={item.title}
>
- <Card className="overflow-hidden" isPressable>
+ <Card
+ className="overflow-hidden"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Searched Kdrama Poster"
diff --git a/src/app/kdrama/page.jsx b/src/app/kdrama/page.jsx
index f5e1e0e..3f57967 100644
--- a/src/app/kdrama/page.jsx
+++ b/src/app/kdrama/page.jsx
@@ -34,7 +34,12 @@ const KdramaHomepage = async () => {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-visible" isPressable>
+ <Card
+ className="overflow-visible"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Kdrama Poster"
diff --git a/src/app/manga/[id]/page.jsx b/src/app/manga/[id]/page.jsx
index d6828b2..f048b06 100644
--- a/src/app/manga/[id]/page.jsx
+++ b/src/app/manga/[id]/page.jsx
@@ -10,39 +10,34 @@ const MangaInfoPage = async ({ params }) => {
const data = await MangaInfoResults(id);
return (
- <section>
- <section>
- <section className="m-auto w-full lg:w-9/12">
- {/* header section */}
- <div className="flex items-center p-2">
- <Image
- src={data.image}
- width={170}
- height={280}
- className="rounded-lg"
- alt="Manga Poster"
- />
- <div className="ml-2">
- <h3 className="text-2xl">
- {data.title.english || data.title.romaji}
- </h3>
- {data.genres &&
- data.genres.map((item, index) => (
- <Chip
- key={index}
- color="warning"
- variant="faded"
- size="sm"
- className="mr-1"
- >
- {item}
- </Chip>
- ))}
- </div>
- </div>
- <MangaDescriptionTabs data={data} />
- </section>
- </section>
+ <section className="m-auto w-full lg:w-9/12">
+ <div className="flex items-center p-2">
+ <Image
+ src={data.image}
+ width={170}
+ height={280}
+ className="rounded-lg"
+ alt="Manga Poster"
+ />
+ <div className="ml-2">
+ <h3 className="text-2xl">
+ {data.title.english || data.title.romaji}
+ </h3>
+ {data.genres &&
+ data.genres.map((item, index) => (
+ <Chip
+ key={index}
+ color="warning"
+ variant="faded"
+ size="sm"
+ className="mr-1"
+ >
+ {item}
+ </Chip>
+ ))}
+ </div>
+ </div>
+ <MangaDescriptionTabs data={data} />
</section>
);
};
diff --git a/src/app/movies/[id]/page.jsx b/src/app/movies/[id]/page.jsx
index 04fba97..e60d6d9 100644
--- a/src/app/movies/[id]/page.jsx
+++ b/src/app/movies/[id]/page.jsx
@@ -11,51 +11,39 @@ const MovieInfoPage = async ({ params }) => {
const data = await MovieInfoData(id);
return (
- <section
- style={{
- backgroundImage: `radial-gradient(gray 1px, transparent 1px)`,
- backgroundSize: "40px 40px",
- }}
- className="h-screen bg-white dark:bg-black"
- >
- <section className="absolute inset-0 bg-gradient-to-b from-transparent to-white-400 dark:to-black">
- <section className="pt-12 m-auto w-full lg:w-9/12">
- <MovieVideoPlayer id={data.id} />
- <div className="flex items-center">
- <Image
- isBlurred
- shadow="lg"
- src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${data.poster_path}`}
- width={180}
- height={300}
- alt="Anime Title Poster"
- className="m-2"
- ></Image>
- <div className="mx-5">
- <h4 className={`text-2xl`}>
- <strong>{data.title}</strong>
- </h4>
- <div className="mt-1">
- {data.genres &&
- data.genres.map((item, index) => (
- <Chip
- key={index}
- color="warning"
- variant="faded"
- className="mr-1 mb-1"
- >
- <p className="text-xs">
- {item.name}
- </p>
- </Chip>
- ))}
- </div>
- </div>
+ <section className="pt-2 m-auto w-full lg:w-9/12">
+ <MovieVideoPlayer id={data.id} />
+ <div className="flex items-center">
+ <Image
+ isBlurred
+ shadow="md"
+ src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${data.poster_path}`}
+ width={180}
+ height={300}
+ alt="Anime Title Poster"
+ className="m-2"
+ ></Image>
+ <div className="mx-5">
+ <h4 className={`text-2xl`}>
+ <strong>{data.title}</strong>
+ </h4>
+ <div className="mt-1">
+ {data.genres &&
+ data.genres.map((item, index) => (
+ <Chip
+ key={index}
+ color="warning"
+ variant="faded"
+ className="mr-1 mb-1"
+ >
+ <p className="text-xs">{item.name}</p>
+ </Chip>
+ ))}
</div>
- <DescriptionTabs data={data} />
- <Questions />
- </section>
- </section>
+ </div>
+ </div>
+ <DescriptionTabs data={data} />
+ <Questions />
</section>
);
};
diff --git a/src/app/movies/components/descriptionTabs.jsx b/src/app/movies/components/descriptionTabs.jsx
index 7eec2fb..dc11939 100644
--- a/src/app/movies/components/descriptionTabs.jsx
+++ b/src/app/movies/components/descriptionTabs.jsx
@@ -11,14 +11,14 @@ export default function DescriptionTabs({ data: data }) {
<div className="flex w-full flex-col">
<Tabs aria-label="Options" className={lexend.className}>
<Tab key="description" title="Description">
- <Card>
+ <Card shadow="sm">
<CardBody className={atkinson.className}>
{data.overview || "No description found"}
</CardBody>
</Card>
</Tab>
<Tab key="episodes" title="Details">
- <Card>
+ <Card shadow="sm">
<CardBody className={lexend.className}>
<h4>
<strong>Tagline</strong>:{" "}
@@ -62,7 +62,7 @@ export default function DescriptionTabs({ data: data }) {
</Card>
</Tab>
<Tab key="download" title="Download">
- <Card>
+ <Card shadow="sm">
<CardBody className={lexend.className}>
<h4 className="flex items-center">
<Link
diff --git a/src/app/movies/components/searchFormatter.jsx b/src/app/movies/components/searchFormatter.jsx
index f6a578e..d241d7b 100644
--- a/src/app/movies/components/searchFormatter.jsx
+++ b/src/app/movies/components/searchFormatter.jsx
@@ -18,7 +18,12 @@ const MovieSearchFormatter = async (data) => {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-hidden" isPressable>
+ <Card
+ className="overflow-hidden"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Searched Movie Poster"
diff --git a/src/app/movies/components/videoPlayer.jsx b/src/app/movies/components/videoPlayer.jsx
index 154d633..12885da 100644
--- a/src/app/movies/components/videoPlayer.jsx
+++ b/src/app/movies/components/videoPlayer.jsx
@@ -2,11 +2,11 @@ const MovieVideoPlayer = async ({ id: id }) => {
const videoFrameGenerator = (id) => {
return (
<iframe
- src={`https://vidsrc.pro/embed/movie/${id}?player=new`}
+ src={`https://vidsrc.pro/embed/movie/${id}`}
allowFullScreen
referrerPolicy="origin"
height={720}
- className="w-full h-[240px] lg:h-[720px]"
+ className="w-full h-[240px] lg:h-[720px] rounded-lg"
></iframe>
);
};
diff --git a/src/app/movies/page.jsx b/src/app/movies/page.jsx
index a0b8963..84ce9d6 100644
--- a/src/app/movies/page.jsx
+++ b/src/app/movies/page.jsx
@@ -33,7 +33,12 @@ export default async function MovieHomepage() {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-visible" isPressable>
+ <Card
+ className="overflow-visible"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Movie Poster"
diff --git a/src/app/web-series/[id]/page.jsx b/src/app/web-series/[id]/page.jsx
index f3922de..c947f5a 100644
--- a/src/app/web-series/[id]/page.jsx
+++ b/src/app/web-series/[id]/page.jsx
@@ -11,51 +11,39 @@ const SeriesInfoPage = async ({ params }) => {
const data = await SERIES_INFO(id);
return (
- <section
- style={{
- backgroundImage: `radial-gradient(gray 1px, transparent 1px)`,
- backgroundSize: "40px 40px",
- }}
- className="h-screen bg-white dark:bg-black"
- >
- <section className="to-white-400 absolute inset-0 bg-gradient-to-b from-transparent dark:to-black">
- <section className="m-auto w-full pt-20 lg:w-9/12">
- <SeriesVideoPlayer id={data.id} />
- <div className="flex items-center">
- <Image
- isBlurred
- shadow="lg"
- src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${data.poster_path}`}
- width={180}
- height={300}
- alt="Anime Title Poster"
- className="m-2"
- ></Image>
- <div className="mx-5">
- <h4 className={`text-2xl`}>
- <strong>{data.name}</strong>
- </h4>
- <div className="mt-1">
- {data.genres &&
- data.genres.map((item, index) => (
- <Chip
- key={index}
- color="warning"
- variant="faded"
- className="mb-1 mr-1"
- >
- <p className="text-xs">
- {item.name}
- </p>
- </Chip>
- ))}
- </div>
- </div>
+ <section className="m-auto w-full pt-2 lg:w-9/12">
+ <SeriesVideoPlayer id={data.id} />
+ <div className="flex items-center">
+ <Image
+ isBlurred
+ shadow="md"
+ src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${data.poster_path}`}
+ width={180}
+ height={300}
+ alt="Anime Title Poster"
+ className="m-2"
+ ></Image>
+ <div className="mx-5">
+ <h4 className={`text-2xl`}>
+ <strong>{data.name}</strong>
+ </h4>
+ <div className="mt-1">
+ {data.genres &&
+ data.genres.map((item, index) => (
+ <Chip
+ key={index}
+ color="warning"
+ variant="faded"
+ className="mb-1 mr-1"
+ >
+ <p className="text-xs">{item.name}</p>
+ </Chip>
+ ))}
</div>
- <SeriesDescriptionTabs data={data} />
- <Questions />
- </section>
- </section>
+ </div>
+ </div>
+ <SeriesDescriptionTabs data={data} />
+ <Questions />
</section>
);
};
diff --git a/src/app/web-series/components/descriptionTabs.jsx b/src/app/web-series/components/descriptionTabs.jsx
index ec6a78b..d0a4945 100644
--- a/src/app/web-series/components/descriptionTabs.jsx
+++ b/src/app/web-series/components/descriptionTabs.jsx
@@ -19,14 +19,14 @@ export default function SeriesDescriptionTabs({ data: data }) {
<div className="flex w-full flex-col">
<Tabs aria-label="Options" className={lexend.className}>
<Tab key="description" title="Description">
- <Card>
+ <Card shadow="sm">
<CardBody className={atkinson.className}>
{data.overview || "No description found"}
</CardBody>
</Card>
</Tab>
<Tab key="episodes" title="Details">
- <Card>
+ <Card shadow="sm">
<CardBody className={lexend.className}>
<h4>
<strong>Tagline</strong>:{" "}
@@ -86,7 +86,7 @@ export default function SeriesDescriptionTabs({ data: data }) {
</Card>
</Tab>
<Tab key="seasons" title="Seasons">
- <Card>
+ <Card shadow="sm">
<CardBody>
{data.seasons &&
data.seasons.map((item, index) => (
@@ -94,7 +94,7 @@ export default function SeriesDescriptionTabs({ data: data }) {
key={index}
className="flex flex-row items-center mb-1"
isPressable
- shadow="lg"
+ shadow="sm"
>
<Image
src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${item.poster_path}`}
diff --git a/src/app/web-series/components/seriesSearchFormatter.jsx b/src/app/web-series/components/seriesSearchFormatter.jsx
index 3b119d6..1480d84 100644
--- a/src/app/web-series/components/seriesSearchFormatter.jsx
+++ b/src/app/web-series/components/seriesSearchFormatter.jsx
@@ -19,7 +19,12 @@ const SeriesSearchFormatter = async (data) => {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-hidden" isPressable>
+ <Card
+ className="overflow-hidden"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Searched Movie Poster"
diff --git a/src/app/web-series/components/videoPlayer.jsx b/src/app/web-series/components/videoPlayer.jsx
index 49f44f5..3c2f017 100644
--- a/src/app/web-series/components/videoPlayer.jsx
+++ b/src/app/web-series/components/videoPlayer.jsx
@@ -16,7 +16,7 @@ const SeriesVideoPlayer = ({ id: id }) => {
const VideoFrameGenerator = (sea, epi) => {
return (
<iframe
- src={`https://vidsrc.pro/embed/tv/${id}/${sea}/${epi}?player=new`}
+ src={`https://vidsrc.pro/embed/tv/${id}/${sea}/${epi}`}
allowFullScreen
referrerPolicy="origin"
height={720}
@@ -28,7 +28,7 @@ const SeriesVideoPlayer = ({ id: id }) => {
function renderVideoFrame() {
if (seasonNumber === "" || episodeNumber === "") {
alert(
- "Make sure that you have entered the episode number and the season number.",
+ "Make sure that you have entered the episode number and the season number."
);
return;
}
diff --git a/src/app/web-series/page.jsx b/src/app/web-series/page.jsx
index f9e0b57..a5f24bb 100644
--- a/src/app/web-series/page.jsx
+++ b/src/app/web-series/page.jsx
@@ -38,7 +38,12 @@ const SeriesHomepage = async () => {
aria-label="anime redirection links"
className="mx-1 flex flex-col items-center"
>
- <Card className="overflow-visible" isPressable>
+ <Card
+ className="overflow-visible"
+ isPressable
+ isHoverable
+ shadow="sm"
+ >
<CardBody>
<Image
alt="Movie Poster"