diff --git a/app/templates/index.html b/app/templates/index.html
index 38f77ce..03b4303 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -243,9 +243,18 @@ async function fetchVotingStatus() {
const res = await fetch('/voting/status');
const data = await res.json();
+ const wasOpen = votingOpen;
votingOpen = data.is_open;
myVotedPlaylistId = data.my_last_vote_playlist_id;
+ if (wasOpen && !votingOpen && data.playlists?.length) {
+ const totalVotes = data.playlists.reduce((s, p) => s + p.votes, 0);
+ if (totalVotes > 0) {
+ const winner = data.playlists.reduce((best, p) => p.votes > best.votes ? p : best);
+ playItem(winner.spotify_id, winner.spotify_type);
+ }
+ }
+
// Solo sincronizar cooldown desde servidor si no hay timer local activo
if (cooldownRemaining <= 0 && data.cooldown_remaining > 0) {
startCooldownTick(data.cooldown_remaining);
@@ -291,9 +300,12 @@ function renderPlaylists(playlists, isVoting, myVote) {
const btnLabel = cooldownRemaining > 0 ? `⏳ ${cooldownRemaining}s` : '👍 Votar';
const btnDisabled = cooldownRemaining > 0 ? 'disabled' : '';
return `
-
- ${img}
-
${pl.name}
+
+
+ ${img}
+
${pl.name}
+ ${pl.description ? `
${pl.description}
` : ''}
+
${pl.votes} votos
@@ -416,7 +428,18 @@ setInterval(fetchVotingStatus, 5000);
gap: .5rem;
}
-.voting-card { cursor: pointer; position: relative; }
+.voting-card { position: relative; }
+.voting-card-top { cursor: pointer; flex: 1; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
+.voting-card-top:hover .playlist-card-name { color: var(--green); }
+.playlist-card-desc {
+ font-size: 0.7rem;
+ color: var(--text-muted);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ width: 100%;
+ text-align: center;
+}
.voting-card.voted { border: 2px solid var(--green); }
.vote-bar-wrap {
diff --git a/static/style.css b/static/style.css
index 87581ee..a045b63 100644
--- a/static/style.css
+++ b/static/style.css
@@ -197,8 +197,9 @@ a:hover { text-decoration: underline; }
align-items: center;
justify-content: center;
font-size: 2rem;
+ container-type: inline-size;
}
-.playlist-thumb-emoji { font-size: 2.4rem; }
+.playlist-thumb-emoji { font-size: 55cqi; }
.playlist-card-name {
font-size: 0.78rem;