diff --git a/public/images/coralz_idle.png b/public/images/coralz_idle.png new file mode 100644 index 0000000..6e1846f Binary files /dev/null and b/public/images/coralz_idle.png differ diff --git a/public/images/coralz_1.png b/public/images/coralz_poked.png similarity index 100% rename from public/images/coralz_1.png rename to public/images/coralz_poked.png diff --git a/public/images/coralz_0.png b/public/images/coralz_scared.png similarity index 100% rename from public/images/coralz_0.png rename to public/images/coralz_scared.png diff --git a/src/app/globals.css b/src/app/globals.css index f1fcebc..a5c8985 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -11,7 +11,7 @@ 0%, 100% { transform: translate(0px, 0px) scale(1, 1); } - 15% { + 10% { transform: translate(0px, 14px) scale(1.2, 0.9); } } diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx index 021ba9c..e8fb607 100644 --- a/src/app/not-found.tsx +++ b/src/app/not-found.tsx @@ -20,8 +20,9 @@ export default function NotFound() {
diff --git a/src/components/landing-image.tsx b/src/components/landing-image.tsx index 29b99e4..a03e745 100644 --- a/src/components/landing-image.tsx +++ b/src/components/landing-image.tsx @@ -2,7 +2,7 @@ import Image from "next/image" import { FloatingLabel } from "./floating-label" export const LandingImage = () => ( - + Coral <3(null); const [isAnimating, setIsAnimating] = useState(false); @@ -70,8 +72,8 @@ function WobblingImage ({ if (!audioBuffer || !audioContextRef.current) return; const context = audioContextRef.current; - const changeToLowPitch = Math.floor(Math.random() * 10); - const randomPitch = Math.random() * 0.2 + (changeToLowPitch == 1 ? 0.25 : 0.85); + const changeToLowPitch = Math.floor(Math.random() * 66); + const randomPitch = Math.random() * 0.38 + (changeToLowPitch == 1 ? 0.25 : 0.75); const source = context.createBufferSource(); source.buffer = audioBuffer; @@ -86,6 +88,9 @@ function WobblingImage ({ function handleClick() { + const pokedDuration = 700 + Math.floor(Math.random() * 100) + if (!isAware) setAware(true); + setIsAnimating(false); requestAnimationFrame(() => setIsAnimating(true)); @@ -101,7 +106,7 @@ function WobblingImage ({ setPoked(true); pokeTimeoutRef.current = setTimeout(() => { setPoked(false); - }, 600); + }, pokedDuration); } function handleAnimationEnd() { @@ -112,8 +117,8 @@ function WobblingImage ({