From 9a89a3db6ff20790f890d813e5ebf94f88285031 Mon Sep 17 00:00:00 2001
From: Edward Betts <edward@4angle.com>
Date: Fri, 3 Nov 2023 15:39:11 +0000
Subject: [PATCH] Use bootstrap grid instead of table

Looks better on mobile

Closes: #47
---
 templates/index.html | 27 +++++++++++++--------------
 1 file changed, 13 insertions(+), 14 deletions(-)

diff --git a/templates/index.html b/templates/index.html
index e3c8969..e458aaa 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -113,30 +113,29 @@
 
   <h3>Agenda</h3>
 
-  <table class="mt-2 table table-hover">
   {% for event in events %}
-  <tr>
-    <td class="text-end">
-      {{event.as_date.strftime("%a, %d, %b %Y")}}
-    </td>
-    <td class="text-end">
+  <div class="row border border-1 {% if event.name in class_map %} {{ class_map[event.name]}}{% endif %}">
+    <div class="col-md-3">
+      {{event.as_date.strftime("%a, %d, %b")}}
+      &nbsp;
+      &nbsp;
       {{event.display_time or ""}}
-    </td>
-    <td class="text-end">
+      &nbsp;
+      &nbsp;
       {{event.display_timezone or ""}}
-    </td>
+    </div>
 
-    <td class="text-start {% if event.name in class_map %} {{ class_map[event.name]}}{% endif %}">
+    <div class="col-md-8 text-start">
       {% if event.url %}<a href="{{ event.url }}">{% endif %}
     {{ event_labels.get(event.name) or event.name }}
     {%- if event.title -%}: {{ event.title }}{% endif %}
     {% if event.url %}</a>{% endif %}
-    </td>
-    <td class="text-end">
+    </div>
+    <div class="col-md-1">
     {{ event.delta_days(today) }}
-    </td>
+    </div>
+  </div>
   {% endfor %}
-  </table>
 
   <h3>Space launches</h3>
   {% for launch in rockets %}