.option-btn background: #ffffff; border: 2px solid #eeddaa; border-radius: 60px; padding: 1rem 1.2rem; font-size: 1rem; font-weight: 500; text-align: left; display: flex; align-items: center; gap: 1rem; transition: all 0.2s; cursor: pointer; color: #2e241f; font-family: inherit;
return ` <div class="option-btn $additionalClass $answerLocked ? 'disabled-opt' : ''" data-opt-index="$idx"> <div class="option-prefix">$prefixLetter</div> <div>$escapeHtml(opt)</div> </div> `; ).join(''); nihongo challenge n3
const html = ` <div class="quiz-main"> <div class="question-text">$escapeHtml(q.text)</div> <div class="options-area" id="optionsArea"> $optionsHtml </div> <div class="feedback-area" id="feedbackMsg">$feedbackMsg</div> <button class="next-btn" id="nextButton" disabled>次の問題 ➡</button> <button class="restart-btn" id="restartButton">🔄 チャレンジをやり直す</button> </div> `; .option-btn background: #ffffff