aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorreal-zephex <[email protected]>2024-05-23 11:02:37 +0530
committerreal-zephex <[email protected]>2024-05-23 11:02:37 +0530
commit36c7d914639b432ec5cfbfd2d2f9e1672f6cc0ca (patch)
treed75cd668513b9e1dd958073b98e40fbbdf46ac3d
parent🎨 style(anime): UI improvements to the anime page (diff)
downloaddramalama-36c7d914639b432ec5cfbfd2d2f9e1672f6cc0ca.tar.xz
dramalama-36c7d914639b432ec5cfbfd2d2f9e1672f6cc0ca.zip
style: minor improvements to the anime cards
-rw-r--r--src/app/anime/components/recentEpisodes.jsx3
-rw-r--r--src/app/anime/components/topAiring.jsx3
-rw-r--r--src/app/anime/styles/pop_recent_top.module.css22
3 files changed, 14 insertions, 14 deletions
diff --git a/src/app/anime/components/recentEpisodes.jsx b/src/app/anime/components/recentEpisodes.jsx
index 3cc8d4d..9e7899f 100644
--- a/src/app/anime/components/recentEpisodes.jsx
+++ b/src/app/anime/components/recentEpisodes.jsx
@@ -39,8 +39,9 @@ const RecentAnimes = async () => {
alt="Anime Poster Image"
/>
<p className={styles.AnimeTitle}>
- Ep:{item.episodeNumber} {" "}{item.title}
+ {item.title}
</p>
+ <p className={styles.AnimeReleasedEpisode}>{item.episodeNumber}</p>
</section>
</Link>
))}
diff --git a/src/app/anime/components/topAiring.jsx b/src/app/anime/components/topAiring.jsx
index 367da16..22e8c3b 100644
--- a/src/app/anime/components/topAiring.jsx
+++ b/src/app/anime/components/topAiring.jsx
@@ -41,6 +41,9 @@ const TopAiringAnimes = async () => {
<p className={styles.AnimeTitle}>
{item.title}
</p>
+ <p className={styles.AnimeReleasedEpisode}>
+ {item.episodeNumber}
+ </p>
</section>
</Link>
))}
diff --git a/src/app/anime/styles/pop_recent_top.module.css b/src/app/anime/styles/pop_recent_top.module.css
index 212d07a..253f60f 100644
--- a/src/app/anime/styles/pop_recent_top.module.css
+++ b/src/app/anime/styles/pop_recent_top.module.css
@@ -50,14 +50,6 @@
transform: translateY(-5px) scale(1.04);
}
-/* .AnimeEntry p {
- margin: 0.5rem 0 -0.4rem 0;
- max-width: 170px;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- text-transform: uppercase;
-} */
.AnimeTitle {
position: absolute;
@@ -79,11 +71,15 @@
white-space: nowrap;
}
-/* .EpisodeText {
- color: var(--neon-yellow);
- font-size: small;
- padding-top: 0.2rem;
-} */
+.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;