yrtria/theme-song-booth
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: show formatted lyrics on customer player page above audio players

Browse source
This commit is contained in:
Troll (Hermes Agent) 2026-08-03 18:13:44 +00:00
parent 6a60aa686c
commit 7a9c8b8240
1 changed files with 35 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

35
templates/player.html
View file

@ -79,6 +79,27 @@
}
.locked h2{margin-top:0;color:#fbbf24;}
.locked p{margin:.3rem 0;}
.lyrics{
background:#111827;
border:1px solid #374151;
border-radius:.5rem;
padding:1rem 1.5rem;
margin:1rem 0;
white-space:pre-wrap;
line-height:1.7;
font-size:1.05rem;
}
.lyrics h2{
margin-top:0;
color:#fbbf24;
font-size:1.2rem;
}
.lyrics .section-label{
color:#60a5fa;
font-weight:700;
display:block;
margin-top:1rem;
}
</style>
</head>
<body>
@ -86,6 +107,20 @@
<h1>🎧 Your Custom Theme Song</h1>
<p>Hi {{ req.name }}! Listen to both versions and pick the one you want.</p>
{% if req.suno_lyrics %}
<div class="lyrics">
<h2>🎵 Song Lyrics</h2>
{% for line in req.suno_lyrics.splitlines() %}
{% if line.startswith('[') and line.endswith(']') %}
<span class="section-label">{{ line }}</span>
{% else %}
{{ line }}
{% endif %}
{% if not loop.last %}<br>{% endif %}
{% endfor %}
</div>
{% endif %}
<!-- Version A player -->
<div class="player">
<h3>Version A</h3>