use ul tags

Author: cmontella

v0.3/handbook/libraries/stdlib.md

@@ -814,11 +814,11 @@ The canvas library is an interface for drawing graphics in the browser using the
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>width</strong> - the width of the canvas in pixels</li>
         <li><strong>height</strong> - the height of the canvas in pixels</li>
         <li><strong>children</strong> - (optional) - paths are written as child records; while optional, without any children, the canvas will be blank</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// creates a canvas tagged #my-canvas that is 160 pixels wide by 90 pixel tall
 ```
@@ -838,7 +838,7 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>fillStyle</strong> - (optional) - sets the color, gradient, or pattern used to fill the drawing; if undefined, the default is black</li>
         <li><strong>strokeStyle</strong> - (optional) - sets the color, gradient, or pattern used for the strokes; if undefined, the path will default to a black fill style</li>
         <li><strong>lineWidth</strong> - (optional) - sets the width of strokes in pixels; if undefined, the default is 1px</li>
@@ -857,7 +857,7 @@ commit
           </ul>
         </li>
         <li><strong>children</strong> - (optional) - each individual operation in the path is written as a child record; while optional, without any children, the canvas will be blank</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// adds a #canvas/path to #my-canvas with a black stroke, a line width of 2 pixels and beveled corners
 ```
@@ -884,10 +884,10 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>x</strong> - the horizontal coordinate to move to, in pixels</li>
         <li><strong>y</strong> - the vertical coordinate to move to, in pixels</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// creates a 100x100 canvas and moves the path 20 pixels right and 15 pixels down from the top left corner of the canvas without drawing a line
 ```
@@ -909,10 +909,10 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>x</strong> - the horizontal coordinate to move to, in pixels</li>
         <li><strong>y</strong> - the vertical coordinate to move to, in pixels</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws a black line from the top left corner of a 100x100 canvas to the center
 ```
@@ -934,14 +934,14 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>cp1x</strong> - the x coordinate of the first control point</li>
         <li><strong>cp1y</strong> - the y coordinate of the first control point</li>
         <li><strong>cp2x</strong> - the x coordinate of the second control point</li>
         <li><strong>cp2y</strong> - the y coordinate of the second control point</li>
         <li><strong>x</strong> - the x coordinate of the end point</li>
         <li><strong>y</strong> - the y coordinate of the end point</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws a red Bézier curve starting at (20, 25) and ending at (40, 50)
 ```
@@ -964,12 +964,12 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>cpx</strong> - the x coordinate of the control point</li>
         <li><strong>cpy</strong> - the y coordinate of the control point</li>
         <li><strong>y</strong> - the x coordinate of the end point</li>
         <li><strong>y</strong> - the y coordinate of the end point</li>
-      </ui>
+      </ul>
     </td>
     <td><code></code>
     </td>
@@ -985,14 +985,14 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>y</strong> - the x coordinate of the center of the curve</li>
         <li><strong>y</strong> - the y coordinate of the center of the curve</li>
         <li><strong>radius</strong> - the radius of the curve in pixels</li>
         <li><strong>startAngle</strong> - the starting angle of the curve in radians</li>
         <li><strong>endAngle</strong> - the ending angle of the curve in radians</li>
         <li><strong>anticlockwise</strong> - (optional) - values can be true or false; true draws the arc counterclockwise, false draws the arc clockwise</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws an arc that circumscribes ¾ of a 40 pixel-wide circle in the middle of the canvas
 ```
@@ -1014,13 +1014,13 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>x1</strong> - the x coordinate of the starting point of the curve</li>
         <li><strong>y1</strong> - the y coordinate of the starting point of the curve</li>
         <li><strong>x2</strong> - the x coordinate of the ending point of the curve</li>
         <li><strong>y2</strong> - the y coordinate of the ending point of the curve</li>
         <li>radius - the radius of the curve in pixels</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws an arc that connects two perpendicular lines with a circular curve
 ```
@@ -1044,7 +1044,7 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>y</strong> - the x coordinate of the center of the curve</li>
         <li><strong>y</strong> - the y coordinate of the center of the curve</li>
         <li><strong>radiusX</strong> - the horizontal radius of the curve</li>
@@ -1053,7 +1053,7 @@ commit
         <li><strong>startAngle</strong> - the starting angle of the curve in radians</li>
         <li><strong>endAngle</strong> - the ending angle of the curve in radians</li>
         <li><strong>anticlockwise</strong> - (optional) - values can be true or false; true draws the arc counterclockwise, false draws the arc clockwise</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws a green oval in the center of the canvas that is 20 pixels wide and 30 pixels high
 ```
