Start work on styling

view/login.templ

@@ -5,25 +5,52 @@ import (
 )
 
 templ LoginFormError(currentUser *model.User, err string) {
-    <div class="login-form">
     if currentUser == nil {
-        <form hx-post="/login" hx-target-error="closest .login-form">
-            <p>
-                <input type="text" name="user" placeholder="User" />
-                <input type="password" name="password" placeholder="Password" />
-                <button type="submit">Sign in</button>
-                if err != "" {
-                    <span class="error">{ err }</span>
-                }
-            </p>
-        </form>
+        <div class="login-form">
+            <form
+                hx-post="/login"
+                hx-target-error="closest .login-form"
+                class="
+                    w-80
+                    mx-auto
+                    flex flex-col
+                    gap-4
+                "
+            >
+                    @TextField("user", "User name")
+                    @PasswordField("password", "Password")
+                    @Button("submit", "Sign in", templ.Attributes{})
+                    if err != "" {
+                        <span class="text-red-400">{ err }</span>
+                    }
+            </form>
+        </div>
     } else {
-        <p>Signed in as { currentUser.Name } <button type="button" hx-post="/logout" hx-refresh>Sign out</button></p>
+        <div class="
+                flex flex-row items-baseline justify-start
+             "
+        >
+            <h1
+                class="
+                    grow
+                    text-slate-300 text-4xl font-semibold
+                "
+            >Prout prout</h1>
+            <div
+                class="
+                    flex flex-row justify-end items-center gap-4
+                "
+            >
+                <p>Signed in as <b>{ currentUser.Name }</b></p>
+                @SecondaryButton("button", "Sign out", templ.Attributes{
+                    "hx-post": "/logout",
+                    "hx-refresh": true,
+                })
+            </div>
+        </div>
     }
-    </div>
 }
 
 templ LoginForm(currentUser *model.User) {
     @LoginFormError(currentUser, "")
 }
-