feat(layout): ?uwu qs == spin

Co-authored-by: Jake Hamilton <jake.hamilton@hey.com>

package.json

@@ -28,6 +28,7 @@
 	"type": "module",
 	"dependencies": {
 		"@sveltejs/enhanced-img": "^0.3.9",
+		"clsx": "^2.1.1",
 		"svelte-highlight": "^7.7.0"
 	}
 }

src/lib/uwu.ts

@@ -0,0 +1,4 @@
+import { page } from "$app/stores";
+import { get } from "svelte/store";
+
+export const isUwU = () => get(page).url.searchParams.has("uwu");

src/routes/+layout.svelte

@@ -3,6 +3,8 @@
 	import "../main.css";
 	import Footer from "$lib/components/Footer.svelte";
 	import Nav from "$lib/components/Nav.svelte";
+	import { isUwU } from "$lib/uwu";
+	import clsx from "clsx";
 
 	let { children } = $props();
 	globalThis.PKGS = "petalpkgs";
@@ -20,10 +22,14 @@
 <div class="flex flex-col underline-offset-[4px]">
 	<nav class="min-h-16 h-16 bg-zinc-50 mb-2">
 		<div class="mx-auto container flex h-full justify-between">
-			<a class="flex h-full items-center justify-center font-aladin text-3xl/10
-					  text-coral-970 transition-colors duration-75 no-link-style gap-x-2 hover:bg-clip-text hover:bg-gradient-to-r hover:from-coral-500 hover:from-15% hover:to-coral-400 hover:text-transparent"
+			<a class="group flex h-full items-center justify-center font-aladin text-3xl/10
+					  text-coral-970 transition-colors duration-75 no-link-style gap-x-2
+					  hover:bg-clip-text hover:bg-gradient-to-r hover:from-coral-500 hover:from-15% hover:to-coral-400 hover:text-transparent"
 			   href="/">
-				<enhanced:img src="$lib/assets/flower.svg" width="32" height="32" alt="flower" />
+				<enhanced:img src="$lib/assets/flower.svg" width="32" height="32"
+					alt="flower"
+					class={clsx(isUwU() && "transform rotate-0 group-hover:rotate-[360deg] transition-transform ease-in-out duration-500")}
+				/>
 				floral.systems
 			</a>
 			<span></span>