Update index.html

mealycpp · web-flow · commit 1c5034628062 · 2025-06-19T20:27:14.000-07:00
Signed-off-by: Mohamed El-Hadedy &lt;47838875+mealycpp@users.noreply.github.com&gt;
diff --git a/index.html b/index.html
@@ -1 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Ptah Nifty Assignment Quiz</title>
+  <style>
+    body { font-family: Arial, sans-serif; margin: 20px; background: #f9f9f9; }
+    h1, h2 { color: #00274c; }
+    h1 { font-size: 2.2em; text-align: center; }
+    .question { margin: 15px 0; padding: 15px; background: #fff; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
+    .question-title { font-weight: bold; }
+    .options { margin-left: 20px; }
+    .btn { padding: 10px 16px; background: #0055a4; color: #fff; border: none; border-radius: 4px; cursor: pointer; margin-top: 20px; }
+    .score { font-size: 1.2em; font-weight: bold; margin-top: 20px; }
+  </style>
+</head>
+<body>
+  <h1>Ptah: Nifty Assignment Quiz</h1>
+  <p>Answer all questions below and click Submit to see your score.</p>
+  <form id="quizForm">
+  </form>
+  <button class="btn" onclick="submitQuiz()">Submit All</button>
+  <div class="score" id="finalScore"></div>
+
+  <script>
+    const questions = [];
+    // Populate questions array same as index: PQC, LW, ORC, HW, MON (100 total)
+    // Example for first few:
+    questions.push({ title: 'Which PQC algorithm is standardized for digital signatures?', options: ['CRYSTALS-Kyber','CRYSTALS-Dilithium','ASCON'], answer: 'CRYSTALS-Dilithium', points: 2 });
+    // ... (add all 100 questions here) ...
+
+    const form = document.getElementById('quizForm');
+    questions.forEach((q, idx) => {
+      const div = document.createElement('div');
+      div.className = 'question';
+      const p = document.createElement('p'); p.className='question-title'; p.textContent = `${idx+1}. ${q.title}`;
+      div.appendChild(p);
+      const opts = document.createElement('div'); opts.className='options';
+      q.options.forEach(opt => {
+        const label = document.createElement('label');
+        const inp = document.createElement('input'); inp.type='radio'; inp.name=`q${idx}`; inp.value=opt;
+        label.appendChild(inp); label.appendChild(document.createTextNode(' '+opt));
+        opts.appendChild(label); opts.appendChild(document.createElement('br'));
+      });
+      div.appendChild(opts);
+      form.appendChild(div);
+    });
+
+    function submitQuiz() {
+      let score=0;
+      questions.forEach((q, idx) => {
+        const sel = document.querySelector(`input[name="q${idx}"]:checked`);
+        if (sel && sel.value===q.answer) score+=q.points;
+      });
+      document.getElementById('finalScore').textContent = `Your Score: ${score} / ${questions.length*2}`;
+    }
+  </script>
+</body>
+</html>
 
