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 {