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

3 files changed, 48 insertions, 66 deletions

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