Refactor app.js to improve structure and readability of spirit overlay content

This commit is contained in:
2025-05-28 18:59:58 +02:00
parent 47b45eed6f
commit 7b74345d1c

View File

@@ -523,15 +523,17 @@ function showSpiritOverlay(spirit) {
onmouseover="this.style.background='rgba(255,255,255,0.10)'"
onmouseout="this.style.background='none'"
>&times;</button>
${spirit['Image URL'] ? `<img src="${spirit['Image URL']}" alt="Spirit Image">` : ''}
<div class="spirit-info-content">
<h2 style="margin:0 0 8px 0;">${spirit.Name || 'Spirit'}</h2>
<b>${spirit.Kategorie || ''}</b><br><br>
<b>Mythos:</b> ${spirit["Mythos/Legende"] || ''}<br><br>
<b>Rolle:</b> ${spirit["Funktion/Rolle"] || ''}<br>
<b>Charakter:</b> ${spirit.Charakter || ''}<br><br>
${spirit.Herkunft ? '<i>' + spirit.Herkunft + '</i>' : ''}
</div>
<div class="spirit-info-flex">
${spirit['Image URL'] ? `<img src="${spirit['Image URL']}" alt="Spirit Image">` : ''}
<div class="spirit-info-content">
<h2 style="margin:0 0 8px 0;">${spirit.Name || 'Spirit'}</h2>
<b>${spirit.Kategorie || ''}</b><br><br>
<b>Mythos:</b> ${spirit["Mythos/Legende"] || ''}<br><br>
<b>Rolle:</b> ${spirit["Funktion/Rolle"] || ''}<br>
<b>Charakter:</b> ${spirit.Charakter || ''}<br><br>
${spirit.Herkunft ? '<i>' + spirit.Herkunft + '</i>' : ''}
</div>
</div>
`;
el.style.display = "block";
lastOverlaySpiritData = spirit;