From 890ca6dc2dc3df2df84587a0fe99f04b274c9e12 Mon Sep 17 00:00:00 2001
From: sk1982 <sk1982@noreply.gitea.tendokyu.moe>
Date: Sun, 7 Apr 2024 22:13:05 -0400
Subject: [PATCH] fix: dont use backdrop blur on firefox

---
 src/app/(with-header)/chuni/music/music-list.tsx | 2 +-
 src/app/globals.scss                             | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/app/(with-header)/chuni/music/music-list.tsx b/src/app/(with-header)/chuni/music/music-list.tsx
index 815ed29..2cad06d 100644
--- a/src/app/(with-header)/chuni/music/music-list.tsx
+++ b/src/app/(with-header)/chuni/music/music-list.tsx
@@ -86,7 +86,7 @@ const MusicGrid = ({ music, size, setMusicList, fullMusicList }: ChuniMusicListP
 					<Link href={`/chuni/music/${item.songId}`}>
 						<img src={getJacketUrl(`chuni/jacket/${item.jacketPath}`)} alt={item.title ?? 'Music'} className="rounded" />
 					</Link>
-					{item.rating && !item.worldsEndTag && <div className={`${size === 'lg' ? 'text-2xl' : ''} absolute bottom-0.5 left-0.5 bg-gray-200/60 backdrop-blur-sm px-0.5 rounded`}>
+					{item.rating && !item.worldsEndTag && <div className={`${size === 'lg' ? 'text-2xl' : ''} absolute bottom-0.5 left-0.5 bg-gray-200/60 backdrop-blur-sm moz-no-backdrop-blur px-0.5 rounded`}>
               <ChuniRating rating={+item.rating * 100} className="-my-0.5">
 								{item.rating.slice(0, item.rating.indexOf('.') + 3)}
               </ChuniRating>
diff --git a/src/app/globals.scss b/src/app/globals.scss
index a7a208c..bb0c84e 100644
--- a/src/app/globals.scss
+++ b/src/app/globals.scss
@@ -45,6 +45,11 @@ $header-height: 5.5rem;
 	background-color: black;
 }
 
+@supports (-moz-appearance:none) {
+	.moz-no-backdrop-blur {
+		--tw-backdrop-blur: initial !important;
+	}
+}
 
 @layer base {
 	:root {