rainbow glow

src/routes/+layout.svelte

@@ -1,12 +1,19 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
+	import { browser } from '$app/environment';
 
 	import "./layout.css";
 	import favicon from "$lib/assets/favicon.ico";
 	import TitleAnimation from "$lib/components/TitleAnimation.svelte";
 	import ThemeToggle from "$lib/components/ThemeToggle.svelte";
 
+	let isDev = $state(false);
+
 	onMount(() => {
+		isDev =
+			window.location.host === 'localhost:5173' ||
+			window.location.host === 'test.bibdle.com';
+
 		// Inject analytics script
 		const script = document.createElement('script');
 		script.defer = true;
@@ -32,6 +39,8 @@
 		<TitleAnimation />
 		<div class="font-normal"></div>
 	</h1>
-	<div class="hidden"><ThemeToggle /></div>
+	{#if isDev}
+		<div class="flex justify-center pb-2"><ThemeToggle /></div>
+	{/if}
 	{@render children()}
 </div>