aboutsummaryrefslogtreecommitdiff
path: root/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'src/app')
-rw-r--r--src/app/manga/[title]/[id]/[read]/currentReading.jsx34
-rw-r--r--src/app/manga/history/continueWatching/page.jsx140
-rw-r--r--src/app/manga/manga.module.css125
-rw-r--r--src/app/page.jsx15
-rw-r--r--src/app/page.module.css216
5 files changed, 241 insertions, 289 deletions
diff --git a/src/app/manga/[title]/[id]/[read]/currentReading.jsx b/src/app/manga/[title]/[id]/[read]/currentReading.jsx
deleted file mode 100644
index 5205ea9..0000000
--- a/src/app/manga/[title]/[id]/[read]/currentReading.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-"use client";
-
-import styles from "./read.module.css";
-import { useEffect } from "react";
-
-function get_current_info(title) {
- let req = {};
-
- useEffect(() => {
- const data = JSON.parse(localStorage.getItem("mangaData"));
- data.watchHis.forEach((element) => {
- if (element.title === title) {
- req.chapter = element.chapter;
- req.volume = element.volume;
- }
- });
- }, []);
-
- return req || false;
-}
-
-export default function Current({ name: title }) {
- let data = get_current_info(title);
- if (!data) {
- return;
- }
-
- return (
- <section className={styles.CurrentMain}>
- <p className={styles.CurrentChapter}>{data.chapter}</p>
- <p className={styles.CurrentVolume}>{data.volume}</p>
- </section>
- );
-}
diff --git a/src/app/manga/history/continueWatching/page.jsx b/src/app/manga/history/continueWatching/page.jsx
index 92cc27e..8c5f651 100644
--- a/src/app/manga/history/continueWatching/page.jsx
+++ b/src/app/manga/history/continueWatching/page.jsx
@@ -1,70 +1,70 @@
-"use client";
-
-import React, { useState, useEffect } from "react";
-import Image from "next/image";
-import styles from "./cw.module.css";
-import Link from "next/link";
-
-const ContinueWatching = () => {
- const [localItems, setLocalItems] = useState(null);
-
- useEffect(() => {
- const newData = get_local();
- setLocalItems(newData);
- }, []); // Empty dependency array means this effect runs only once after the initial render
-
- function get_local() {
- try {
- const data = localStorage.getItem("mangaData");
- return JSON.parse(data);
- } catch (error) {
- console.log("error", error);
- return false;
- }
- }
-
- return (
- <main className={styles.main}>
- <p className={styles.mainText}>Continue Watching</p>
- {localItems && (
- <div className={styles.animeContainer}>
- {localItems.watchHis &&
- localItems.watchHis.map((item, index) => (
- <div key={index} className={styles.animeEntry}>
- <div className={styles.titleContainer}>
- <h3>{item.title}</h3>
- <p className={styles.EpisodeCount}>
- Currently reading: Volume {item.volume}{" "}
- Chapter {item.chapter}
- </p>
- <div className={styles.redirects}>
- <Link
- href={`/manga/info/${item.mangaId}`}
- >
- <button>Info Page</button>
- </Link>
- <Link
- href={`/manga/info/read/${item.id}`}
- >
- <button>
- Read current chapter
- </button>
- </Link>
- </div>
- </div>
- <Image
- src={item.image}
- width={140}
- height={210}
- alt="Continue anime poster"
- priority
- />
- </div>
- ))}
- </div>
- )}
- </main>
- );
-};
-
-export default ContinueWatching;
+"use client";
+
+import React, { useState, useEffect } from "react";
+import Image from "next/image";
+import styles from "./cw.module.css";
+import Link from "next/link";
+
+const ContinueWatching = () => {
+ const [localItems, setLocalItems] = useState(null);
+
+ useEffect(() => {
+ const newData = get_local();
+ setLocalItems(newData);
+ }, []); // Empty dependency array means this effect runs only once after the initial render
+
+ function get_local() {
+ try {
+ const data = localStorage.getItem("mangaData");
+ return JSON.parse(data);
+ } catch (error) {
+ console.log("error", error);
+ return false;
+ }
+ }
+
+ return (
+ <main className={styles.main}>
+ <p className={styles.mainText}>Continue Reading</p>
+ {localItems && (
+ <div className={styles.animeContainer}>
+ {localItems.watchHis &&
+ localItems.watchHis.map((item, index) => (
+ <div key={index} className={styles.animeEntry}>
+ <div className={styles.titleContainer}>
+ <h3>{item.title}</h3>
+ <p className={styles.EpisodeCount}>
+ Currently reading: Volume {item.volume}{" "}
+ Chapter {item.chapter}
+ </p>
+ <div className={styles.redirects}>
+ <Link
+ href={`/manga/info/${item.mangaId}`}
+ >
+ <button>Info Page</button>
+ </Link>
+ <Link
+ href={`/manga/info/read/${item.id}`}
+ >
+ <button>
+ Read current chapter
+ </button>
+ </Link>
+ </div>
+ </div>
+ <Image
+ src={item.image}
+ width={140}
+ height={210}
+ alt="Continue anime poster"
+ priority
+ />
+ </div>
+ ))}
+ </div>
+ )}
+ </main>
+ );
+};
+
+export default ContinueWatching;
diff --git a/src/app/manga/manga.module.css b/src/app/manga/manga.module.css
index 9124198..457fbbf 100644
--- a/src/app/manga/manga.module.css
+++ b/src/app/manga/manga.module.css
@@ -1,63 +1,64 @@
-.Main {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- height: 100dvh;
- width: 100dvw;
-}
-
-.MangaSVG {
- height: auto;
- width: auto;
-}
-
-.searchMain {
- display: flex;
- align-items: center;
-}
-
-.searchMain button {
- margin: 10px 5px 0px 5px;
- padding: 4px;
- border-radius: 0.3rem;
- border: none;
- outline: none;
- font-family: "Atkinson Hyperlegible", serif;
- background: #1f1f1f;
- color: white;
-}
-
-.SearchBar {
- display: flex;
- align-items: center;
- background: #1f1f1f;
- margin-top: 10px;
- border-style: dotted;
- border-color: rgb(63, 63, 63);
- border-width: 2px;
- width: 20dvw;
- border-radius: 1rem;
-}
-
-.SearchBar input {
- background: none;
- outline: none;
- border: none;
- margin-left: 5px;
- padding: 4px;
- width: 100%;
- color: white;
- font-family: "Lexend Deca", serif;
- font-size: 16px;
-}
-
-@media screen and (max-width: 768px) {
- .MangaSVG {
- width: 100%;
- }
-
- .SearchBar {
- width: 50dvw;
- }
+.Main {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 100dvh;
+ width: 100dvw;
+}
+
+.MangaSVG {
+ height: auto;
+ width: auto;
+}
+
+.searchMain {
+ display: flex;
+ align-items: center;
+}
+
+.searchMain button {
+ margin: 10px 5px 0px 5px;
+ padding: 8px;
+ border-radius: 0.3rem;
+ border: none;
+ outline: none;
+ font-family: "Atkinson Hyperlegible", serif;
+ background: #1f1f1f;
+ color: white;
+ cursor: pointer;
+}
+
+.SearchBar {
+ display: flex;
+ align-items: center;
+ background: #1f1f1f;
+ margin-top: 10px;
+ border-style: dotted;
+ border-color: rgb(63, 63, 63);
+ border-width: 2px;
+ width: 20dvw;
+ border-radius: 1rem;
+}
+
+.SearchBar input {
+ background: none;
+ outline: none;
+ border: none;
+ margin-left: 5px;
+ padding: 4px;
+ width: 100%;
+ color: white;
+ font-family: "Lexend Deca", serif;
+ font-size: 16px;
+}
+
+@media screen and (max-width: 768px) {
+ .MangaSVG {
+ width: 100%;
+ }
+
+ .SearchBar {
+ width: 50dvw;
+ }
} \ No newline at end of file
diff --git a/src/app/page.jsx b/src/app/page.jsx
index 47f30b0..0766b74 100644
--- a/src/app/page.jsx
+++ b/src/app/page.jsx
@@ -1,6 +1,5 @@
import styles from "./page.module.css";
import Link from "next/link";
-import Image from "next/image";
export default function Home() {
return (
@@ -27,20 +26,6 @@ export default function Home() {
</div>
</div>
</div>
-
- <div className={styles.netlifyLogo}>
- <Link
- href={"https://github.com/real-zephex/Dramalama"}
- target="_blank"
- >
- <Image
- src={"/github.svg"}
- width={300}
- height={130}
- alt="Netlify Logo"
- />
- </Link>
- </div>
</main>
);
}
diff --git a/src/app/page.module.css b/src/app/page.module.css
index 7524dea..a826337 100644
--- a/src/app/page.module.css
+++ b/src/app/page.module.css
@@ -1,109 +1,109 @@
-.newbg {
- background: rgb(37, 37, 37);
- background: radial-gradient(circle, rgb(41, 41, 41) 2%, rgb(12, 12, 12) 30%);
-}
-
-.header {
- position: fixed;
- top: 0;
- width: 100%;
- display: flex;
- align-items: center;
- justify-content: space-between;
- background-color: #121212;
- font-family: "Lexend Deca", serif;
- z-index: 2;
-}
-
-.left {
- color: white;
- font-size: 24px;
-}
-
-.left p {
- margin: 0;
- padding: 1rem;
-}
-
-.right a {
- text-decoration: none;
- color: white;
- margin: 0 0.4rem 0 0.5rem;
- transition: opacity 400ms ease;
- font-size: 16px;
-}
-
-.header:hover>.right a {
- opacity: 0.5;
-}
-
-.header:hover>.right a:hover {
- opacity: 1;
- cursor: pointer;
-}
-
-.footer {
- bottom: 0;
- width: 100%;
- position: fixed;
- background-color: #121212;
- color: white;
- font-family: "Poppins", serif;
- z-index: 2;
-}
-
-.footer p {
- text-align: center;
- font-size: 14px;
- margin: 0;
- padding: 0.6rem;
- font-family: "Poppins", serif;
-}
-
-.content {
- height: 100vh;
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.contentContainer {
- display: block;
-}
-
-.contentContainer a {
- text-decoration: none;
- color: white;
-}
-
-.manga,
-.anime,
-.kdrama {
- background-color: #121212e0;
- color: white;
- margin-top: 5px;
- border-radius: 5px;
- transition: opacity 400ms ease;
- padding: 0.4rem 2rem;
- font-family: "Lexend Deca", serif;
-}
-
-.content:hover>.contentContainer div {
- opacity: 0.5;
-}
-
-.content:hover>.contentContainer div:hover {
- opacity: 1;
- cursor: pointer;
-}
-
-.netlifyLogo {
- position: fixed;
- bottom: 0;
- margin: 0rem 0.4rem 1rem 0.4rem;
- height: 8.2rem;
-}
-
-.netlifyLogo img {
- aspect-ratio: 16 / 9;
+.newbg {
+ background: rgb(37, 37, 37);
+ background: radial-gradient(circle, rgb(41, 41, 41) 2%, rgb(12, 12, 12) 30%);
+}
+
+.header {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: #121212;
+ font-family: "Lexend Deca", serif;
+ z-index: 2;
+}
+
+.left {
+ color: white;
+ font-size: 24px;
+}
+
+.left p {
+ margin: 0;
+ padding: 1rem;
+}
+
+.right a {
+ text-decoration: none;
+ color: white;
+ margin: 0 0.4rem 0 0.5rem;
+ transition: opacity 400ms ease;
+ font-size: 16px;
+}
+
+.header:hover>.right a {
+ opacity: 0.5;
+}
+
+.header:hover>.right a:hover {
+ opacity: 1;
+ cursor: pointer;
+}
+
+.footer {
+ bottom: 0;
+ width: 100%;
+ position: fixed;
+ background-color: #121212;
+ color: white;
+ font-family: "Poppins", serif;
+ z-index: 2;
+}
+
+.footer p {
+ text-align: center;
+ font-size: 14px;
+ margin: 0;
+ padding: 0.6rem;
+ font-family: "Poppins", serif;
+}
+
+.content {
+ height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.contentContainer {
+ display: block;
+}
+
+.contentContainer a {
+ text-decoration: none;
+ color: white;
+}
+
+.manga,
+.anime,
+.kdrama {
+ background-color: #121212e0;
+ color: white;
+ margin-top: 5px;
+ border-radius: 5px;
+ transition: opacity 400ms ease;
+ padding: 0.4rem 2rem;
+ font-family: "Lexend Deca", serif;
+}
+
+.content:hover>.contentContainer div {
+ opacity: 0.5;
+}
+
+.content:hover>.contentContainer div:hover {
+ opacity: 1;
+ cursor: pointer;
+}
+
+.netlifyLogo {
+ position: fixed;
+ bottom: 0;
+ margin: 0rem 0.4rem 1.6rem 0.4rem;
+}
+
+.netlifyLogo img {
+ aspect-ratio: 16 / 9;
+ height: 100px
} \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2026-05-30 18:29:51 +0000