From e7aa57adcb54b0e518f71cac7b3845076f2fca92 Mon Sep 17 00:00:00 2001
From: wearrrrr <contact@wearr.dev>
Date: Sat, 27 Jul 2024 21:22:36 -0500
Subject: [PATCH] Move themes into their own style tag in Layout.astro

---
 src/layouts/Layout.astro | 86 ++++++++++++++++++++--------------------
 src/pages/index.astro    | 10 +++++
 2 files changed, 53 insertions(+), 43 deletions(-)

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 83b7fd6..69a066a 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -52,7 +52,6 @@ const { title, optionalPreloads } = Astro.props;
         window.dataLayer.push(arguments);
       }
       gtag("js", new Date());
-
       gtag("config", "G-P1JX4G9KSF");
     </script>
     <script>
@@ -87,15 +86,6 @@ const { title, optionalPreloads } = Astro.props;
         --background-color: black;
         --text-color: #fff;
       }
-      [data-theme="alu"] {
-        --background-color: #211d29;
-        --background-highlight: #35314a;
-        --accent-color: #624978;
-        --accent-color-brighter: #543d65;
-        --text-color: #fff;
-        --text-color-accent: #c7c7c7;
-        --dropdown-background-color: #262539;
-      }
       * {
         box-sizing: border-box;
       }
@@ -148,39 +138,6 @@ const { title, optionalPreloads } = Astro.props;
         font-size: 16px;
       }
 
-      [data-theme="mocha"] {
-        /* Catppucin Mocha theme */
-        --background-color: #1e1e2e;
-        --background-highlight: #45475a;
-        --accent-color: #181825;
-        --accent-color-brighter: #242539;
-        --text-color: #cdd6f4;
-        --text-color-accent: #bac2de;
-        --dropdown-background-color: #32324e;
-      }
-
-      [data-theme="macchiato"] {
-        /* Catppuccin Macchiato Theme */
-        --background-color: #24273a;
-        --background-highlight: #494d64;
-        --accent-color: #1e2030;
-        --accent-color-brighter: #2a2d42;
-        --text-color: #cad3f5;
-        --text-color-accent: #b8c0e0;
-        --dropdown-background-color: #323550;
-      }
-
-      [data-theme="rose_pine"] {
-        /* Rosé Pine Theme */
-        --background-color: #191724;
-        --background-highlight: #1f1d2e;
-        --accent-color: #26233a;
-        --accent-color-brighter: #2e2b4a;
-        --text-color: #e0def4;
-        --text-color-accent: #c7c5e0;
-        --dropdown-background-color: #1f1d2e;
-      }
-
       .skip-to-main-content-link {
         position: absolute;
         top: 10px;
@@ -330,5 +287,48 @@ const { title, optionalPreloads } = Astro.props;
         border: 2px solid var(--text-color);
       }
     </style>
+    <style is:global>
+      [data-theme="alu"] {
+        --background-color: #211d29;
+        --background-highlight: #35314a;
+        --accent-color: #624978;
+        --accent-color-brighter: #543d65;
+        --text-color: #fff;
+        --text-color-accent: #c7c7c7;
+        --dropdown-background-color: #262539;
+      }
+      [data-theme="mocha"] {
+        /* Catppucin Mocha theme */
+        --background-color: #1e1e2e;
+        --background-highlight: #45475a;
+        --accent-color: #181825;
+        --accent-color-brighter: #242539;
+        --text-color: #cdd6f4;
+        --text-color-accent: #bac2de;
+        --dropdown-background-color: #32324e;
+      }
+
+      [data-theme="macchiato"] {
+        /* Catppuccin Macchiato Theme */
+        --background-color: #24273a;
+        --background-highlight: #494d64;
+        --accent-color: #1e2030;
+        --accent-color-brighter: #2a2d42;
+        --text-color: #cad3f5;
+        --text-color-accent: #b8c0e0;
+        --dropdown-background-color: #323550;
+      }
+
+      [data-theme="rose_pine"] {
+        /* Rosé Pine Theme */
+        --background-color: #191724;
+        --background-highlight: #1f1d2e;
+        --accent-color: #26233a;
+        --accent-color-brighter: #2e2b4a;
+        --text-color: #e0def4;
+        --text-color-accent: #c7c5e0;
+        --dropdown-background-color: #1f1d2e;
+      }
+    </style>
   </body>
 </html>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 6519294..125f7d4 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -20,6 +20,16 @@ import { ViewTransitions } from "astro:transitions";
     <meta property="twitter:description" content="Alu is a sleek web proxy supporting multiple standards of communication, and wide levels of customization." />
     <meta property="twitter:image" content="/logo.png" />
     <ViewTransitions />
+    <script src="https://www.googletagmanager.com/gtag/js?id=G-P1JX4G9KSF" is:inline></script>
+    <script is:inline>
+      window.dataLayer = window.dataLayer || [];
+      function gtag() {
+        window.dataLayer.push(arguments);
+      }
+      gtag("js", new Date());
+
+      gtag("config", "G-P1JX4G9KSF");
+    </script>
     <script>
       const currentLang = localStorage.getItem("alu__selectedLanguage");
       const redirect = (loc: string) => (window.location.href = loc);