.question p font-weight: 700; font-size: 1.1rem; margin-bottom: 0.8rem;
text: "Two angles that add up to 90° are called:", options: ["Supplementary", "Complementary", "Vertical", "Linear pair"], correct: 1 ,
];
function renderQuiz() const container = document.getElementById('quiz-container'); if (!container) return; geometrylessons.github
.quiz-section h2 font-size: 1.8rem; margin-bottom: 0.2rem; display: flex; align-items: center; gap: 0.5rem;
.hero .tagline font-size: 1.2rem; color: #2c6979; border-bottom: 2px solid #cbdde6; display: inline-block; padding-bottom: 0.4rem;
By combining the rigor of mathematics with the flexibility of open-source coding, it transforms a "tough" subject into a hands-on laboratory for discovery. | | construction | Interactive: user must drag
We follow the . Please read CODE_OF_CONDUCT.md before interacting with the community.
<!-- Triangles & Congruence --> <div class="card"> <div class="card-header"> <h2>🔺 Triangles & Congruence</h2> <p>SSS · SAS · ASA · AAS · HL</p> </div> <div class="card-content"> <div class="formula">∠A + ∠B + ∠C = 180°</div> <div class="formula">Pythagoras: a² + b² = c² (right triangle)</div> <ul class="fact-list"> <li><strong>SSS</strong> : all three sides equal → congruent</li> <li><strong>SAS</strong> : two sides & included angle</li> <li><strong>ASA / AAS</strong> : two angles & a side</li> <li>HL only for right triangles (hypotenuse-leg)</li> </ul> <div class="theorem"> 🧠 Triangle Inequality: sum of any two sides > third side </div> </div> </div>
"id": "triangle-congruence-1", "type": "multiple-choice", "question": "Which of the following statements guarantees triangle ABC ≅ triangle DEF?", "options": [ "AB = DE, BC = EF, AC = DF (SSS)", "∠A = ∠D and AB = DE (SAS)", "∠B = ∠E and ∠C = ∠F (AA)", "AB = DE and ∠B = ∠E (SSA)" ], "answerIndex": 0, "hints": [ "Recall the three congruence criteria that work for any triangle.", "Two sides and the included angle is sufficient." ], "explanation": "The SSS criterion (first option) ensures congruence because all three corresponding sides are equal." !-- Triangles & Congruence -->
| Type | Description | |------|-------------| | multiple-choice | Pick one correct option. | | multiple-select | Pick all that apply (partial credit possible). | | fill-in | Short text/number answer (regex validation). | | construction | Interactive: user must drag points to satisfy a condition (e.g., construct the perpendicular bisector). |
.hero h1 font-size: 2.8rem; background: linear-gradient(135deg, #1e4b6e, #2c7da0); background-clip: text; -webkit-background-clip: text; color: transparent; letter-spacing: -0.5px; margin-bottom: 0.5rem;