diff --git a/public/js/app.js b/public/js/app.js index 7a03aee..05dbed1 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -1197,14 +1197,14 @@ function WettkampfQuizPage({ params, navigate }) { return (
{chunks.map((chunk, rowIdx) => ( -
+
{chunk.map(({ q, origIndex }) => { const a = answers[q.id]; const isAnswered = a && a.selected && a.selected.length > 0 && a.selected[0] !== ''; const isCurrent = origIndex === index; const style = {}; - // w-7 allows for more questions per row on smaller screens - let cls = 'w-7 h-7 sm:w-8 sm:h-8 md:w-9 md:h-9 rounded-md sm:rounded-lg text-xs sm:text-sm font-bold transition-all flex items-center justify-center shrink-0 '; + // flex-nowrap with flex-1 aspect-square forces it on one row safely shrinking on mobile + let cls = 'flex-1 max-w-[2.25rem] aspect-square rounded-md sm:rounded-lg text-xs sm:text-sm font-bold transition-all flex items-center justify-center min-w-0 overflow-hidden shrink '; if (isCurrent) { cls += 'text-white ring-2'; style.backgroundColor = '#f59e0b'; style.boxShadow = '0 0 0 2px #fcd34d'; } else if (isAnswered) { cls += 'text-white'; style.backgroundColor = accentColor; } else cls += 'bg-gray-700 text-gray-400 hover:bg-gray-600';