✨ feat(ui): 🎨 migrate from vanilla css to tailwind css, adopted next ui and restructured

7 files changed, 0 insertions, 453 deletions

diff --git a/src/app/anime/styles/anime.module.css b/src/app/anime/styles/anime.module.css
deleted file mode 100644
index e5d402a..0000000
--- a/src/app/anime/styles/anime.module.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.Main {
-	max-width: 99%;
-	margin: 65px auto;
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/buttons.module.css b/src/app/anime/styles/buttons.module.css
deleted file mode 100644
index d0b8e78..0000000
--- a/src/app/anime/styles/buttons.module.css
+++ /dev/null
@@ -1,98 +0,0 @@
-.animeButtonContainer {
-	margin-top: 1rem;
-}
-
-.dramaButton {
-	background-color: #1f1f1fd2;
-	outline: none;
-	border: none;
-	color: white;
-	font-family: "Atkinson Hyperlegible", serif;
-	width: 50px;
-	padding: 0.5rem;
-	margin: 0 0.2rem 0.2rem 0;
-	border-radius: 0.5rem;
-	cursor: pointer;
-	transition: background-color 200ms ease, scale 200ms ease;
-}
-
-.dramaButton:hover {
-	background-color: #121212;
-	scale: 0.95;
-}
-
-.dramaButton:focus {
-	background-color: var(--soft-purple);
-	scale: 0.95;
-}
-
-.Main {
-	display: flex;
-	align-items: center;
-	flex-direction: column;
-	text-align: center;
-}
-
-.SelectClass {
-	text-align: center;
-	outline: none;
-	border: none;
-	padding: 0.4rem;
-	font-family: "Lexend Deca", serif;
-	background-color: #1f1f1fd2;
-	color: white;
-	border-radius: 0.5rem;
-}
-
-.SelectClass::-webkit-scrollbar {
-	width: 0;
-}
-
-/* Video Player */
-
-.videoPopUp {
-	height: 100dvh;
-	width: 100dvw;
-	background-color: #141414ee;
-	position: fixed;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	z-index: 1;
-	overflow-y: auto;
-}
-
-.closeButton {
-	font-family: "Lexend Deca", serif;
-	font-size: 16px;
-	background-color: var(--pastel-red);
-	padding: 0.5rem 1.5rem;
-	border: 0;
-	outline: 0;
-	border-radius: 0.5rem;
-	cursor: pointer;
-	margin: 5px;
-}
-
-.video {
-	width: 60vw;
-}
-
-.VideoPlayer {
-	width: 100%;
-}
-
-@media screen and (max-width: 1024px) {
-
-	.dramaButton {
-		font-size: 14px;
-	}
-
-	.video {
-		width: 100%;
-	}
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/cw.module.css b/src/app/anime/styles/cw.module.css
deleted file mode 100644
index cb579c7..0000000
--- a/src/app/anime/styles/cw.module.css
+++ /dev/null
@@ -1,59 +0,0 @@
-.main {
-	width: 99%;
-	margin: 60px auto;
-}
-
-.mainText {
-	color: white;
-	font-size: 24px;
-	margin: 0.2rem 0 0.2rem 0;
-}
-
-.animeContainer {
-	font-size: 18px;
-	margin: 0px;
-}
-
-.animeEntry {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: 5px;
-	margin-bottom: 0.5rem;
-	border-radius: 0.4rem;
-	background-color: #1f1f1f;
-}
-
-.animeEntry img {
-	border-radius: 0.4rem;
-	margin-left: 0.2rem;
-}
-
-.titleContainer {
-	color: white;
-	margin-left: 0.2rem;
-}
-
-.titleContainer h3 {
-	margin: 0px;
-}
-
-.EpisodeCount {
-	color: var(--soft-purple);
-	margin: 0px;
-}
-
-.date {
-	color: var(--neon-yellow);
-	margin: 0px;
-}
-
-@media screen and (max-width: 768px) {
-	.animeContainer {
-		font-size: 14px;
-	}
-
-	.animeEntry img {
-		width: 35%;
-	}
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/info.module.css b/src/app/anime/styles/info.module.css
deleted file mode 100644
index afdc08f..0000000
--- a/src/app/anime/styles/info.module.css
+++ /dev/null
@@ -1,69 +0,0 @@
-.main {
-	width: 50%;
-	margin: 60px auto;
-	color: white;
-}
-
-.AnimeHeroSection {
-	display: flex;
-	align-items: center;
-}
-
-.AnimeHeroSection strong {
-	color: #38bdf8;
-}
-
-.AnimeHeroSection img {
-	/* width: auto;
-	height: auto; */
-	padding: 0.5rem 0.7rem 0.5rem 0.7rem;
-}
-
-.animeDescription {
-	max-height: 100px;
-	overflow: auto;
-}
-
-.animeDescription::-webkit-scrollbar {
-	width: 0px;
-}
-
-.AnimeHeroSection p {
-	margin: 0;
-	color: #a3a3a3;
-}
-
-.animeTitle {
-	font-size: 26px;
-	text-transform: uppercase;
-}
-
-@media screen and (max-width: 1024px) {
-	.main {
-		width: 100%;
-	}
-
-	.AnimeHeroSection {
-		font-size: 14px;
-	}
-
-	.animeTitle {
-		font-size: 24px;
-	}
-
-	.AnimeHeroSection img {
-		padding: 0.4rem 0.4rem 0.4rem 0.4rem;
-	}
-}
-
-@media screen and (max-width: 425px) {
-	.AnimeHeroSection {
-		display: flex;
-		align-items: center;
-		flex-direction: column;
-	}
-
-	.animeTitle {
-		text-align: center;
-	}
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/loading.module.css b/src/app/anime/styles/loading.module.css
deleted file mode 100644
index f0d0606..0000000
--- a/src/app/anime/styles/loading.module.css
+++ /dev/null
@@ -1,12 +0,0 @@
-.LoadingContainer {
-	height: 100vh;
-	width: 100vw;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-.LoadingContainer strong {
-	color: white;
-	font-size: 20px;
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/pop_recent_top.module.css b/src/app/anime/styles/pop_recent_top.module.css
deleted file mode 100644
index 253f60f..0000000
--- a/src/app/anime/styles/pop_recent_top.module.css
+++ /dev/null
@@ -1,95 +0,0 @@
-.AnimeHeaderText {
-	color: white;
-	margin: 0.4rem 0 0 0;
-	text-transform: uppercase;
-	font-size: 30px;
-}
-
-.AnimeContainer {
-	margin: 0.2rem 0 0 0;
-	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
-	grid-gap: 0.5rem;
-}
-
-/* .AnimeEntry {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	text-align: center;
-	padding: 0.8rem;
-	border-radius: 0.4rem;
-	background-color: #1a1a1a;
-	transition: opacity 200ms ease;
-} */
-
-.AnimeEntry {
-	position: relative;
-	display: inline-block;
-	overflow: hidden;
-	border-radius: 0.5rem;
-	transition: opacity 200ms ease;
-
-}
-
-.AnimeContainer:hover .AnimeEntry {
-	opacity: 0.5;
-}
-
-.AnimeContainer:hover .AnimeEntry:hover {
-	opacity: 1;
-}
-
-.AnimeEntry img {
-	display: block;
-	transition: transform 200ms ease;
-}
-
-.AnimeEntry img:hover {
-	transform: translateY(-5px) scale(1.04);
-}
-
-
-.AnimeTitle {
-	position: absolute;
-	bottom: 0;
-	/* Adjust the value as needed */
-	left: 50%;
-	transform: translateX(-50%);
-	margin: 0;
-	color: white;
-	padding: 5px;
-	text-align: center;
-	background-color: #121212ab;
-	backdrop-filter: blur(10px);
-	text-transform: uppercase;
-	width: 100%;
-	max-width: 170px;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.AnimeReleasedEpisode {
-	position: absolute;
-	top: 0;
-	margin: 0.2rem;
-	padding: 0.5rem;
-	background-color: #121212b2;
-	border-radius: 0.4rem;
-	backdrop-filter: blur(10px);
-}
-
-.AnimeContainer::-webkit-scrollbar {
-	height: 0rem;
-}
-
-
-@media screen and (max-width: 768px) {
-	.AnimeContainer {
-		display: flex;
-		overflow: auto;
-		align-items: center;
-	}
-}
\ No newline at end of file
diff --git a/src/app/anime/styles/search.module.css b/src/app/anime/styles/search.module.css
deleted file mode 100644
index abed86c..0000000
--- a/src/app/anime/styles/search.module.css
+++ /dev/null
@@ -1,116 +0,0 @@
-.SearchBarContainer {
-	padding: 1rem 0 0.8rem 0;
-	display: flex;
-	align-items: center;
-	width: 100%;
-}
-
-.SearchInputContainer {
-	display: flex;
-	align-items: center;
-	background-color: #1f1f1f;
-	padding: 0.4rem;
-	border-radius: 0.5rem;
-	width: 40%;
-}
-
-.animeHistoryButton {
-	font-family: "Lexend Deca", serif;
-	outline: none;
-	border: none;
-	background-color: #121212;
-	color: white;
-	margin: 0 0.1rem 0 0.2rem;
-	padding: 0.6rem;
-	cursor: pointer;
-	border-radius: 0.5rem;
-}
-
-.SearchInputContainer input {
-	background-color: transparent;
-	border: none;
-	outline: none;
-	color: white;
-	margin-left: 0.5rem;
-	font-size: 20px;
-	font-family: "Atkinson Hyperlegible", serif;
-	width: 100%;
-}
-
-.SearchLoading {
-	color: white;
-	text-align: center;
-}
-
-/* Search Results */
-
-.SearchResultsContainer {
-	display: flex;
-	align-items: center;
-	overflow-x: auto;
-	padding-bottom: 0.5rem;
-}
-
-.AnimeEntry {
-	position: relative;
-	display: inline-block;
-	overflow: hidden;
-	border-radius: 0.5rem;
-	transition: opacity 200ms ease;
-	margin: 0.4rem;
-}
-
-.SearchResultsContainer:hover .AnimeEntry {
-	opacity: 0.5;
-}
-
-.SearchResultsContainer:hover .AnimeEntry:hover {
-	opacity: 1;
-}
-
-.AnimeEntry p {
-	position: absolute;
-	bottom: 0;
-	/* Adjust the value as needed */
-	left: 50%;
-	transform: translateX(-50%);
-	margin: 0;
-	color: white;
-	padding: 5px;
-	text-align: center;
-	background-color: #121212ab;
-	backdrop-filter: blur(10px);
-	text-transform: uppercase;
-	width: 100%;
-	max-width: 170px;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.AnimeEntry img {
-	display: block;
-	transition: transform 200ms ease;
-}
-
-.AnimeEntry img:hover {
-	transform: translateY(-5px) scale(1.04);
-}
-
-
-.SearchResultsContainer::-webkit-scrollbar {
-	height: 0.5rem;
-}
-
-.SearchResultsContainer::-webkit-scrollbar-thumb {
-	background: rgb(83, 83, 83);
-	border-radius: 1rem;
-}
-
-@media screen and (max-width: 768px) {
-	.SearchInputContainer {
-		width: 100%;
-	}
-
-
-}
\ No newline at end of file