add hover transition to the footer

src/components/score/score-stats.tsx

@@ -1,5 +1,5 @@
-import ScoreSaberLeaderboard from "@/common/service/types/scoresaber/scoresaber-leaderboard";
-import ScoreSaberScore from "@/common/service/types/scoresaber/scoresaber-score";
+import ScoreSaberLeaderboardToken from "@/common/model/token/scoresaber/score-saber-leaderboard-token";
+import ScoreSaberScoreToken from "@/common/model/token/scoresaber/score-saber-score-token";
 import { formatNumberWithCommas } from "@/common/number-utils";
 import StatValue from "@/components/stat-value";
 import { XMarkIcon } from "@heroicons/react/24/solid";
@@ -9,12 +9,12 @@ import { accuracyToColor } from "@/common/song-utils";
 type Badge = {
   name: string;
   color?: (
-    score: ScoreSaberScore,
-    leaderboard: ScoreSaberLeaderboard,
+    score: ScoreSaberScoreToken,
+    leaderboard: ScoreSaberLeaderboardToken,
   ) => string | undefined;
   create: (
-    score: ScoreSaberScore,
-    leaderboard: ScoreSaberLeaderboard,
+    score: ScoreSaberScoreToken,
+    leaderboard: ScoreSaberLeaderboardToken,
   ) => string | React.ReactNode | undefined;
 };
 
@@ -24,7 +24,7 @@ const badges: Badge[] = [
     color: () => {
       return "bg-pp";
     },
-    create: (score: ScoreSaberScore) => {
+    create: (score: ScoreSaberScoreToken) => {
       const pp = score.pp;
       if (pp === 0) {
         return undefined;
@@ -34,18 +34,24 @@ const badges: Badge[] = [
   },
   {
     name: "Accuracy",
-    color: (score: ScoreSaberScore, leaderboard: ScoreSaberLeaderboard) => {
+    color: (
+      score: ScoreSaberScoreToken,
+      leaderboard: ScoreSaberLeaderboardToken,
+    ) => {
       const acc = (score.baseScore / leaderboard.maxScore) * 100;
       return accuracyToColor(acc);
     },
-    create: (score: ScoreSaberScore, leaderboard: ScoreSaberLeaderboard) => {
+    create: (
+      score: ScoreSaberScoreToken,
+      leaderboard: ScoreSaberLeaderboardToken,
+    ) => {
       const acc = (score.baseScore / leaderboard.maxScore) * 100;
       return `${acc.toFixed(2)}%`;
     },
   },
   {
     name: "Score",
-    create: (score: ScoreSaberScore) => {
+    create: (score: ScoreSaberScoreToken) => {
       return `${formatNumberWithCommas(score.baseScore)}`;
     },
   },
@@ -59,7 +65,7 @@ const badges: Badge[] = [
   },
   {
     name: "Full Combo",
-    create: (score: ScoreSaberScore) => {
+    create: (score: ScoreSaberScoreToken) => {
       const fullCombo = score.missedNotes === 0;
 
       return (
@@ -81,8 +87,8 @@ const badges: Badge[] = [
 ];
 
 type Props = {
-  score: ScoreSaberScore;
-  leaderboard: ScoreSaberLeaderboard;
+  score: ScoreSaberScoreToken;
+  leaderboard: ScoreSaberLeaderboardToken;
 };
 
 export default function ScoreStats({ score, leaderboard }: Props) {