feat: upcoming races layout

Author: rustpls

src/routes/races.rs

@@ -1,3 +1,4 @@
+use crate::filters;
 use crate::{
     domain::{
         race::{RaceSearchParams, RaceView},

templates/members/members.html

@@ -12,6 +12,7 @@
 			<div class="container">
 				<section class="card flex-col">
 					<h1>Search Members</h1>
+					{% if users.total > 0 %}
 					<form>
 						<div class="form-control">
 							<label for="user_search">Search</label>
@@ -28,9 +29,10 @@ <h1>Search Members</h1>
 							/>
 						</div>
 					</form>
+					{% endif %}
 					<div id="user_list" class="flex-col gap-2">
+						{% if users.items.len() > 0 %}
 						<div class="table-responsive">
-							{% if users.items.len() > 0 %}
 							<table>
 								<thead>
 									<tr>

templates/races/upcoming.html

@@ -12,17 +12,46 @@
 			<div class="container">
 				<section class="card flex-col">
 					<h1>Upcoming Races</h1>
-					{% if races.total > 0 %}
-					<ul>
-						{% for race in races.items %}
-						<li>
-							{{ race.name | title }} ({{ race.miles }} miles) - {{ race.start_date }}
-						</li>
-						{% endfor %}
-					</ul>
-					{% else %}
-					<p>No upcoming races found.</p>
-					{% endif %}
+					<div id="upcoming_race_list" class="flex-col gap-2">
+						{% if races.total > 0 %}
+						<div class="table-responsive">
+							<table>
+								<thead>
+									<tr>
+										<th>Date</th>
+										<th>Town</th>
+										<th>Name</th>
+										<th>Distance</th>
+										<th>Website</th>
+									</tr>
+								</thead>
+								<tbody>
+									{% for race in races.items %}
+									<tr>
+										<td class="nowrap">
+											{{ race.start_date | date }} at 10:00 AM
+										</td>
+										<td class="nowrap">{{ race.town }}</td>
+										<td class="nowrap">{{ race.name | title }}</td>
+										<td class="nowrap">{{ race.miles }} Miles</td>
+										<td>
+											{% if let Some(website) = race.race_url %}
+											<a target="_blank" href="{{ website }}">{{ website}}</a>
+											{% endif %}
+										</td>
+									</tr>
+									{% endfor %}
+								</tbody>
+							</table>
+						</div>
+						<div class="muted text-right text-sm">
+							{% if races.total == 1 %} {{ races.total }} upcoming races {% else %} {{
+							races.total }} upcoming races {% endif %}
+						</div>
+						{% else %}
+						<p>No upcoming races found.</p>
+						{% endif %}
+					</div>
 				</section>
 			</div>
 		</main>