Nikology/nikology.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix bird button naming scheme

Browse Source
This commit is contained in:
Nikology
2026-09-13 10:15:49 +02:00
parent c4a1b1fbbd
commit 82117c4fb5
1 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+15 -11
View File
@@ -28,13 +28,17 @@
<svg id="barTemplate" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 8.47 8.47"><path fill="none" stroke="#3d2f1f" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.8" d="m1.5 4.23.23-.1a6 6 0 0 1 5.01 0l.23.1" style="paint-order:markers stroke fill"/></svg> <svg id="barTemplate" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 8.47 8.47"><path fill="none" stroke="#3d2f1f" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.8" d="m1.5 4.23.23-.1a6 6 0 0 1 5.01 0l.23.1" style="paint-order:markers stroke fill"/></svg>
</span> </span>
</div> </div>
<nav> <nav>
<a href="/" data-link>Home</a> <a href="/" data-link>Home</a>
<span>-</span> <span>-</span>
<a href="/about" data-link>About</a> <a href="/about" data-link>About</a>
<span>-</span> <span>-</span>
<a href="/photography" data-link>Photography</a> <a href="/photography" data-link>Photography</a>
</nav> </nav>
</header>
<!-- Nav Bar -->
<div id="app"></div> <div id="app"></div>
@@ -131,8 +135,8 @@
// Bird Button // Bird Button
const DISTANCE = 40 const DISTANCE = 20
const birdIcon = document.getElementById("birdButton"); const birdButton = document.getElementById("birdButton");
const birdSound = new Audio("SnowBuntingSound.ogg"); const birdSound = new Audio("SnowBuntingSound.ogg");
const template = document.getElementById("barTemplate"); const template = document.getElementById("barTemplate");
const wrap = document.querySelector(".bird-wrap"); const wrap = document.querySelector(".bird-wrap");
@@ -144,7 +148,7 @@
clone.style.setProperty("--angle", `${angle}deg`); clone.style.setProperty("--angle", `${angle}deg`);
clone.style.setProperty("--distance", `${-distance}px`); clone.style.setProperty("--distance", `${-distance}px`);
clone.style.setProperty("--delay", `${delay}s`); clone.style.setProperty("--delay", `${delay}s`);
wrap.appendChild(clone); birdButton.appendChild(clone);
clone.addEventListener("animationend", () => clone.remove()); clone.addEventListener("animationend", () => clone.remove());
} }
@@ -158,7 +162,7 @@
spawnBar(DISTANCE, -rightRandom, 0.8) spawnBar(DISTANCE, -rightRandom, 0.8)
} }
birdIcon.addEventListener("click", (e) => { birdButton.addEventListener("click", (e) => {
if (!birdSound.paused) return; if (!birdSound.paused) return;
birdSound.play(); birdSound.play();
birdSoundAnim() birdSoundAnim()