Add exercises to the learing area page (#480)

Add missing exercices from [MDN](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Math) so users can solve problems without going back to the MDN page each time. --------- Co-authored-by: Estelle Weyl <estelle@openwebdocs.org> Co-authored-by: Estelle Weyl <estelle@weyl.org>
mdn · Jan 25, 2024 · 31f92e5 · 31f92e5
1 parent 037af3e
commit 31f92e5
Showing 1 changed file with 16 additions and 0 deletions.
diff --git a/javascript/introduction-to-js-1/maths/editable_canvas.html b/javascript/introduction-to-js-1/maths/editable_canvas.html
@@ -48,6 +48,10 @@
         border: 1px solid #4D4E53;
         border-radius: 2px;
       }
+
+      li {
+          padding-bottom:0.5em;
+      }
     </style>
   </head>
   <body>
@@ -73,6 +77,18 @@ <h2>Editable code</h2>
     <div class="playable-buttons">
       <input id="reset" type="button" value="Reset" />
     </div>
+
+    <div>
+        <p>Let's try the following:</p>
+        <ol>
+            <li>Change the line that calculates x so the box is still 50px wide, but the 50 is calculated using the numbers 43 and 7 and an arithmetic operator.</li>
+            <li>Change the line that calculates y so the box is 75px high, but the 75 is calculated using the numbers 25 and 3 and an arithmetic operator.</li>
+            <li>Change the line that calculates x so the box is 250px wide, but the 250 is calculated using two numbers and the remainder (modulo) operator.</li>
+            <li>Change the line that calculates y so the box is 150px high, but the 150 is calculated using three numbers and the subtraction and division operators.</li>
+            <li>Change the line that calculates x so the box is 200px wide, but the 200 is calculated using the number 4 and an assignment operator.</li>
+            <li>Change the line that calculates y so the box is 200px high, but the 200 is calculated using the numbers 50 and 3, the multiplication operator, and the addition assignment operator.</li>
+        <ol>
+    </div>
   </body>
 
   <script>