From fbdf432e0c54d818c6867486c881cedf336ac6d7 Mon Sep 17 00:00:00 2001
From: Liam <admin@fascinated.cc>
Date: Fri, 23 Dec 2022 15:41:35 +0000
Subject: [PATCH] Added support for changing the song timer bar color

---
 src/components/SongInfo.js        | 14 ++++++++++----
 src/store/overlaySettingsStore.ts |  2 ++
 src/styles/songInfo.module.css    |  1 -
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/components/SongInfo.js b/src/components/SongInfo.js
index a342244..6336931 100644
--- a/src/components/SongInfo.js
+++ b/src/components/SongInfo.js
@@ -42,9 +42,12 @@ function formatDiff(diff) {
 }
 
 export default function SongInfo() {
-	const [showSongInfo, shouldReplacePlayerInfoWithScore] = useSettingsStore(
-		(store) => [store.showSongInfo, store.shouldReplacePlayerInfoWithScore]
-	);
+	const [showSongInfo, shouldReplacePlayerInfoWithScore, songTimeHex] =
+		useSettingsStore((store) => [
+			store.showSongInfo,
+			store.shouldReplacePlayerInfoWithScore,
+			store.songTimeHex,
+		]);
 	const [
 		isLoading,
 		bsr,
@@ -117,7 +120,10 @@ export default function SongInfo() {
 					<div className={styles.songTimeBackground} />
 					<div
 						className={styles.songTime}
-						style={{ width: songTimerPercentage + "%" }}
+						style={{
+							width: songTimerPercentage + "%",
+							backgroundColor: "#" + songTimeHex,
+						}}
 					/>
 				</div>
 			</div>
diff --git a/src/store/overlaySettingsStore.ts b/src/store/overlaySettingsStore.ts
index 6c17c87..4bb364d 100644
--- a/src/store/overlaySettingsStore.ts
+++ b/src/store/overlaySettingsStore.ts
@@ -11,6 +11,7 @@ interface SettingsState {
 	showSongInfo: boolean;
 	showCutStats: boolean;
 	shouldReplacePlayerInfoWithScore: boolean;
+	songTimeHex: string;
 	setMounted: (isMounted: boolean) => void;
 	setOverlaySettings: (params: string) => void;
 }
@@ -25,6 +26,7 @@ export const useSettingsStore = create<SettingsState>()((set) => ({
 	showSongInfo: false,
 	showCutStats: false,
 	shouldReplacePlayerInfoWithScore: false,
+	songTimeHex: "FF0000",
 
 	setMounted: (isMounted: boolean) => set(() => ({ mounted: isMounted })),
 	setOverlaySettings: (params: any) =>
diff --git a/src/styles/songInfo.module.css b/src/styles/songInfo.module.css
index 61a10c3..097a49c 100644
--- a/src/styles/songInfo.module.css
+++ b/src/styles/songInfo.module.css
@@ -68,7 +68,6 @@
 	grid-row: 1;
 	z-index: 2;
 	padding: 3px;
-	background-color: red !important;
 }
 
 .songTimeText {