tabular layout for status box

2020-10-28 21:46:31 -07:00
parent 59e0643902
commit 1fb5b37949
1 changed files with 14 additions and 4 deletions
--- a/static/main.html
+++ b/static/main.html
@@ -19,6 +19,11 @@
          padding: 15px;
      }

+      #status_box th {
+          text-align: left;
+          padding-right: 2em;
+      }
+
      .status {
          font-family: monospace;
          font-size: 250%;
@@ -36,10 +41,15 @@
  </head>
  <body>
    <section id="status_box">
-      Status:
-      <span id="status_line"></span>
-      <br><br>
-      Last Ring: <span id="last_ring" class="status"></span>
+      <table>
+        <tr>
+          <th>Status:</th>
+          <td id="status_line"></td>
+        </tr><tr>
+          <th>Last Ring:</th>
+          <td id="last_ring" class="status"></td>
+        </tr>
+      </table>
    </section>

    <audio id="chime" src="indoor.mp3"></audio>