diff --git a/src/app.css b/src/app.css index 2386f1e..a6c53de 100644 --- a/src/app.css +++ b/src/app.css @@ -1,6 +1,17 @@ @import "tailwindcss"; @import "@catppuccin/tailwindcss/mocha.css"; +@property --rainbow-hue-top { + syntax: ''; + initial-value: 199; + inherits: true; +} +@property --rainbow-hue-bottom { + syntax: ''; + initial-value: 559; + inherits: true; +} + @font-face { font-family: Stray; font-display: swap; @@ -18,6 +29,14 @@ 0% { transform: translateX(100%); } 100% { transform: translateX(0%); } } + @keyframes rainbow { + 0% { --rainbow-hue-top: 199; --rainbow-hue-bottom: 559; } + 100% { --rainbow-hue-top: 559; --rainbow-hue-bottom: 199; } + } + @keyframes breathing { + 0%, 100% { opacity: 0.15; } + 50% { opacity: 0.3; } + } } @layer base { diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index dc268d0..d9f7db7 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -64,36 +64,7 @@ duration: 1500, easing: cubicOut }}> - - - +