From d114106dc18ebb0c9250102eb3d1067dd0f0bfe6 Mon Sep 17 00:00:00 2001
From: NilsUeter <nils.ueter@gmail.com>
Date: Mon, 8 May 2023 22:24:21 +0200
Subject: [PATCH] use custom colors everywhere

---
 src/App.jsx      | 18 +++++++++---------
 src/index.css    | 10 +++++-----
 src/roster40k.js |  1 -
 3 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 3193adc..b67c608 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -9,7 +9,7 @@ function App() {
 	const [error, setError] = useState();
 	const [roster, setRoster] = useState();
 	const [onePerPage, setOnePerPage] = useState(false);
-	const [primaryColor, setPrimaryColor] = useState();
+	const [primaryColor, setPrimaryColor] = useState("#536766");
 	const uploadRef = useRef();
 	async function handleFileSelect(event) {
 		const files = event?.target?.files;
@@ -97,7 +97,13 @@ function App() {
 	}, [roster]);
 
 	return (
-		<div className="App">
+		<div
+			className="App"
+			style={{
+				"--primary-color": primaryColor,
+				"--primary-color-transparent": primaryColor + "60",
+			}}
+		>
 			<div className="header print-display-none">
 				<a href="/fancyscribe" style={{ color: "#fff", fontWeight: 800 }}>
 					FancyScribe
@@ -107,13 +113,7 @@ function App() {
 				</div>
 			</div>
 
-			<div
-				className="body"
-				style={{
-					"--primary-color": primaryColor,
-					"--primary-color-transparent": primaryColor + "60",
-				}}
-			>
+			<div className="body">
 				<div
 					className="print-display-none"
 					style={{ display: "flex", width: "100%", gap: 8 }}
diff --git a/src/index.css b/src/index.css
index 2b7a714..b0cf880 100644
--- a/src/index.css
+++ b/src/index.css
@@ -57,8 +57,8 @@ button {
 	transition: border-color 0.25s;
 }
 button:hover {
-	border-color: #536766;
-	background-color: #53676660;
+	border-color: var(--primary-color);
+	background-color: var(--primary-color-transparent);
 }
 button:focus,
 button:focus-visible {
@@ -82,7 +82,7 @@ button:focus-visible {
 	justify-content: space-between;
 	align-items: center;
 	padding: 8px 16px;
-	background-color: #536766;
+	background-color: var(--primary-color);
 	width: 100%;
 	color: #fff;
 	font-size: 1.7em;
@@ -114,8 +114,8 @@ button:focus-visible {
 }
 
 .rosterUpload:hover {
-	border-color: #536766;
-	background-color: #53676660;
+	border-color: var(--primary-color);
+	background-color: var(--primary-color-transparent);
 	font-size: 2rem;
 }
 
diff --git a/src/roster40k.js b/src/roster40k.js
index 1b9d469..77159c8 100644
--- a/src/roster40k.js
+++ b/src/roster40k.js
@@ -983,7 +983,6 @@ function ParseProfileCharacteristics(profile, profileName, typeName, map) {
 			if (!map) {
 				debugger;
 			}
-			console.log(map);
 			map.set(profileName, char.textContent);
 		}
 	}