about summary refs log tree commit diff
path: root/hosted/login.html
diff options
context:
space:
mode:
authormaride <maride@darknebu.la>2018-08-14 23:26:54 +0200
committermaride <maride@darknebu.la>2018-08-14 23:26:54 +0200
commit086635b9a4085c5ca097943e29ed740448b8fb78 (patch)
treed3e7784f60f3741b606ca05caa8ae134cf7d44df /hosted/login.html
parent612f9df18d322def591d0bd4142fa633cc3136fc (diff)
Bootstrap & Handlebars magic for a 21st-century-worthy UI
Diffstat (limited to 'hosted/login.html')
-rw-r--r--hosted/login.html42
1 files changed, 37 insertions, 5 deletions
diff --git a/hosted/login.html b/hosted/login.html
index 468b064..259278d 100644
--- a/hosted/login.html
+++ b/hosted/login.html
@@ -2,12 +2,44 @@
 <html>
     <head>
         <meta charset="utf-8">
+        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
+        <style type="text/css">
+            .vertical-center {
+                min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
+                min-height: 100vh; /* These two lines are counted as one :-)       */
+
+                display: flex;
+                align-items: center;
+            }
+        </style>
     </head>
     <body>
-        <form method="POST">
-            <input name="username">
-            <input name="accesscode" type="password">
-            <input type="submit">
-        </form>
+        <div class="container">
+            <div class="row">
+                <div class="col"></div>
+                <div class="col">
+                    <div class="vertical-center">
+                        <div class="card card-body">
+                            <h1>
+                                Companion
+                            </h1>
+
+                            <form method="POST">
+                                <div class="form-group">
+                                    <label for="nameInput">Name</label>
+                                    <input type="text" class="form-control" id="nameInput" placeholder="Name" name="username">
+                                </div>
+                                <div class="form-group">
+                                    <label for="accesscodeInput">Access Code</label>
+                                    <input type="password" class="form-control" id="accesscodeInput" placeholder="Access Code" name="accesscode">
+                                </div>
+                                <button type="submit" class="btn btn-primary">Login</button>
+                            </form>
+                        </div>
+                    </div>
+                </div>
+                <div class="col"></div>
+            </div>
+        </div>
     </body>
 </html>
\ No newline at end of file