Merge branch 'master' of github.com:twilco/twilco.github.io

twilco · twilco · commit 2f8de937f142 · 2022-04-18T10:52:22.000-05:00
diff --git a/assets/html/basic-dialog.html b/assets/html/basic-dialog.html
@@ -0,0 +1,17 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+</head>
+<body>
+
+<dialog id="dialog">
+  <p>Greetings, one and all!</p>
+  <form method="dialog">
+    <button>OK</button>
+  </form>
+</dialog>
+<button id="open" onclick="document.getElementById('dialog').showModal()">Open modal</button>
+
+</body>
+</html>
+
diff --git a/assets/html/customslider.js b/assets/html/customslider.js
@@ -258,7 +258,7 @@ aria.widget.slider.prototype.updateThumbPosition = function () {
 
     console.log(this.valueNow);
   this.thumb.setAttribute('aria-valuenow', this.valueNow);
-  this.thumb.setAttribute('aria-valuetext', `${this.valueNow} slices`);
+  this.thumb.setAttribute('aria-valuetext', `${this.valueNow} ${this.valueNow === 1 ? "slice" : "slices"}`);
 
   var pos = Math.round(
     (this.valueNow * this.sliderWidth) / (this.valueMax - this.valueMin)
diff --git a/assets/html/ssml.html b/assets/html/ssml.html
@@ -9,7 +9,9 @@
 <script>
 var a = `
 <speak>
-  What does the Spanish word <lang xml:lang="es-US">casa</lang> mean in English?
+  What does the Spanish word
+    <break time="1s"/><prosody rate="slow"><lang xml:lang="es-ES">casa</lang></prosody><break time="1s"/>
+  mean in English?
 </speak>
 `;
 
diff --git a/assets/html/test-assessment-with-slider.html b/assets/html/test-assessment-with-slider.html
@@ -1,20 +1,18 @@
 <!DOCTYPE HTML>
 <html>
 <head>
+<meta charset="UTF-8">
 <style>
     body {
         text-align: center;
         font-size: 24px;
     }
-
     #show-score-container {
         margin-top: 30px;
     }
-
     #show-score-container > button {
         font-size: 32px;
     }
-
     .first-answer-wrapper {
         margin-top: 15px;
     }
@@ -29,7 +27,6 @@
       margin-right: auto;
       width: 300px;
     }
-
     div.aria-widget-slider .rail {
       margin: 2px;
       padding: 1px;
@@ -38,27 +35,30 @@
       position: relative;
       top: 2em;
     }
-
     div.aria-widget-slider .thumb  {
       border: 1px solid #888;
       border-top-color:  #666;
       border-left-color: #666;
       background-color: #DDD;
       position: relative;
     }
-
     div.aria-widget-slider .value  {
       width:      2em;
       text-align: right;
       position: absolute;
     }
-
     div.focus .thumb  {
       border: 1px solid #444;
       background-color: #888;
       position: relative;
     }
-
+    .thumb::before {
+        content: "🍕";
+        font-size: 44px;
+        margin-left: -30px;
+        margin-top: -16px;
+        position: absolute;
+    }
     div.focus .rail {
       background-color: #CCC;
     }
@@ -71,6 +71,8 @@ <h1>Pop quiz</h1>
     <div>
         <h3>Question one</h3>
         How many slices are in 1/4 of a pizza with 8 total slices?
+        <br />
+        Grab the pizza slice and drag to select your answer!
 
         <div class="aria-widget-slider">
           <div class="value">0</div>
diff --git a/assets/html/test-assessment.html b/assets/html/test-assessment.html
