From 71a8a60aa5396bcbc3621b931001b546f6ce9373 Mon Sep 17 00:00:00 2001
From: Bart van der Braak <bartvdbraak@gmail.com>
Date: Fri, 2 Feb 2024 18:41:56 +0100
Subject: [PATCH] feat: styling changes

---
 .../src/lib/components/site/icons/logo.svelte   | 17 +++++++++++++----
 apps/web/src/routes/+page.svelte                |  8 ++++----
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/lib/components/site/icons/logo.svelte b/apps/web/src/lib/components/site/icons/logo.svelte
index f977313..474c673 100644
--- a/apps/web/src/lib/components/site/icons/logo.svelte
+++ b/apps/web/src/lib/components/site/icons/logo.svelte
@@ -1,3 +1,12 @@
+<script>
+	export let colours = {
+		topleft: '#FF6C22',
+		topright: '#FF9209',
+		bottomleft: '#2B3499',
+		bottomright: '#FFD099',
+	}
+</script>
+
 <svg
 	xmlns="http://www.w3.org/2000/svg"
 	width="24"
@@ -8,8 +17,8 @@
 	stroke-linecap="round"
 	stroke-linejoin="round"
 >
-	<rect width="7" height="9" x="3" y="3" rx="1" stroke="#FF6C22" />
-	<rect width="7" height="5" x="14" y="3" rx="1" stroke="#FF9209" />
-	<rect width="7" height="9" x="14" y="12" rx="1" stroke="#2B3499" />
-	<rect width="7" height="5" x="3" y="16" rx="1" stroke="#FFD099" />
+	<rect width="7" height="9" x="3" y="3" rx="1" stroke={colours.topleft} />
+	<rect width="7" height="5" x="14" y="3" rx="1" stroke={colours.topright} />
+	<rect width="7" height="9" x="14" y="12" rx="1" stroke={colours.bottomleft} />
+	<rect width="7" height="5" x="3" y="16" rx="1" stroke={colours.bottomright} />
 </svg>
diff --git a/apps/web/src/routes/+page.svelte b/apps/web/src/routes/+page.svelte
index 8af2ea0..9a8fe87 100644
--- a/apps/web/src/routes/+page.svelte
+++ b/apps/web/src/routes/+page.svelte
@@ -8,16 +8,16 @@
 <div class="absolute inset-0 -z-10">
 	<Particles />
 </div>
-<div class="pb-16 pt-32 md:pb-32 md:pt-52">
+<div class="pb-16 pt-52 md:pb-32 md:pt-60">
 	<div class="container mx-auto text-center">
 		<h1
-			class="bg-gradient-to-r from-zinc-800 via-zinc-800/60 to-zinc-800 bg-clip-text pb-4 text-6xl font-extrabold tracking-tight text-transparent dark:from-zinc-200/60 dark:via-zinc-200 dark:to-zinc-200/60 lg:text-7xl"
+			class="bg-gradient-to-r from-zinc-800 via-zinc-800/60 to-zinc-800 bg-clip-text pb-4 text-4xl sm:text-5xl md:text-6xl font-extrabold tracking-tight text-transparent dark:from-zinc-200/60 dark:via-zinc-200 dark:to-zinc-200/60 lg:text-7xl"
 		>
 			<span class="inline-block text-balance align-top decoration-inherit"
-				>One Dashboard, Countless Solutions</span
+				>One Dashboard <br /> Countless Solutions</span
 			>
 		</h1>
-		<p class="mb-8 text-lg text-zinc-800 dark:text-zinc-300">
+		<p class="mb-8 text-sm md:text-xl text-zinc-800 dark:text-zinc-300">
 			Tame ticket overload and keep your operations teams sane
 		</p>
 		<div