minor changes to the kdrama page

9 files changed, 40 insertions, 28 deletions

diff --git a/.gitignore b/.gitignore
index 9d5cb8d..fd3dbb5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -34,6 +34,3 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
-
-desktop.fell-major.ts.net.crt
-desktop.fell-major.ts.net.key
\ No newline at end of file
diff --git a/src/app/kdrama/[id]/buttons.jsx b/src/app/kdrama/[id]/buttons.jsx
index 2018a1c..e31adf1 100644
--- a/src/app/kdrama/[id]/buttons.jsx
+++ b/src/app/kdrama/[id]/buttons.jsx
@@ -26,6 +26,7 @@ export default function EpisodesButtons({ data: episodeData, id: dramaId }) {
 					{episodeData &&

 						episodeData.map((item, index) => (

 							<button

+								title={item.title}

 								key={index}

 								onClick={(event) => {

 									test(item.id, dramaId, item.title);

diff --git a/src/app/kdrama/components/popular.jsx b/src/app/kdrama/components/popular.jsx
index 15c9f92..21d8cc3 100644
--- a/src/app/kdrama/components/popular.jsx
+++ b/src/app/kdrama/components/popular.jsx
@@ -9,7 +9,7 @@ export default async function PopularDramas() {
 

 	return (

 		<div className={styles.Main}>

-			<h1 className={styles.popDramasText}>Trending Dramas</h1>

+			<h2 className={styles.popDramasText}>Trending Dramas</h2>

 

 			<div className={styles.AnimeContainer}>

 				{popular &&

diff --git a/src/app/kdrama/components/recent.jsx b/src/app/kdrama/components/recent.jsx
index 9c5d452..2b883d6 100644
--- a/src/app/kdrama/components/recent.jsx
+++ b/src/app/kdrama/components/recent.jsx
@@ -8,7 +8,7 @@ export default async function RecentDramas() {
 	PreFetchAnimeInfo(popular);

 	return (

 		<div className={styles.Main}>

-			<h1 className={styles.popDramasText}>Recent Releases</h1>

+			<h2 className={styles.popDramasText}>Recent Releases</h2>

 

 			<div className={styles.AnimeContainer}>

 				{popular &&

diff --git a/src/app/kdrama/page.jsx b/src/app/kdrama/page.jsx
index f6b417f..b9cdb69 100644
--- a/src/app/kdrama/page.jsx
+++ b/src/app/kdrama/page.jsx
@@ -7,8 +7,8 @@ export default async function Kdrama() {
 	return (

 		<div className={styles.Main}>

 			<DramaSearch />

-			<br />

 			<PopularDramas />

+			<hr style={{ marginTop: 15, borderColor: "gray" }} />

 			<RecentDramas />

 		</div>

 	);

diff --git a/src/app/kdrama/styles/info.module.css b/src/app/kdrama/styles/info.module.css
index 9da3034..3b60fd2 100644
--- a/src/app/kdrama/styles/info.module.css
+++ b/src/app/kdrama/styles/info.module.css
@@ -1,6 +1,6 @@
 .Main {

 	max-width: 98%;

-	margin: 80px auto;

+	margin: 60px auto;

 }

 

 .TitleContainer {

@@ -14,10 +14,11 @@
 	font-size: 34px;

 	font-weight: 500;

 	color: var(--neon-green);

+	margin: 0;

 }

 

 .TitleContainer img {

-	border-radius: 0.5rem;

+	border-radius: 0.4rem;

 }

 

 .DramaDescription h2 {

@@ -45,11 +46,11 @@
 }

 

 .DramaGenre::-webkit-scrollbar {

-	height: 5px;

+	height: 2px;

 }

 

 .DramaGenre::-webkit-scrollbar-thumb {

-	background-color: var(--soft-purple);

+	background-color: var(--light-green);

 	border-radius: 1rem;

 }

 

@@ -143,4 +144,30 @@
 		font-size: 14px;

 		width: 80px;

 	}

+

+	.TitleContainer {

+		flex-direction: column;

+	}

+

+	.TitleContainer img {

+		width: auto;

+		height: auto;

+		border-radius: 0.2rem;

+		background-color: #121212;

+		padding: 0.2rem;

+	}

+	

+	.TitleContainer p {

+		font-size: 30px;

+		font-weight: 400;

+		margin: 0 0 0.25rem 0

+	}

+

+	.EpisodesContainer {

+		text-align: center;

+	}

+

+	.EpisodeButtons button {

+		width: 90px;

+	}

 }

diff --git a/src/app/kdrama/styles/kdrama.module.css b/src/app/kdrama/styles/kdrama.module.css
index d683479..deb3860 100644
--- a/src/app/kdrama/styles/kdrama.module.css
+++ b/src/app/kdrama/styles/kdrama.module.css
@@ -1,3 +1,4 @@
 .Main {

 	margin: 80px auto;

+	width: 99%;

 }

diff --git a/src/app/kdrama/styles/popular.module.css b/src/app/kdrama/styles/popular.module.css
index 92373a2..ec76fb3 100644
--- a/src/app/kdrama/styles/popular.module.css
+++ b/src/app/kdrama/styles/popular.module.css
@@ -1,17 +1,6 @@
 .popDramasText {

-	color: var(--soft-purple);

-	margin: 10px 0 10px 0;

-	text-align: center;

-	color: transparent;

-	background: linear-gradient(

-		90deg,

-		var(--neon-green) 40%,

-		var(--light-green) 60%,

-		var(--neon-yellow) 80%,

-		var(--soft-purple) 100%

-	);

-	background-size: 60% 50%;

-	background-clip: text;

+	color: white;

+	margin: 0 0 0.2rem	 0;

 }

 

 .AnimeContainer {

@@ -45,6 +34,7 @@
 		background-color 200ms ease;

 	cursor: grab;

 	border-radius: 0.4rem;

+	overflow: hidden;

 }

 

 .AnimeEntry img {

diff --git a/src/app/kdrama/styles/search.module.css b/src/app/kdrama/styles/search.module.css
index dbca5ad..d7d28b2 100644
--- a/src/app/kdrama/styles/search.module.css
+++ b/src/app/kdrama/styles/search.module.css
@@ -1,6 +1,3 @@
-.SearchContainer {

-	margin: -1rem 0 -2rem 0;

-}

 

 .LoadingText {

 	color: white;

@@ -14,8 +11,7 @@
 	display: flex;

 	align-items: center;

 	max-width: 30%;

-	border-radius: 0.8rem;

-	margin: 0 0.2rem 0 0.2rem;

+	border-radius: 0.5rem;

 }

 

 .SearchContainer input {