From 87174eab5bdeb4c0d1ed62fded1c041fc69d455f Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Sat, 14 Sep 2024 12:18:12 +0100
Subject: [PATCH] fix diff color

---
 src/common/song-utils.ts       |  6 +++---
 src/components/score/score.tsx | 20 ++++++++++++--------
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/common/song-utils.ts b/src/common/song-utils.ts
index 5bef4ac..3003d41 100644
--- a/src/common/song-utils.ts
+++ b/src/common/song-utils.ts
@@ -1,9 +1,9 @@
 const diffColors: Record<string, string> = {
-  easy: "MediumSeaGreen",
+  easy: "#3CB371",
   normal: "#59b0f4",
-  hard: "tomato",
+  hard: "#FF6347",
   expert: "#bf2a42",
-  expertPlus: "#8f48db",
+  expertplus: "#8f48db",
 };
 
 const badgesDef: {
diff --git a/src/components/score/score.tsx b/src/components/score/score.tsx
index 5e3e3a3..d5aca5c 100644
--- a/src/components/score/score.tsx
+++ b/src/components/score/score.tsx
@@ -4,7 +4,7 @@ import { beatsaverService } from "@/common/service/impl/beatsaver";
 import ScoreSaberPlayerScore from "@/common/service/types/scoresaber/scoresaber-player-score";
 import BeatSaverMap from "@/common/database/types/beatsaver-map";
 import LeaderboardScores from "@/components/leaderboard/leaderboard-scores";
-import { useCallback, useEffect, useState } from "react";
+import { Suspense, useCallback, useEffect, useState } from "react";
 import ScoreButtons from "./score-buttons";
 import ScoreSongInfo from "./score-info";
 import ScoreRankInfo from "./score-rank-info";
@@ -33,15 +33,19 @@ export default function Score({ playerScore }: Props) {
 
   return (
     <div className="pb-2 pt-2">
-      <div className="grid w-full gap-2 lg:gap-0 first:pt-0 last:pb-0 grid-cols-[20px 1fr_1fr] lg:grid-cols-[0.85fr_4fr_1fr_300px]">
+      <div
+        className={`grid w-full gap-2 lg:gap-0 first:pt-0 last:pb-0 grid-cols-[20px 1fr_1fr] lg:grid-cols-[0.85fr_4fr${beatSaverMap && "_1fr"}_300px]`}
+      >
         <ScoreRankInfo score={score} />
         <ScoreSongInfo leaderboard={leaderboard} beatSaverMap={beatSaverMap} />
-        <ScoreButtons
-          playerScore={playerScore}
-          beatSaverMap={beatSaverMap}
-          isLeaderboardExpanded={isLeaderboardExpanded}
-          setIsLeaderboardExpanded={setIsLeaderboardExpanded}
-        />
+        <Suspense>
+          <ScoreButtons
+            playerScore={playerScore}
+            beatSaverMap={beatSaverMap}
+            isLeaderboardExpanded={isLeaderboardExpanded}
+            setIsLeaderboardExpanded={setIsLeaderboardExpanded}
+          />
+        </Suspense>
         <ScoreStats score={score} leaderboard={leaderboard} />
       </div>
       {isLeaderboardExpanded && <LeaderboardScores leaderboard={leaderboard} />}