From de9dd5835026e4e58852411f9223b94c47e62366 Mon Sep 17 00:00:00 2001
From: Oliver-Akins <Oliver.akins1999@gmail.com>
Date: Sun, 10 Mar 2024 18:23:05 -0600
Subject: [PATCH] Update the overlay styling

---
 site/standard/health/app.js     |  3 ---
 site/standard/health/index.html |  2 +-
 site/standard/health/style.css  | 14 ++++++++++++--
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/site/standard/health/app.js b/site/standard/health/app.js
index bf5fa7b..012dbd9 100644
--- a/site/standard/health/app.js
+++ b/site/standard/health/app.js
@@ -25,9 +25,6 @@ const app = new Vue({
 		currentHealth() {
 			return this.totalHealth - this.lostHealth;
 		},
-		parsedText() {
-			return this.current.split(` █ `).join(`<br>`);
-		},
 	},
 	methods: {
 		connected() {
diff --git a/site/standard/health/index.html b/site/standard/health/index.html
index 242712d..51f6eb6 100644
--- a/site/standard/health/index.html
+++ b/site/standard/health/index.html
@@ -25,7 +25,7 @@
 						<div v-for="_ in currentHealth" class="health filled"></div>
 						<div v-for="_ in lostHealth" class="health empty"></div>
 					</div>
-					<h2 id="word" v-html="parsedText"></h2>
+					<h2 id="word">{{current}}</h2>
 				</div>
 			</div>
 		</transition>
diff --git a/site/standard/health/style.css b/site/standard/health/style.css
index 7524820..5560a93 100644
--- a/site/standard/health/style.css
+++ b/site/standard/health/style.css
@@ -20,14 +20,24 @@ html, body, #app {
 	margin: 0;
 	padding: 0;
 	overflow: hidden;
-	background: rgba(0, 0, 0, .5);
+	background: rgba(60, 51, 146, 0.8);
 	position: relative;
 	text-align: center;
 	border-radius: 15px;
+	padding: 1rem;
+	color: white;
 }
 
 h1 {
-	margin-bottom: 5px;
+	line-height: 2rem;
+	margin: 5px 0;
+	letter-spacing: 2px;
+}
+
+h2 {
+	line-height: 1.5rem;
+	margin: 20px 0 5px;
+	letter-spacing: 2px;
 }
 
 #health-bar {