feat: slight adjustment to background

src/components/sections/ExperienceSection.astro

@@ -166,7 +166,3 @@ const experiences = ((await directus.request(
     })}
   </ul>
 </section>
-
-<script>
-  import "@preline/collapse/index.js";
-</script>

src/layouts/BaseLayout.astro

@@ -62,12 +62,6 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
       window.localStorage.setItem('theme', theme);
     </script>
 
-    <!-- Preline -->
-    <script
-      src="/vendor/preline/collapse2.1.0.min.js"
-      is:inline
-    ></script>
-
     <!-- Rybbit Tracking Snippet -->
     <script
       src="https://rybbit.alexlebens.dev/api/script.js"
@@ -101,6 +95,20 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
       </main>
     </div>
 
+    <!-- Load Preline -->
+    <script>
+      import "preline";
+      if (window.HSStaticMethods) {
+        window.HSStaticMethods.autoInit();
+      }
+      document.addEventListener("swup:page:view", () => {
+        if (window.HSStaticMethods) {
+          window.HSStaticMethods.autoInit();
+        }
+      });
+    </script>
+
+
   </body>
 </html>
 

src/styles/global.css

@@ -50,8 +50,8 @@
   --color-background-accent: light-dark(color-mix(in srgb, var(--color-slate-300) 40%, transparent), color-mix(in srgb, var(--color-mist-900) 20%, transparent));
   --color-background-card: light-dark(color-mix(in srgb, var(--color-mist-100) 80%, transparent), color-mix(in srgb, var(--color-mist-900) 40%, transparent));
 
-  --color-background-1: light-dark(color-mix(in srgb, var(--color-mist-200) 75%, var(--color-slate-100)), color-mix(in srgb, var(--color-mist-700) 95%, var(--color-mist-950)));
-  --color-background-2: light-dark(color-mix(in srgb, var(--color-mist-400) 10%, var(--color-slate-100)), color-mix(in srgb, var(--color-mist-700) 80%, var(--color-mist-950)));
+  --color-background-1: light-dark(color-mix(in srgb, var(--color-mist-200) 75%, var(--color-slate-100)), color-mix(in srgb, var(--color-mist-700) 75%, var(--color-mist-950)));
+  --color-background-2: light-dark(color-mix(in srgb, var(--color-mist-400) 10%, var(--color-slate-100)), color-mix(in srgb, var(--color-mist-700) 50%, var(--color-mist-900)));
   --color-background-3: light-dark(color-mix(in srgb, var(--color-mist-200) 85%, var(--color-slate-100)), color-mix(in srgb, var(--color-mist-700) 85%, var(--color-mist-950)));
 
   /* Object colors */