w/web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

i forgot

Browse source
This commit is contained in:
laura 2025-11-01 23:46:32 -03:00
parent 30f2b4714d
commit 0c9f7a7822
Signed by: w
GPG key ID: BCD2117C99E69817
21 changed files with 1868 additions and 1839 deletions
Download patch file Download diff file Expand all files Collapse all files

51
islands/Name.tsx
View file

@ -6,32 +6,31 @@
import { useEffect, useState } from "preact/hooks";
export default function Name() {
const names = ["muxiepuff", "lívia", "aury"];
const ipas = ["/ˈmuˌksipʌf/", "/li.vjɐ/", "/ˈaʊ̯ˌɾi/"]
;
const [currentIndex, setCurrentIndex] = useState(0);
const [isAnimating, setIsAnimating] = useState(false);
const names = ["muxiepuff", "lívia", "aury"];
const ipas = ["/ˈmuˌksipʌf/", "/li.vjɐ/", "/ˈaʊ̯ˌɾi/"];
const [currentIndex, setCurrentIndex] = useState(0);
const [isAnimating, setIsAnimating] = useState(false);
useEffect(() => {
const interval = setInterval(() => {
setIsAnimating(true);
setTimeout(() => {
setCurrentIndex((prev) => (prev + 1) % names.length);
setIsAnimating(false);
}, 200);
}, 2000);
return () => clearInterval(interval);
}, []);
useEffect(() => {
const interval = setInterval(() => {
setIsAnimating(true);
setTimeout(() => {
setCurrentIndex((prev) => (prev + 1) % names.length);
setIsAnimating(false);
}, 200);
}, 2000);
return () => clearInterval(interval);
}, []);
return (
<span class="name-scroller">
<span class={`name-wrapper ${isAnimating ? "animating" : ""}`}>
<span class="name-text">
{names[currentIndex]}
<span class="name-underline"></span>
</span>{" "}
<span class="alt alt-font">({ipas[currentIndex]}, she/her)</span>
</span>
</span>
);
return (
<span class="name-scroller">
<span class={`name-wrapper ${isAnimating ? "animating" : ""}`}>
<span class="name-text">
{names[currentIndex]}
<span class="name-underline"></span>
</span>{" "}
<span class="alt alt-font">({ipas[currentIndex]}, she/her)</span>
</span>
</span>
);
}