audio/noiz
2
0
Fork 0
mirror of https://codeberg.org/armin/noiz.git synced 2026-09-01 05:50:52 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix: reserve space for audio-info to prevent layout shift on playback

Browse source
This commit is contained in:
Armin 2026-07-08 17:09:08 +02:00
commit 8bd2985fd5
1 changed files with 1 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -24,7 +24,7 @@ footer .brand { margin-left: auto; }
.player { display: flex; flex-direction: row; width: 100%; align-items: center; gap: 24px; } .player { display: flex; flex-direction: row; width: 100%; align-items: center; gap: 24px; }
canvas { width: 100%; height: 100px; border-radius: 6px; display: block; } canvas { width: 100%; height: 100px; border-radius: 6px; display: block; }
.player-right { display: flex; flex-direction: column; width: 320px; flex-shrink: 0; } .player-right { display: flex; flex-direction: column; width: 320px; flex-shrink: 0; }
.audio-info { font-size: 11px; color: #6b7089; font-variant-numeric: tabular-nums; align-self: flex-end; } .audio-info { font-size: 11px; color: #6b7089; font-variant-numeric: tabular-nums; align-self: flex-end; min-height: 1.4em; }
.player .track-info { margin-bottom: 4px; } .player .track-info { margin-bottom: 4px; }
.player .track-info .title { font-size: 16px; font-weight: 600; color: #c6c8d1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .player .track-info .title { font-size: 16px; font-weight: 600; color: #c6c8d1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.player .track-info .artist-name { font-size: 12px; color: #6b7089; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .player .track-info .artist-name { font-size: 12px; color: #6b7089; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }