templates/trip/list.html

@@ -8,7 +8,35 @@
 
  <link rel="stylesheet" href="{{ url_for("static", filename="leaflet/leaflet.css") }}">
 
+{% set conference_column_count = 8 %}
+{% set accommodation_column_count = 8 %}
+{% set travel_column_count = 10 %}
 <style>
+.conferences {
+  display: grid;
+  grid-template-columns: repeat({{ conference_column_count }}, auto); /* 7 columns for each piece of information */
+  gap: 10px;
+  justify-content: start;
+}
+
+.accommodation {
+  display: grid;
+  grid-template-columns: repeat({{ accommodation_column_count }}, auto);
+  gap: 10px;
+  justify-content: start;
+}
+
+.travel {
+  display: grid;
+  grid-template-columns: repeat({{ travel_column_count }}, auto);
+  gap: 10px;
+  justify-content: start;
+}
+
+.grid-item {
+  /* Additional styling for grid items can go here */
+}
+
         body, html {
             height: 100%;
             margin: 0;
@@ -44,6 +72,7 @@
                 overflow-y: auto;
             }
         }
+
 </style>
 {% endblock %}
 
@@ -87,35 +116,6 @@
           {% endfor %}
         {% endif %}
 
-        {{ conference_list(trip) }}
-
-        {% for day, elements in trip.elements_grouped_by_day() %}
-            <h4>{{ display_date_no_year(day) }}</h4>
-            {% set accommodation_label = {"check-in": "check-in from", "check-out": "check-out by"} %}
-            {% for e in elements %}
-              {% if e.element_type in accommodation_label %}
-                {% set c = get_country(e.detail.country) %}
-                <div>
-                  {{ e.get_emoji() }} {{ e.title }} {{ c.flag }}
-                  ({{ accommodation_label[e.element_type] }} {{ display_time(e.when) }})
-                </div>
-              {% else %}
-                <div>
-                  {{ e.get_emoji() }}
-                  {{ display_time(e.when) }}
-                  &ndash;
-                  {{ e.title }}
-                </div>
-            {% endif %}
-            {% endfor %}
-        {% endfor %}
-
-      </div>
-    {% endfor %}
-  {% endif %}
-{% endmacro %}
-
-{% macro conference_list(trip) %}
         {% for item in trip.conferences %}
           {% set country = get_country(item.country) if item.country else None %}
           <div class="card my-1">
@@ -149,7 +149,31 @@
           </div>
         {% endfor %}
 
+        {% set date_heading = None %}
+        {% for day, elements in trip.elements_grouped_by_day() %}
+            <h4>{{ display_date_no_year(day) }}</h4>
+            {% set accommodation_label = {"check-in": "check-in from", "check-out": "check-out by"} %}
+            {% for e in elements %}
+              {% if e.element_type in accommodation_label %}
+                {% set c = get_country(e.detail.country) %}
+                <div>
+                  {{ e.get_emoji() }} {{ e.title }} {{ c.flag }}
+                  ({{ accommodation_label[e.element_type] }} {{ display_time(e.when) }})
+                </div>
+              {% else %}
+                <div>
+                  {{ e.get_emoji() }}
+                  {{ display_time(e.when) }}
+                  &ndash;
+                  {{ e.title }}
+                </div>
+            {% endif %}
+            {% endfor %}
+        {% endfor %}
 
+      </div>
+    {% endfor %}
+  {% endif %}
 {% endmacro %}