From 8e4c79bbc72ab1999a402e418d92b84b1b375d02 Mon Sep 17 00:00:00 2001
From: Claas <claas@claas.dev>
Date: Fri, 21 Jun 2024 19:21:35 +0200
Subject: [PATCH] Style connection start

---
 src/routes/journey.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/routes/journey.tsx b/src/routes/journey.tsx
index 1727c7e..ac159f9 100644
--- a/src/routes/journey.tsx
+++ b/src/routes/journey.tsx
@@ -48,8 +48,18 @@ type Connection2 = {
 function Connection3(connection: Connection2): JSX.Element {
   return (
     <div class="flex w-screen flex-shrink-0 snap-center snap-always flex-col-reverse overflow-y-scroll *:flex-none">
-      <p>
-        {connection.time.change} {connection.start}
+      <p class="flex gap-2 pl-2">
+        <Show when={connection.time.change !== undefined}>
+          <time
+            datetime={connection.time.change}
+            class="content-center text-center text-label-lg text-light-on-surface-variant"
+          >
+            {connection.time.change}
+          </time>
+        </Show>
+        <span class="content-center py-2 text-title-md">
+          {connection.start}
+        </span>
       </p>
       <article
         data-connection
@@ -102,7 +112,6 @@ function Connection3(connection: Connection2): JSX.Element {
       </article>
       <Switch>
         <Match when={connection.changes !== undefined}>
-          {" "}
           <div
             data-row
             class="flex snap-x snap-mandatory grid-flow-col gap-4 overflow-x-auto overscroll-x-contain"
-- 
knotmirror 0.0.1