design#135

This commit is contained in:
ben8
2025-06-08 19:51:10 +02:00
parent c41d9cc9b5
commit 431e1c07c8
3 changed files with 16 additions and 9 deletions

View File

@@ -11,7 +11,7 @@
<div class="grid grid-cols-2 gap-4">
{% for option in question_data.options %}
<div id="option-box-{{ forloop.counter0 }}" class="bg-gray-100 relative p-4 rounded-lg overflow-hidden {% if option.is_correct %} border-2 border-green-500{% else %}border-2 border-red-500{% endif %}">
<div id="option-box-{{ forloop.counter0 }}" class="bg-gray-100 relative p-4 rounded-lg overflow-auto break-words hyphens-auto {% if option.is_correct %} border-2 border-green-500{% else %}border-2 border-red-500{% endif %}">
<div id="option-fill-{{ forloop.counter0 }}" class="absolute left-0 top-0 h-full {% if option.is_correct %}bg-green-300 {% else %}bg-red-300 {% endif %} opacity-50 z-0 transition-all duration-1500 " style="width: 0%;"></div>
<div class="relative z-10">
@@ -181,9 +181,12 @@
el.style.transform = 'translateY(20px)';
}
});
try{
document.getElementById("finish-button").style.display = 'none';}
catch{}
// Warten bevor Animation startet
await sleep(1500); // <<< hier die Pause
await sleep(500); // <<< hier die Pause
// Transition-Eigenschaft setzen nach Render-Zyklus
@@ -200,9 +203,13 @@
if (index === top3.length - 1) {
triggerConfetti();
try{
document.getElementById("finish-button").style.display = 'block';}
catch{}
}
}, index * 1500); // Zeitversetzt aufdecken
}, index * 1000); // Zeitversetzt aufdecken
});
});
});