kennethnym/infinifi
1
0
Fork 0
Code Issues 2 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Fix: CSS + Imports #2

Closed
Yagasaki7K wants to merge 1 commits from main into main
pull from: main
merge into: kennethnym:main
Conversation 1 Commits 1 Files Changed 3 +13 -14
3 changed files with 13 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
web/index.html
View File

@@ -2,7 +2,7 @@
<html>
<head>
<title>infinifi</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="./style.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
@@ -24,18 +24,17 @@
<input id="volume-slider" type="range" min="0" max="100" step="1" />
</div>
</main>
<img class="cat" src="/images/cat-0.png"></img>
<img class="eeping-cat" src="/images/eeping-cat.png"></img>
<img class="cat" src="./images/cat-0.png"></img>
<img class="eeping-cat" src="./images/eeping-cat.png"></img>
</div>
<footer>
<span>made by kennethnym &lt;3 ·&nbsp;</span>
<a href="https://github.com/kennethnym/infinifi">github</a>
<span>made by kennethnym &lt;3 · <a href="https://github.com/kennethnym/infinifi">github</a></span>
</footer>
<canvas id="bg"></canvas>
<script type="text/javascript" src="/bg.js"></script>
<script type="text/javascript" src="/script.js"></script>
<script type="text/javascript" src="./bg.js"></script>
<script type="text/javascript" src="./script.js"></script>
</body>
</html>

8
web/script.js
View File

@@ -2,8 +2,8 @@ const playBtn = document.getElementById("play-btn");
const catImg = document.getElementsByClassName("cat")[0];
const volumeSlider = document.getElementById("volume-slider");
const currentVolumeLabel = document.getElementById("current-volume-label");
const clickAudio = new Audio("/audio/click.wav");
const clickReleaseAudio = new Audio("/audio/click-release.wav");
const clickAudio = new Audio("./audio/click.wav");
const clickReleaseAudio = new Audio("./audio/click-release.wav");
const CROSSFADE_DURATION_MS = 5000;
const CROSSFADE_INTERVAL_MS = 20;
@@ -17,7 +17,7 @@ let currentVolume = 0;
function playAudio() {
// add a random query parameter at the end to prevent browser caching
currentAudio = new Audio(`/current.mp3?t=${Date.now()}`);
currentAudio = new Audio(`./current.mp3?t=${Date.now()}`);
currentAudio.onplay = () => {
isPlaying = true;
playBtn.innerText = "pause";
@@ -93,7 +93,7 @@ function animateCat() {
} else {
current += 1;
}
catImg.src = `/images/cat-${current}.png`;
catImg.src = `./images/cat-${current}.png`;
}, 500);
}

6
web/style.css
View File

@@ -170,21 +170,21 @@ a {
input[type="range"] {
overflow: hidden;
height: var(--range-height);
-webkit-appearance: none;
appearance: none;
border: 2px solid var(--text);
background-color: var(--base);
}
input[type="range"]::-webkit-slider-runnable-track {
height: var(--range-height);
-webkit-appearance: none;
appearance: none;
color: #13bba4;
}
input[type="range"]::-webkit-slider-thumb {
width: var(--range-height);
height: var(--range-height);
-webkit-appearance: none;
appearance: none;
background: var(--text);
box-shadow: -80px 0 0 80px var(--range-accent);
}