fixes: minor css modifications, added basic information about the last read manga chapter (don't expect much out of it)

18 files changed, 161 insertions, 110 deletions

diff --git a/src/app/anime/[id]/[animeId]/page.jsx b/src/app/anime/[id]/[animeId]/page.jsx
index d59b0a0..1614775 100644
--- a/src/app/anime/[id]/[animeId]/page.jsx
+++ b/src/app/anime/[id]/[animeId]/page.jsx
@@ -49,7 +49,7 @@ export default async function Video({ params }) {
 async function getVideoLink(id) {
 	const res = await fetch(
 		"https://consumet-api-di2e.onrender.com/anime/gogoanime/watch/" + id,
-		{ next: { revalidate: 3600 } } // Video links are revalidated after an hour
+		{ next: { revalidate: 7200 } } // Video links are revalidated after an hour
 	);
 	const data = res.json();
 	return data;
diff --git a/src/app/anime/[id]/page.jsx b/src/app/anime/[id]/page.jsx
index dd9e4cc..6c81ede 100644
--- a/src/app/anime/[id]/page.jsx
+++ b/src/app/anime/[id]/page.jsx
@@ -63,7 +63,7 @@ export default async function AnimeInfo({ params }) {
 async function getAnimeInfo(anime_id) {
 	const res = await fetch(
 		"https://anime-sensei-api.vercel.app/anime/gogoanime/info/" + anime_id,
-		{ next: { revalidate: 1800 } }
+		{ next: { revalidate: 7200 } }
 	);
 	const data = res.json();
 	return data;
diff --git a/src/app/anime/page.jsx b/src/app/anime/page.jsx
index 625dd83..0b903e2 100644
--- a/src/app/anime/page.jsx
+++ b/src/app/anime/page.jsx
@@ -8,6 +8,7 @@ export default async function Anime() {
 		<div>
 			<Input />
 			<Trending />
+			<br />
 			<Releases />
 		</div>
 	);
diff --git a/src/app/anime/recent/page.jsx b/src/app/anime/recent/page.jsx
index ddfbc3f..9094ead 100644
--- a/src/app/anime/recent/page.jsx
+++ b/src/app/anime/recent/page.jsx
@@ -1,11 +1,10 @@
-import "./recent.css";
 import Image from "next/image";
 import Link from "next/link";
 import styles from "./recent.module.css";
 import { MdRecentActors } from "react-icons/md";
 
 export default async function Releases() {
-	const data = await test();
+	const data = await fetchRecentEpisodes();
 
 	return (
 		<div className="trendingContainer">
@@ -16,20 +15,20 @@ export default async function Releases() {
 				</span>
 			</div>
 
-			<div className="trending">
+			<div className={styles.Recent}>
 				{data &&
 					data.results.map((item, index) => (
 						<Link
 							key={index}
 							href={`/anime/${item.id}`}
-							style={{ textDecoration: "none" }}
+							style={{ textDecoration: "none", color: "white" }}
 						>
-							<div className="trendingEntries">
+							<div className={styles.RecentEntries}>
 								<Image
 									src={item.image}
-									className="{trendingImage}"
-									width={160}
-									height={220}
+									className={styles.RecentImage}
+									width={180}
+									height={260}
 									alt="Drama"
 									priority
 								/>
@@ -42,10 +41,10 @@ export default async function Releases() {
 	);
 }
 
-async function test() {
+async function fetchRecentEpisodes() {
 	const res = await fetch(
 		"https://consumet-api-di2e.onrender.com/anime/gogoanime/recent-episodes",
-		{ cache: "force-cache" }
+		{ next: { revalidate: 86400 } }
 	);
 	const data = res.json();
 	return data;
diff --git a/src/app/anime/recent/recent.css b/src/app/anime/recent/recent.css
deleted file mode 100644
index da0598d..0000000
--- a/src/app/anime/recent/recent.css
+++ /dev/null
@@ -1,56 +0,0 @@
-.trendingContainer {
-	display: flex;
-	flex-direction: column;
-}
-
-.trendingText {
-	color: #FEFFAC;
-	font-family: "Open Sans";
-	font-size: 26px;
-	margin: 10px;
-}
-
-.trending {
-	width: 98%;
-	display: flex;
-	flex-direction: row;
-	overflow-x: auto;
-	margin: 0px auto;
-}
-
-/* Customize scrollbar here */
-.trending::-webkit-scrollbar {
-	height: 5px;
-}
-
-.trendingEntries {
-	margin: 10px 10px 5px 5px;
-	text-align: center;
-	cursor: pointer;
-	transition: transform 0.2s ease;
-
-}
-
-.trendingEntries:hover {
-	transform: scale(1.03);
-}
-
-.trendingEntries img {
-	border-radius: 10px;
-	width: 150px;
-	height: 210px;
-}
-
-.trendingEntries p {
-	color: white;
-	max-height: 60px;
-	max-width: 150px;
-	overflow-y: auto;
-	font-family: "Lato";
-	margin: 10px auto;
-	font-size: 16px;
-}
-
-.trendingEntries p::-webkit-scrollbar {
-	width: 5px;
-}
\ No newline at end of file
diff --git a/src/app/anime/recent/recent.module.css b/src/app/anime/recent/recent.module.css
index 5756ccb..7805d52 100644
--- a/src/app/anime/recent/recent.module.css
+++ b/src/app/anime/recent/recent.module.css
@@ -12,4 +12,43 @@
 
 .RecentText span {
 	margin-top: 6px;
+}
+
+.Recent {
+	display: flex;
+	overflow-x: auto;
+}
+
+.Recent::-webkit-scrollbar {
+	height: 5px;
+}
+
+.Recent::-webkit-scrollbar-thumb {
+	background-color: #444444;
+	border-radius: 5px;
+}
+
+.RecentEntries {
+	margin: 7px;
+}
+
+.RecentEntries p {
+	text-align: center;
+	margin: 5px auto;
+	max-height: 70px;
+	overflow-y: auto;
+}
+
+.RecentEntries p::-webkit-scrollbar {
+	width: 5px;
+}
+
+.Recent p::-webkit-scrollbar-thumb {
+	background-color: #444444;
+	border-radius: 5px;
+}
+
+.RecentImage {
+	border-radius: 5px;
+	aspect-ratio: auto;
 }
\ No newline at end of file
diff --git a/src/app/anime/top-airing/page.jsx b/src/app/anime/top-airing/page.jsx
index 3d26d88..297fc45 100644
--- a/src/app/anime/top-airing/page.jsx
+++ b/src/app/anime/top-airing/page.jsx
@@ -15,20 +15,20 @@ export default async function Trending() {
 				</span>
 			</div>
 
-			<div className="trending">
+			<div className={styles.trending}>
 				{data &&
 					data.results.map((item, index) => (
 						<Link
 							key={index}
 							href={`/anime/${item.id}`}
-							style={{ textDecoration: "none" }}
+							style={{ textDecoration: "none", color: "white" }}
 						>
-							<div className="trendingEntries">
+							<div className={styles.trendingEntries}>
 								<Image
 									src={item.image}
-									className="{trendingImage}"
-									width={160}
-									height={220}
+									className={styles.trendingImage}
+									width={180}
+									height={260}
 									alt="Drama"
 									priority
 								/>
@@ -44,7 +44,7 @@ export default async function Trending() {
 async function test() {
 	const res = await fetch(
 		"https://consumet-api-di2e.onrender.com/anime/gogoanime/top-airing",
-		{ cache: "force-cache" }
+		{ next: { revalidate: 86400 } }
 	);
 	const data = res.json();
 	return data;
diff --git a/src/app/anime/top-airing/trending.module.css b/src/app/anime/top-airing/trending.module.css
index d03bab3..bffd7ef 100644
--- a/src/app/anime/top-airing/trending.module.css
+++ b/src/app/anime/top-airing/trending.module.css
@@ -12,4 +12,43 @@
 
 .TrendingText span {
 	margin-top: 6px;
+}
+
+.trending {
+	display: flex;
+	overflow-x: auto;
+}
+
+.trending::-webkit-scrollbar {
+	height: 5px;
+}
+
+.trending::-webkit-scrollbar-thumb {
+	background-color: #444444;
+	border-radius: 5px;
+}
+
+.trendingEntries {
+	margin: 7px;
+}
+
+.trendingEntries p {
+	text-align: center;
+	margin: 5px auto;
+	max-height: 70px;
+	overflow-y: auto;
+}
+
+.trendingEntries p::-webkit-scrollbar {
+	width: 5px;
+}
+
+.trendingEntries p::-webkit-scrollbar-thumb {
+	background-color: #444444;
+	border-radius: 5px;
+}
+
+.trendingImage {
+	border-radius: 5px;
+	aspect-ratio: auto;
 }
\ No newline at end of file
diff --git a/src/app/components/footer/footer.module.css b/src/app/components/footer/footer.module.css
index 75c9432..8b1b7b6 100644
--- a/src/app/components/footer/footer.module.css
+++ b/src/app/components/footer/footer.module.css
@@ -4,12 +4,22 @@
 	bottom: 0;
 	width: 100%;
 	background-color: #1a1a1a;
-	color: white;
-	text-align: center;
+	display: flex;
+	padding: 10px;
+	justify-content: space-between;
+	align-items: center;
 }
 
-.footer p a {
-	padding: 10px;
-	text-decoration: none;
+.FooterLeftContainer a {
 	color: #696880;
+	margin: 10px;
+}
+
+.FooterRightContainer {
+	margin-right: 10px;
+}
+
+.FooterRightContainer a {
+	margin: 10px;
+	text-decoration: none;
 }
\ No newline at end of file
diff --git a/src/app/components/footer/page.jsx b/src/app/components/footer/page.jsx
index e3af4f9..1223f31 100644
--- a/src/app/components/footer/page.jsx
+++ b/src/app/components/footer/page.jsx
@@ -3,7 +3,7 @@ import styles from "./footer.module.css";
 export default async function Footer() {
 	return (
 		<div className={styles.footer}>
-			<p style={{ margin: 10 }}>
+			<div className={styles.FooterLeftContainer}>
 				<a
 					href="https://stats.uptimerobot.com/Fxp7SE5Ll3"
 					target="_new"
@@ -16,6 +16,9 @@ export default async function Footer() {
 				>
 					Github
 				</a>
+			</div>
+
+			<div className={styles.FooterRightContainer}>
 				<a
 					style={{ color: "#EBCB8B" }}
 					href="https://dramalama.vercel.app"
@@ -23,18 +26,12 @@ export default async function Footer() {
 					Vercel
 				</a>
 				<a
-					style={{ color: "#BF616A" }}
-					href="https://dramalama.netlify.app"
-				>
-					Netlify
-				</a>
-				<a
 					style={{ color: "	#A3BE8C" }}
 					href="https://dramalama-1phg.onrender.com"
 				>
 					Render
 				</a>
-			</p>
+			</div>
 		</div>
 	);
 }
diff --git a/src/app/components/header/header.jsx b/src/app/components/header/header.jsx
index f41352a..286aed6 100644
--- a/src/app/components/header/header.jsx
+++ b/src/app/components/header/header.jsx
@@ -21,9 +21,9 @@ export default function Header() {
 					<Link href="/manga">
 						<p>Manga</p>
 					</Link>
-					<Link href="/kdrama">
+					{/* <Link href="/kdrama">
 						<p>Kdrama</p>
-					</Link>
+					</Link> */}
 				</div>
 			</div>
 			<hr style={{ marginTop: "-3px" }} />
diff --git a/src/app/components/header/header.module.css b/src/app/components/header/header.module.css
index 6a67bf6..ce855ed 100644
--- a/src/app/components/header/header.module.css
+++ b/src/app/components/header/header.module.css
@@ -15,9 +15,9 @@
 }
 
 .rightNav a {
-	text-decoration: none;
-	color: white;
-	font-size: 20px;
+	text-decoration: underline;
+	color: var(--light-green);
+	font-size: 18px;
 }
 
 .rightNav p {
diff --git a/src/app/manga/[title]/[id]/[read]/currentReading.jsx b/src/app/manga/[title]/[id]/[read]/currentReading.jsx
index c368f75..2db6d77 100644
--- a/src/app/manga/[title]/[id]/[read]/currentReading.jsx
+++ b/src/app/manga/[title]/[id]/[read]/currentReading.jsx
@@ -19,7 +19,7 @@ function CR(chapter, volume) {
 		<div className={styles.CurrentReadingContainer}>
 			{chapter && volume && (
 				<p>
-					Vol {volume} Chapter {chapter}
+					Reading: Vol {volume} Chapter {chapter}
 				</p>
 			)}
 		</div>
diff --git a/src/app/manga/[title]/[id]/[read]/download.jsx b/src/app/manga/[title]/[id]/[read]/download.jsx
index 7eb1e7e..e0badc9 100644
--- a/src/app/manga/[title]/[id]/[read]/download.jsx
+++ b/src/app/manga/[title]/[id]/[read]/download.jsx
@@ -8,7 +8,7 @@ export default function DownloadManga({ chapterId: id }) {
 				href={`https://manga-downloader-7nca.onrender.com/download?id=${id}`}
 				style={{ textDecoration: "none" }}
 			>
-				<button title="This feature is in very early stages. Use it on your own risk">
+				<button title="This functionality currently exhibits stability with lower-quality PDFs; however, users may encounter challenges when attempting to download higher-quality PDFs.">
 					Download - Beta
 				</button>
 			</Link>
diff --git a/src/app/manga/[title]/[id]/[read]/page.jsx b/src/app/manga/[title]/[id]/[read]/page.jsx
index e584ee2..eaaa94c 100644
--- a/src/app/manga/[title]/[id]/[read]/page.jsx
+++ b/src/app/manga/[title]/[id]/[read]/page.jsx
@@ -27,6 +27,7 @@ export default async function Read({ params }) {
 			<CurrentReading />
 			<div className={styles.ImageContainer}>
 				<DownloadManga chapterId={chapterId} />
+				<p>Total pages: {images.length}</p>
 				{images &&
 					images.map((item, index) => (
 						<div className={styles.Image} key={index}>
@@ -43,6 +44,7 @@ export default async function Read({ params }) {
 						</div>
 					))}
 			</div>
+			<CurrentReading />
 		</div>
 	);
 }
diff --git a/src/app/manga/[title]/[id]/info.module.css b/src/app/manga/[title]/[id]/info.module.css
index d9d3d06..a36658a 100644
--- a/src/app/manga/[title]/[id]/info.module.css
+++ b/src/app/manga/[title]/[id]/info.module.css
@@ -16,7 +16,7 @@
 .TitleContainer p {
 	font-family: "Quicksand";
 	font-size: 40px;
-	font-weight: 900;
+	font-weight: 1000;
 }
 
 .TitleContainer img {
@@ -65,7 +65,7 @@
 }
 
 .Character::-webkit-scrollbar-thumb {
-	background-color: #B799FF;
+	background-color: #31363F;
 	border-radius: 5px;
 }
 
@@ -84,11 +84,25 @@
 }
 
 /* Chapters Buttons */
-.ChapterContainer {
-	width: 100%;
+
+.Chapters {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	max-width: 90%;
 	margin: 20px auto;
+}
+
+.ChapterTitle {
+	color: white;
+	font-family: "Kanit";
+	font-size: 32px;
+}
+
+.ChapterContainer {
+	width: 50%;
 	text-align: center;
-	height: 400px;
+	height: 300px;
 	overflow-y: auto;
 }
 
@@ -97,8 +111,7 @@
 }
 
 .ChapterContainer::-webkit-scrollbar-thumb {
-	/* background-color: #949494; */
-	background-color: #B799FF;
+	background-color: #31363F;
 	border-radius: 5px;
 }
 
@@ -111,10 +124,10 @@
 	font-size: 16px;
 	border: none;
 	outline: none;
-	font-family: "Lato";
-	background-color: #f8f6e3dc;
+	color: white;
+	background-color: #3d3d3d;
 	cursor: pointer;
-	transition: transform 0.2s linear;
+	transition: background-color 0.2s linear;
 }
 
 .ChapterContainer button p {
@@ -123,7 +136,8 @@
 }
 
 .ChapterContainer button:hover {
-	background-color: #97E7E1;
+	background-color: #1f1f1f;
+	transition: background-color 0.2s linear
 }
 
 .ChapterContainer button:focus {
diff --git a/src/app/manga/[title]/[id]/page.jsx b/src/app/manga/[title]/[id]/page.jsx
index 3038b3f..15eb148 100644
--- a/src/app/manga/[title]/[id]/page.jsx
+++ b/src/app/manga/[title]/[id]/page.jsx
@@ -3,6 +3,7 @@ import Image from "next/image";
 import Buttons from "./buttons";
 import { redirect } from "next/navigation";
 import { FaStar } from "react-icons/fa";
+import CurrentReading from "./[read]/currentReading";
 
 export default async function MangaInfo({ params }) {
 	const id = params.id;
@@ -104,8 +105,13 @@ export default async function MangaInfo({ params }) {
 								))}
 						</div>
 					</div>
-
-					<Buttons content={data} />
+					<CurrentReading />
+					<div className={styles.Chapters}>
+						<p className={styles.ChapterTitle}>
+							Chapters & Volumes
+						</p>
+						<Buttons content={data} />
+					</div>
 				</div>
 			)}
 		</div>
diff --git a/src/app/manga/[title]/page.jsx b/src/app/manga/[title]/page.jsx
index 92c2897..7788a59 100644
--- a/src/app/manga/[title]/page.jsx
+++ b/src/app/manga/[title]/page.jsx
@@ -29,8 +29,8 @@ export default async function MangaInfo({ params }) {
 								<div className={styles.MangaEntries}>
 									<Image
 										src={item.image}
-										width={140}
-										height={240}
+										width={160}
+										height={250}
 										alt="Manga Poster"
 										style={{ borderRadius: 10 }}
 									/>