From d5dda0b46248234e4d239c101530fe5b0a83ec68 Mon Sep 17 00:00:00 2001
From: Andrew Gioia <andrew@gioia.email>
Date: Wed, 29 Apr 2026 16:01:00 -0400
Subject: [PATCH] Better shapes animations

---
 assets/css/site.css | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/assets/css/site.css b/assets/css/site.css
index 65921fe..cb77c92 100644
--- a/assets/css/site.css
+++ b/assets/css/site.css
@@ -783,6 +783,7 @@ body#default
         #square,
         #triangle {
             position: absolute;
+            transition: transform 2000ms ease-in-out;
         }
 
         #semicircle {
@@ -792,6 +793,14 @@ body#default
             border-radius: 10dvw 10dvw 0 0;
             left: 52dvw;
             width: 20dvw;
+
+            &:hover {
+                transform: rotate(6deg) translateY(0.25dvh);
+
+                + #square {
+                    transform: rotate(6deg) translateY(0.25dvh) translateX(0.5dvw);
+                }
+            }
         }
 
         #square {
@@ -799,6 +808,10 @@ body#default
             height: 12dvw;
             width: 12dvw;
             bottom: 0;
+
+            &:has(+ #circle:hover) {
+                transform: translateX(-0.125dvw);
+            }
         }
 
         #circle {
@@ -808,6 +821,10 @@ body#default
             bottom: 5dvh;
             left: 4dvw;
             width: 20dvw;
+
+            &:hover {
+                transform: translateX(1rem);
+            }
         }
 
         #rectangle {
@@ -816,6 +833,11 @@ body#default
             width: 36dvw;
             left: 2dvw;
             bottom: 0;
+            transform-origin: 38%;
+
+            &:hover {
+                transform: rotate(-6deg) translateY(-0.125dvh);
+            }
         }
 
         #triangle {