From 8a3eaac990df7952cc6f929116e6e47ca54f0f5a Mon Sep 17 00:00:00 2001
From: oskarrough <oskar@rough.dk>
Date: Thu, 22 Feb 2024 23:12:39 +0100
Subject: [PATCH] Styling and faster overlay animation

---
 src/ui/styles/overlay.css | 6 +++---
 src/ui/styles/targets.css | 8 ++++----
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/ui/styles/overlay.css b/src/ui/styles/overlay.css
index aeaae748..1f896ab5 100644
--- a/src/ui/styles/overlay.css
+++ b/src/ui/styles/overlay.css
@@ -50,7 +50,7 @@
 	width: 100%;
 	overflow-x: hidden;
 	overflow-y: auto;
-	transform: translate3d(0, 4rem, 0);
+	transform: translate3d(0, 1rem, 0);
 	display: block;
 	opacity: 0;
 	visibility: hidden;
@@ -80,8 +80,8 @@
 	opacity: 1;
 	transform: translate3d(0, 0, 0);
 	transition:
-		opacity 400ms 60ms var(--easing),
-		transform 400ms 60ms var(--easing);
+		opacity 600ms 60ms var(--easing),
+		transform 600ms 60ms var(--easing);
 }
 .Overlay[open] .Overlay-bg {
 	display: block;
diff --git a/src/ui/styles/targets.css b/src/ui/styles/targets.css
index 4a816a8e..a77cd7f5 100644
--- a/src/ui/styles/targets.css
+++ b/src/ui/styles/targets.css
@@ -77,7 +77,7 @@
 .Healthbar-label {
 	position: relative;
 	z-index: 1;
-	margin: 0.2em 0;
+	margin: 0.4em 0;
 	font-weight: bold;
 	color: var(--text);
 	text-shadow: var(--text-stroke) 1px 0px 0px, var(--text-stroke) 0.540302px 0.841471px 0px,
@@ -97,7 +97,7 @@
 }
 @media (min-width: 800px) {
 	.Healthbar-label span {
-		transform: scale(1.7);
+		transform: scale(1.5);
 	}
 }
 .Healthbar-bar {
@@ -108,10 +108,10 @@
 	max-width: 100%;
 	height: 100%;
 	background: var(--yellow);
-	transition: width 400ms, background 200ms;
+	transition: width 600ms var(--easing), background 300ms var(--easing);
 	border-radius: 0.5rem;
 	font-size: 1.25rem;
-	line-height: 1.3;
+	line-height: 1.8;
 	font-weight: bold;
 	text-shadow: 1px 1px 0 hsla(0, 0%, 95%, 0.8);
 }