From a6cbdefc409779e2529ca16e6cddaac0b63196b2 Mon Sep 17 00:00:00 2001
From: JovannMC <jovannmc@femboyfurry.net>
Date: Wed, 5 Feb 2025 18:21:04 +0300
Subject: [PATCH] Update accent colours & mobile logo

---
 src/app.scss                    | 22 +++++++++++-----------
 src/routes/+layout.svelte       | 11 ++++++-----
 src/routes/convert/+page.svelte |  2 +-
 3 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/app.scss b/src/app.scss
index 3e3faa9..17b7cea 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -30,17 +30,17 @@
 
 @mixin light {
 	// general
-	--accent-pink: hsl(303, 73%, 81%);
-	--accent-red: hsl(348, 71%, 81%);
-	--accent-purple: hsl(264, 71%, 81%);
-	--accent-blue: hsl(220, 73%, 81%);
+	--accent-pink: hsl(302, 100%, 76%);
+	--accent-red: hsl(348, 100%, 80%);
+	--accent-purple: hsl(264, 100%, 81%);
+	--accent-blue: hsl(220, 100%, 78%);
 	--accent: var(--accent-pink);
 
 	// foregrounds
 	--fg: hsl(0, 0%, 0%);
 	--fg-muted: hsla(0, 0%, 0%, 0.6);
 	--fg-on-accent: hsl(0, 0%, 0%);
-	--fg-on-badge: hsl(0, 0%, 100%);
+	--fg-on-badge: hsl(0, 0%, 0%);
 
 	// backgrounds
 	--bg: hsl(0, 0%, 95%);
@@ -83,7 +83,7 @@
 	--bg-panel-accented: hsl(0, 0%, 92%);
 	--bg-separator: hsl(0, 0%, 88%);
 	--bg-button: var(--bg-panel-accented);
-	--bg-badge: hsl(0, 0%, 0%);
+	--bg-badge: var(--accent-pink);
 	--bg-input: #e0e0e0;
 
 	--shadow-panel: 0 2px 4px 0 hsla(0, 0%, 0%, 0.15);
@@ -91,10 +91,10 @@
 
 @mixin dark {
 	// general
-	--accent-pink: hsl(303, 73%, 81%);
-	--accent-red: hsl(348, 71%, 81%);
-	--accent-purple: hsl(264, 71%, 81%);
-	--accent-blue: hsl(220, 73%, 81%);
+	--accent-pink: hsl(302, 100%, 76%);
+	--accent-red: hsl(348, 100%, 80%);
+	--accent-purple: hsl(264, 100%, 81%);
+	--accent-blue: hsl(220, 100%, 78%);
 	--accent: var(--accent-pink);
 
 	// foregrounds
@@ -144,7 +144,7 @@
 	--bg-panel-accented: color-mix(in srgb, var(--accent) 12%, transparent);
 	--bg-separator: hsl(220, 4%, 28%);
 	--bg-button: hsl(220, 6%, 28%);
-	--bg-badge: hsl(0, 0%, 100%);
+	--bg-badge: var(--accent-pink);
 
 	--shadow-panel: 0 4px 6px 0 hsla(0, 0%, 0%, 0.15);
 
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index c4a8abc..adda6ed 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -132,17 +132,18 @@
 	<div>
 		<!-- Mobile logo -->
 		<div class="flex md:hidden justify-center items-center p-8">
-			<div
-				class="flex items-center justify-center w-36 h-20 bg-panel p-4 rounded-2xl"
+			<a
+				class="flex items-center justify-center w-36 h-[72px] bg-panel p-4 rounded-[20px] shadow-panel"
+				href="/"
 			>
 				<div
-					class="w-[120px] h-14 bg-accent rounded-xl flex items-center justify-center"
+					class="h-14 bg-accent rounded-[14px] flex items-center justify-center"
 				>
-					<div class="h-5 w-full">
+					<div class="w-[128px] h-5">
 						<Logo />
 					</div>
 				</div>
-			</div>
+			</a>
 		</div>
 
 		<!-- Desktop navbar -->
diff --git a/src/routes/convert/+page.svelte b/src/routes/convert/+page.svelte
index 916a1e4..7006683 100644
--- a/src/routes/convert/+page.svelte
+++ b/src/routes/convert/+page.svelte
@@ -113,7 +113,7 @@
 						/>
 						<div class="w-full flex items-center justify-between">
 							<button
-								class="btn p-0 w-14 h-14 {isAudio
+								class="btn p-0 w-14 h-14 text-black {isAudio
 									? 'bg-accent-purple'
 									: 'bg-accent-blue'}"
 								disabled={!files.ready}