lighthouse optimization

This commit is contained in:
iou1name 2025-02-13 14:01:51 -05:00
parent 7adba24fb1
commit 8002d940c6
2 changed files with 26 additions and 16 deletions

View File

@ -18,6 +18,10 @@ main {
"f f f";
}
h2 {
font-size: 1.17em;
}
header {
grid-area: h;
}
@ -144,3 +148,7 @@ button img {
#seek-slider {
width: 90%;
}
#volume-slider {
margin: 0.5em;
}

View File

@ -5,6 +5,8 @@
<link rel="stylesheet" type="text/css" href="./static/pyrite.css">
<script type="text/javascript" src="./static/pyrite.js"></script>
<script>window.onload = init;</script>
<meta name="viewport" content="width=device-width, initial-scale=0.6">
<meta name="description" content="Fool's gold.">
<link rel="manifest" href="./static/pyrite.webmanifest">
</head>
<body>
@ -47,34 +49,34 @@
</div>
<div id="cover_art"><img alt="Album cover art" src="./static/pyrite-256x256.jpg"></div>
<div id="title">
<h4><span id="now_playing_artist">Artist</span> - <span id="now_playing_album">Album</span></h4>
<h3 id="now_playing_title">Title</h3>
<h2><span id="now_playing_artist">Artist</span> - <span id="now_playing_album">Album</span></h2>
<h2 id="now_playing_title">Title</h2>
<canvas id="visualizer" height="300" width="1000"></canvas>
</div>
<div id="player_controls">
<audio id="player" style="display:none"></audio>
<button id="prev-track-btn" class="btn" onclick="prevTrack()">
<img id="prev" src="./static/prev.svg"></img>
<button id="prev-track-btn" class="btn" onclick="prevTrack()" aria-label="Previous Track">
<img id="prev" alt="Previous Track" src="./static/prev.svg"></img>
</button>
<button id="play-btn" class="btn" onclick="playTrack()">
<img id="prev" src="./static/play.svg"></img>
<button id="play-btn" class="btn" onclick="playTrack()" aria-label="Play Track">
<img id="prev" alt="Play Track" src="./static/play.svg"></img>
</button>
<button id="pause-btn" class="btn" onclick="pauseTrack()" style="display:none">
<img id="prev" src="./static/pause.svg"></img>
<button id="pause-btn" class="btn" onclick="pauseTrack()" aria-label="Pause Track" style="display:none">
<img id="prev" alt="Pause Track" src="./static/pause.svg"></img>
</button>
<button id="next-track-btn" class="btn" onclick="nextTrack()">
<img id="prev" src="./static/prev.svg"></img>
<button id="next-track-btn" class="btn" onclick="nextTrack()" aria-label="Next Track">
<img id="prev" alt="Next Track" src="./static/prev.svg"></img>
</button>
<button id="vol-btn" class="btn" onclick="volume_off()">
<img id="vol" src="./static/volume-max.svg"</img>
<button id="vol-btn" class="btn" onclick="volume_off()" aria-label="Volume Off">
<img id="vol" alt="Volume Off" src="./static/volume-max.svg"</img>
</button>
<button id="vol-off-btn" class="btn" onclick="volume_restore()" style="display:none">
<img id="vol-off" src="./static/volume-off.svg"</img>
<button id="vol-off-btn" class="btn" onclick="volume_restore()" aria-label="Volume Restore" style="display:none">
<img id="vol-off" alt="Volume Restore" src="./static/volume-off.svg"</img>
</button>
<input id="volume-slider" type="range" max="100" value="100">
<input id="volume-slider" type="range" max="100" value="100"aria-label="Volume Slider">
</div>
<div id="seek_controls">
<input id="seek-slider" type="range" max="0" value="0">
<input id="seek-slider" type="range" max="0" value="0" aria-label="Seek Slider">
<output id="current-time">0:00</output>/<output id="duration">0:00</output>
</div>
</div>