fix:improve ui of the countdown by adding a low opacity circle background

2026-04-17 10:55:03 +05:30
parent 3ba9e901c9
commit 65b9d189e8
1 changed files with 7 additions and 5 deletions
@@ -14,11 +14,13 @@ export function CountdownOverlay() {
 	return (
 		<div className="w-screen h-screen bg-transparent flex items-center justify-center pointer-events-none select-none">
 			{value === null ? null : (
-				<div
-					className="text-white/90 text-[120px] font-bold leading-none tabular-nums"
-					style={{ textShadow: "0 4px 24px rgba(0, 0, 0, 0.65)" }}
-				>
-					{value}
+				<div className="flex items-center justify-center w-40 h-40 rounded-full bg-black/50">
+					<div
+						className="text-white/90 text-[80px] font-bold leading-none tabular-nums"
+						style={{ textShadow: "0 4px 24px rgba(0, 0, 0, 0.65)" }}
+					>
+						{value}
+					</div>
 				</div>
 			)}
 		</div>