@@ -1075,12 +1075,12 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>y</strong> - the x coordinate of the upper left corner of the rectangle</li>
         <li><strong>y</strong> - the y coordinate of the upper left corner of the rectangle</li>
         <li><strong>width</strong> - the width of the rectangle in pixels</li>
         <li><strong>height</strong> - the height of the rectangle in pixels</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// draws a blue square with black borders in the middle of the canvas
 ```
@@ -1102,9 +1102,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li>No arguments</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// returns the path to (10, 10) from (20, 40) to create a triangle
 ```
@@ -1135,7 +1135,7 @@ The UI library provides a shorthand for adding standard HTML elements, as well a
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li>the <code>#ui</code> tag supports the following html elements:
           <ul>
             <li><code>#ui/row</code></li>
@@ -1162,7 +1162,7 @@ The UI library provides a shorthand for adding standard HTML elements, as well a
         <li><strong>#</strong> - (optional) - any other tags on the record will be applied to the element as classes</li>
         <li><strong>class</strong> - (optional) defines one or more classes for the element</li>
         <li>Other attributes - (optional) - other attribute-value pairs will be applied directly to the element for integration with existing JS libraries or debugging</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// commits a div in the browser with the text “Hello world!”
 ```
@@ -1212,7 +1212,7 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li> - (optional) - preset options for class are:
           <ul>
             <li>“inset” - an inset button style</li>
@@ -1225,7 +1225,7 @@ commit
         <li><strong>text</strong> - (optional) - defines text in the button</li>
         <li><strong>#</strong> - (optional) - any other tags on the record will be applied to the button as classes</li>
         <li>Other attributes - (optional) - other attribute-value pairs will be applied directly to the button for integration with existing JS libraries or debugging</li>
-      </ui>
+      </ul>
     </td>
     <td><code></code>
     </td>
@@ -1241,15 +1241,15 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>completion</strong> - the list of possible responses, given as a subrecord with the attribute “text” whose value is the list; requires the use of a pipe in the #ui record if matching against multiple search records for one autocomplete field</li>
         <li><strong>Note</strong>: Once an autocomplete option has been selected, #ui/autocomplete automatically gains a <strong>selected</strong> attribute whose value is the completion record; in the case of the example shown here, the <strong>selected</strong> attribute would be whichever <code>#state</code> record was chosen</li>
         <li><strong>placeholder</strong> - (optional) - the placeholder text for the input field</li>
         <li><strong>style</strong> - (optional) - specific CSS styles can be defined, but must be entered as a subrecord</li>
         <li><strong>#</strong> - (optional) - any other tags on the record will be applied to the autocomplete as classes</li>
         <li><strong>class</strong> - (optional) defines one or more classes for the autocomplete</li>
         <li>Other attributes - (optional) - other attribute-value pairs will be applied directly to the autocomplete for integration with existing JS libraries or debugging</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// creates an autocomplete form with the class “birth-state” and the placeholder “Which state were you born in?”, where the autocomplete options are the names of any #state records found
 ```
@@ -1277,9 +1277,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>autocomplete</strong> - the autocomplete element to clear</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// clears an autocomplete field if it loses focus
 ```
@@ -1303,9 +1303,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>autocomplete</strong> - the autocomplete being opened</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// changes the font color of the autocomplete input to red when the list is opened; the color will not revert once the menu is closed unless another block is specifically written to do so
 ```
@@ -1330,9 +1330,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>autocomplete</strong> - the autocomplete being closed</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// changes the font color of the autocomplete input to black when the list is closed; reverts the change in the example for #ui/event/open
 ```
@@ -1357,9 +1357,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>autocomplete</strong> - the autocomplete being closed</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// as a follow-up to the #ui/autocomplete example, this waits for the user to pick a birth state, then creates a new autocomplete tagged #birth-county to ask which county within that particular state the user was born in
 ```
@@ -1384,9 +1384,9 @@ commit
 
   <tr>
     <td>
-      <ui>
+      <ul>
         <li><strong>autocomplete</strong> - the autocomplete whose input field changed</li>
-      </ui>
+      </ul>
     </td>
     <td><code>// when an autocomplete asking what the magic word is changes to the correct answer, adds the tag #magic-word to the autocomplete
 ```