word/quiz: answer selection styling (hover)

[sheet.git] / word / quiz.plp

diff --git a/word/quiz.plp b/word/quiz.plp
index c40a7cd5724cc35379d0460335bcad458b253023..7fc375e8fcd5c81519ae1ae015c5586e7237904b 100644 (file)
--- a/word/quiz.plp
+++ b/word/quiz.plp
@@ -2,11 +2,25 @@
 
 Html({
        raw => <<'EOT',
+<script src="/word/put.min.js"></script>
 <script src="/word/quiz.js"></script>
 <style>
-.wrong {background: red}
-.good {background: green}
+img {
+       width: 90vw;
+       max-width: 64em;
+       margin: 2em 0 1ex;
+}
+li {
+       font-size: 20pt;
+       padding: .2ex;
+}
+li:hover {
+       cursor: pointer;
+       background: #8888;
+}
+li.wrong {background: #F008}
+li.good {background: #0F08}
 </style>
 EOT
 });
-say '<h1>quiz</h1><p id="quiz">test</p>';
+say '<h1 id=quiz>quiz</h1>';