examples/calc/index.html

<!doctype html>

<head>
  <title>Calculator App</title>
</head>

<style>
  * { font-family: "Fira Code Retina", monospace; }
</style>

<body>
  <table border="1">
    <tr>
      <td colspan="3"><input type="text" id="result"/></td>
      <td><input type="button" id="bdel" value="X" style="background-color: red;"/></td>
    </tr>
    <tr>
      <td><input type="button" id="b1" value="1"/></td>
      <td><input type="button" id="b2" value="2"/></td>
      <td><input type="button" id="b3" value="3"/></td>
      <td><input type="button" id="bdiv" value="/" style="background-color: cyan;"/></td>
    </tr>
    <tr>
      <td><input type="button" id="b4" value="4"/></td>
      <td><input type="button" id="b5" value="5"/></td>
      <td><input type="button" id="b6" value="6"/></td>
      <td><input type="button" id="bsub" value="-" style="background-color: cyan;"/></td>
    </tr>
    <tr>
      <td><input type="button" id="b7" value="7"/></td>
      <td><input type="button" id="b8" value="8"/></td>
      <td><input type="button" id="b9" value="9"/></td>
      <td><input type="button" id="badd" value="+" style="background-color: cyan;"/></td>
    </tr>
    <tr>
      <td><input type="button" id="b0" value="0"/> </td>
      <td><input type="button" id="bdot" value="."/></td>
      <td><input type="button" id="bmul" value="*" style="background-color: cyan;"/></td>
      <td><input type="button" id="beq" value="=" style="background-color: green;"/></td>
    </tr>
  </table>

  <p id="msg"></p>
  <script src="main.js"></script>
</body>