Przeglądaj źródła

Update login page

Billy Barrow 1 miesiąc temu
rodzic
commit
9c9273efc2
2 zmienionych plików z 13 dodań i 4 usunięć
  1. 3 1
      src/pages/app.css
  2. 10 3
      src/pages/login.html

+ 3 - 1
src/pages/app.css

@@ -141,7 +141,7 @@ header nav { display: flex; align-items: center; flex-wrap: wrap; gap: var(--gri
     background: radial-gradient(circle at 50% 0%, #ddf4ff66, transparent 70%);
     display: flex;
     justify-content: center;
-    min-height: 60vh;
+    min-height: 100vh;
     padding: var(--grid-4) 0;
 }
 
@@ -160,6 +160,8 @@ header nav { display: flex; align-items: center; flex-wrap: wrap; gap: var(--gri
 
 .login-card .login-emblem { height: 6rem; width: auto; }
 
+.login-card h1 { font-size: 1.5rem; margin: var(--grid-1) 0 0; }
+
 .login-card form { text-align: left; }
 
 .login-card button[type="submit"] { width: 100%; }

+ 10 - 3
src/pages/login.html

@@ -1,8 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <pstm-uri>/login</pstm-uri>
-    <pstm-template>main</pstm-template>
+    <pstm-title>ClankerSaddle — Log in</pstm-title>
+    <script pstm-res-src="statum.js"></script>
+    <link rel="stylesheet" pstm-res-href="app.css">
+    <link rel="icon" type="image/png" pstm-res-href="clanker-saddle.png">
+    <link rel="apple-touch-icon" type="image/png" pstm-res-href="clanker-saddle.png">
+    <script pstm-res-src="app.js"></script>
     <script>
         // Surface error notifications inline instead of as toasts so a
         // failed login is shown next to the form; other kinds toast.
@@ -23,9 +30,9 @@
     <section class="login">
         <div class="login-card">
             <img class="login-emblem" alt="" pstm-res-src="clanker-saddle-emblem.png">
-            <h2>Log in</h2>
+            <h1>ClankerSaddle</h1>
             <p class="muted">The agent works while you sleep.</p>
-            <p stm-if="auth != null">Already signed in as <strong stm-text="auth.display_name">user</strong>.</p>
+            <p stm-if="auth != null">Welcome <strong stm-text="auth.display_name">user</strong>!</p>
             <form stm-if="auth == null" stm-action="page.login">
                 <div class="form-row"><label for="login-username">Username</label>
                     <input id="login-username" type="text" name="username" required autocomplete="username" autofocus></div>