From b679b0b9e3053be57d9b25697ae932f34541b7fd Mon Sep 17 00:00:00 2001
From: Sam Carton <sam.carton@komo.tech>
Date: Sun, 28 Jul 2024 15:07:42 +0800
Subject: [PATCH] big gauge

---
 src/layouts/Layout.astro |  5 -----
 src/pages/index.astro    | 36 ++++++++++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 5 deletions(-)

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 712fa2f..6a3845d 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -22,11 +22,6 @@ const { title } = Astro.props;
 </html>
 <style is:global>
   :root {
-    /* rgb(255, 190, 87)
-    rgb(222, 42, 174) */
-    /* --accent: 136, 58, 234;
-    --accent-light: 224, 204, 250;
-    --accent-dark: 49, 10, 101; */
     --accent: 222, 42, 174;
     --accent-light: 255, 63, 138;
     --accent-dark: 255, 110, 106;
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 1e2e289..17d5237 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -6,6 +6,33 @@ import Footer from "../components/Footer.astro";
 
 <Layout title="Cruise CONTROL">
   <main>
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      class="big-gauge"
+    >
+      <path d="m12 14 4-4" stroke="url(#paint0_linear_1805_24383)"></path>
+      <path
+        d="M3.34 19a10 10 0 1 1 17.32 0"
+        stroke="url(#paint0_linear_1805_24383)"></path>
+      <defs>
+        <linearGradient
+          id="paint0_linear_1805_24383"
+          gradientTransform="rotate(90)"
+        >
+          <stop offset="5%" stop-color="rgb(255, 110, 106)" stop-opacity="0.5"
+          ></stop>
+          <stop offset="95%" stop-color="rgb(255, 63, 138)" stop-opacity="0.1"
+          ></stop>
+        </linearGradient>
+      </defs>
+    </svg>
     <h1>Cruise <span class="text-gradient">CONTROL</span></h1>
     <div class="instructions">
       <p>
@@ -56,6 +83,15 @@ import Footer from "../components/Footer.astro";
       font-size: 16px;
       line-height: 1.6;
     }
+    .big-gauge {
+      position: absolute;
+      top: -20px;
+      left: 50%;
+      transform: translatex(-50%);
+      width: 220px;
+      height: auto;
+      z-index: -1;
+    }
     h1 {
       font-size: 4rem;
       font-weight: 700;