added list (home) and details pages

templates/homepage.html

@@ -1,6 +1,49 @@
 {% extends "_layout.html" %}
+
 {% block content %}
-    <h1>Welcome to the Home Page</h1>
-    <p>This is a starter website built with Axum and Tera.</p>
-    <p>The time on the server is: <strong>{{ server_time }}</strong></p>
+<h2>Benchmark Reports</h2>
+<table>
+    <thead>
+        <tr>
+            <th>MT Score</th>
+            <th>Threads</th>
+            <th>RAM</th>
+            <th>OS</th>
+            <th>Hostname</th>
+            <th>Time</th>
+            <th>Note</th>
+        </tr>
+    </thead>
+    <tbody>
+        {% for report in reports %}
+        <tr class="clickable-row" onclick="window.location='/report/{{ report.id }}';">
+            <td data-label="MT Score" class="score-cell">
+                <a href="/report/{{ report.id }}">{{ report.score }}</a>
+            </td>
+            <td data-label="Threads">{{ report.cores }}</td>
+            <td data-label="RAM">{{ report.ram }}</td>
+            <td data-label="OS">{{ report.os | truncate(length=30) }}</td>
+            <td data-label="Hostname">{{ report.hostname }}</td>
+            <td data-label="Time">{{ report.time_ago }}</td>
+            <td data-label="Note" class="signature-cell">{{ report.signature }}</td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<style>
+.clickable-row {
+    cursor: pointer;
+    transition: background-color 0.2s;
+}
+
+.clickable-row:hover {
+    background-color: var(--hover-color);
+}
+
+.clickable-row a {
+    text-decoration: none;
+    color: inherit;
+}
+</style>
 {% endblock %}