ltadeu6/skeledance
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: explicit width on lyric-display + simplify scroll logic

Browse source 
position:absolute children with width:100% require explicit parent width.
max-width alone leaves the container at 0px, hiding all text via overflow:hidden.
Also removed jump-detection branch to avoid opacity:0 dead-ends.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ltadeu6 2026-06-08 17:16:30 -03:00
parent b75cec0107
commit 2b05d5844d
No known key found for this signature in database
GPG key ID: FB9FDAB6B6F3418D
1 changed files with 8 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

12
plugin/contents/ui/dancer.html
View file

@ -243,7 +243,7 @@ html, body {
position: absolute; position: absolute;
left: 2%; left: 2%;
top: 4%; top: 4%;
max-width: 38%; width: 38%; /* explicit width needed for abs-pos children */
height: 150px; /* 5 slots × 30px */ height: 150px; /* 5 slots × 30px */
overflow: hidden; overflow: hidden;
pointer-events: none; pointer-events: none;
@ -252,6 +252,7 @@ html, body {
} }
.lyric-ctx { .lyric-ctx {
position: absolute; position: absolute;
left: 0;
width: 100%; width: 100%;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
@ -1256,19 +1257,14 @@ function updateLyricContext(context) {
lyricDisplay.style.opacity = '1'; lyricDisplay.style.opacity = '1';
return; return;
} }
const wasNextLine = ring[3]?.textContent === active.text;
currentActive = active.text; currentActive = active.text;
if (lyricDisplay.style.opacity !== '1') { if (lyricDisplay.style.opacity !== '1') {
initSlots(context); initSlots(context);
lyricDisplay.style.opacity = '1';
} else if (wasNextLine) {
scrollUp(context);
} else { } else {
// jumped position: crossfade to new context scrollUp(context);
lyricDisplay.style.opacity = '0';
setTimeout(() => { initSlots(context); lyricDisplay.style.opacity = '1'; }, 400);
} }
lyricDisplay.style.opacity = '1';
} }
function fetchCurrent() { function fetchCurrent() {