50 lines
1.1 KiB
Svelte
50 lines
1.1 KiB
Svelte
<script lang="ts">
|
||
var ratCounter = 0;
|
||
let playSound = function() {
|
||
new Audio(`common/rat/bolt${ratCounter}.wav`).play();
|
||
ratCounter += 1;
|
||
if (ratCounter == 3) {
|
||
ratCounter = 0;
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<footer>
|
||
<div class="text-container">
|
||
<p>〔 2023–2025 〕<i>denizk0461</i></p>
|
||
</div>
|
||
<img onclick={playSound} title="the bottom rat" class="bottom-rat clickable" src="/common/rat/spookyrat.webp">
|
||
</footer>
|
||
|
||
<style>
|
||
footer {
|
||
background-color: var(--color-background-highlight);
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 0;
|
||
height: 120px;
|
||
width: 100%;
|
||
/* overflow: hidden; */
|
||
backdrop-filter: blur(6px);
|
||
}
|
||
|
||
footer p {
|
||
font-family: var(--font-mono);
|
||
font-weight: 500;
|
||
}
|
||
|
||
.bottom-rat {
|
||
position: absolute;
|
||
width: 20%;
|
||
max-width: 100px;
|
||
right: 0;
|
||
bottom: 0;
|
||
}
|
||
|
||
.text-container {
|
||
height: 100%;
|
||
margin: auto 24px auto 48px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
</style> |