Geometrylessons.github - !!better!!
html += ` <div class="question" id="question-$i"> <p>$i+1. $q.text</p> <div class="options" id="options-$i"> $optionsHtml </div> $feedbackHtml </div> `; container.innerHTML = html; attachOptionEvents(); updateScoreDisplay();
.fact-list li margin-bottom: 0.7rem; padding-left: 1.6rem; position: relative; geometrylessons.github
let userAnswers = new Array(questions.length).fill(null); let quizSubmittedStatus = new Array(questions.length).fill(false); // each question individually shows feedback after answer html += ` <
<!-- Quadrilaterals & Polygons --> <div class="card"> <div class="card-header"> <h2>⬛ Polygons & Quadrilaterals</h2> <p>properties · area formulas</p> </div> <div class="card-content"> <div class="formula">Sum of interior angles = (n-2)·180°</div> <div class="formula">Each interior angle (regular n-gon) = (n-2)·180°/n</div> <ul class="fact-list"> <li>Parallelogram: opposite sides parallel & congruent</li> <li>Rectangle: all angles 90°, diagonals congruent</li> <li>Rhombus: all sides equal, diagonals ⟂ bisectors</li> <li>Square = rectangle + rhombus</li> <li>Trapezoid: exactly one pair of parallel sides</li> </ul> </div> </div> div class="question" id="question-$i">
.container max-width: 1300px; margin: 0 auto;
.quiz-score font-size: 1.2rem; font-weight: 700; background: #e2eaf1; padding: 0.4rem 1rem; border-radius: 60px;
