From f8508ad87627fbe0ed5252eff5e73e540c815e98 Mon Sep 17 00:00:00 2001
From: FreneticScribbler <aj@aronajones.com>
Date: Sun, 17 Dec 2023 12:43:29 +0000
Subject: [PATCH] Updates to all three layouts

---
 PyRIGS/settings.py                       |  2 +
 RIGS/templates/partials/event_table.html | 61 +++++++++++++++---------
 2 files changed, 41 insertions(+), 22 deletions(-)

diff --git a/PyRIGS/settings.py b/PyRIGS/settings.py
index 54a3d228..20d1ac1f 100644
--- a/PyRIGS/settings.py
+++ b/PyRIGS/settings.py
@@ -35,6 +35,8 @@ if DEBUG:
     ALLOWED_HOSTS.append('localhost')
     ALLOWED_HOSTS.append('example.com')
     ALLOWED_HOSTS.append('127.0.0.1')
+    ALLOWED_HOSTS.append('.app.github.dev')
+    CSRF_TRUSTED_ORIGINS = ALLOWED_HOSTS
 
 SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO', 'https')
 if not DEBUG:
diff --git a/RIGS/templates/partials/event_table.html b/RIGS/templates/partials/event_table.html
index 76b50d61..ab7c941a 100644
--- a/RIGS/templates/partials/event_table.html
+++ b/RIGS/templates/partials/event_table.html
@@ -3,7 +3,7 @@
 <style>
 #event_table {
     display: grid;
-    grid-template-columns: 0.5fr 1fr 4fr 1fr;
+    grid-template-columns: max-content auto;
     column-gap: 1em;
 }
 .eventgrid {
@@ -47,7 +47,7 @@
 }
 @media (max-width: 900px) {
   #event_table {
-    grid-template-columns: 0.5fr 1fr;
+    grid-template-columns: max-content;
     column-gap: 0.5em;
   }
   .eventgrid {
@@ -65,6 +65,20 @@
   #event_mic {
     grid-column: 2;
   }
+  #event_status {
+    grid-column: span 2;
+  }
+  .grid-header {
+    display: none;
+  }
+}
+dt {
+  float: left;
+  clear: left;
+  margin-right: 10px;
+}
+dd {
+  margin-left: 0px;
 }
 </style>
 <div id="event_table">
@@ -91,43 +105,46 @@
     table-warning
     {% endif %}" {% if event.cancelled %}style="opacity: 50% !important;"{% endif %} id="event_row">
     <!---Number-->
-    <div class="font-weight-bold d-none d-sm-block" id="event_number">{{ event.display_id }}</div>
+    <div class="font-weight-bold d-none d-lg-block" id="event_number">{{ event.display_id }}</div>
     <!--Dates & Times-->
-    <div id="event_dates" style="text-align: justify;">
-        {% if not event.cancelled %}
+    <div id="event_dates" style="min-width: 180px;">
+        <dl>
+          {% if not event.cancelled %}
             {% if event.meet_at %}
-                <span class="text-nowrap">Meet: <strong>{{ event.meet_at|date:"D d/m/Y H:i" }}</strong></span>
+            <dt class="font-weight-normal">Meet:</dt>
+            <dd class="text-nowrap font-weight-bold text-lg-right">{{ event.meet_at|date:"D d/m/Y H:i" }}</dd>
             {% endif %}
             {% if event.access_at %}
-                <br><span class="text-nowrap">Access: <strong>{{ event.access_at|date:"D d/m/Y H:i" }}</strong></span>
+            <dt class="font-weight-normal">Access:</dt>
+            <dd class="text-nowrap font-weight-bold text-lg-right">{{ event.access_at|date:"D d/m/Y H:i" }}</dd>
             {% endif %}
-        {% endif %}
-        <span class="text-nowrap">
-            Start: <strong>{{ event.start_date|date:"D d/m/Y" }}
+          {% endif %}
+          <dt class="font-weight-normal">Start:</dt>
+          <dd class="text-nowrap font-weight-bold text-lg-right">{{ event.start_date|date:"D d/m/Y" }}
             {% if event.has_start_time %}
-            {{ event.start_time|date:"H:i" }}
-            {% endif %}</strong>
-        </span>
-        {% if event.end_date %}
-        <br>
-        <span class="text-nowrap">
-            End: {% if event.end_date != event.start_date %}<strong>{{ event.end_date|date:"D d/m/Y"  }}{% endif %}
+              {{ event.start_time|date:"H:i" }}
+            {% endif %}
+          </dd>
+          {% if event.end_date %}
+          <dt class="font-weight-normal">End:</dt>
+          <dd class="text-nowrap font-weight-bold text-lg-right">{{ event.end_date|date:"D d/m/Y" }}
             {% if event.has_end_time %}
             {{ event.end_time|date:"H:i" }}
-            {% endif %}</strong>
-        </span>
-        {% endif %}
+            {% endif %}
+          </dd>
+          {% endif %}
+        </dl>
     </div>
     <!---Details-->
     <div id="event_details" class="w-100">
         <h4>
             <a href="{% url 'event_detail' event.pk %}">
-                <span class="d-inline d-sm-none">{{ event }}</span><span class="d-none d-sm-inline">{{ event.name }}</span>
+                <span class="d-inline d-lg-none">{{ event }}</span><span class="d-none d-lg-inline">{{ event.name }}</span>
             </a>
             {% if event.dry_hire %}
             <span class="badge badge-secondary">Dry Hire</span>
             {% endif %}
-            <br>
+            <br class="d-none d-lg-inline">
             {% if event.venue %}
             <small>at {{ event.venue|namewithnotes:'venue_detail' }}</small>
             {% endif %}