Live page now looks better, just need to make form submit not reload the page.

pages/live/index.html

@@ -1,21 +1,26 @@
 <script>
-  let req = new GetJson("/api/stream/1");
-  let link_req = new GetJson("/api/stream/1/links");
 </script>
 <script src="https://player.twitch.tv/js/embed/v1.js"></script>
 
-<div x-init="Stream = await req.theData()" x-data="{Stream: {}}">
-  <div id="twitch-player" class="flex justify-center items-center w-full bg-gray-300 text-gray-950 text-center aspect-video">
+<div class="flex-col w-full"
+  x-init="Stream = await GetJson('/api/stream/1')" x-data="{Stream: {}}">
+
+  <div id="twitch-player" class="aspect-video">
   </div>
 
-  <div class="p-6 flex flex-col justify-center">
+  <h2>Links Found in Chat</h2>
+
+  <grid class="two-panel">
     <div>
-      <h2>Links Found in Chat</h2>
-      <ul x-init="links = await link_req.theData()" x-data="{links: {}}">
+      <table class="w-full" x-init="links = await GetJson('/api/stream/1/links')" x-data="{links: {}}">
+        <tr class="table-header"><th>URL</th><th>Description</th></tr>
         <template x-for="item in links">
-          <li><a x-text="item.description" x-bind:href="item.url"></a></li>
+          <tr class="table-row">
+            <td class="p-2"><a x-text="item.url" x-bind:href="item.url" target="_blank"></a></td>
+            <td class="p-2" x-text="item.description"></td>
+          </tr>
         </template>
-      </ul>
+      </table>
     </div>
 
     <form action="/api/link" method="POST">
@@ -31,7 +36,7 @@
         </bottom>
       </card>
     </form>
-  </div>
+  </bar>
 </div>
 
 <script>