1<!DOCTYPE html>
2<html lang="en-GB">
3 <head>
4 <title>Log in | umu</title>
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <meta name="title" content="Log in | umu">
7 <meta name="description" content="Log in | umu">
8 <style>
9 html {
10 background: #1C1C1C;
11 color: #DCDCDC;
12 font-family: sans-serif;
13 text-align: center;
14 height: 100%;
15 margin: 0 auto;
16 }
17 html * {
18 font-size: 16px;
19 }
20 body {
21 min-height: 100%;
22 padding: 0;
23 margin: 0 auto;
24 display: flex;
25 flex-direction: column;
26 max-width: 580px;
27 }
28 .title {
29 font-size: 50px;
30 }
31 form {
32 margin: 0 auto;
33 width: min(350px, calc(70% + 100px));
34 text-align: left;
35 display: flex;
36 justify-content: center;
37 flex-direction: column;
38 }
39 form > * {
40 margin-bottom: 0.3em;
41 }
42 label {
43 flex: 0 0 auto;
44 }
45 input {
46 font-family: inherit;
47 }
48 .input {
49 width: 100%;
50 display: flex;
51 justify-content: space-between;
52 }
53 .button {
54 background: #1C1C1C;
55 color: #DCDCDC;
56 border: solid 2px #DCDCDC;
57 border-radius: 5px;
58 padding: 7px;
59 margin: 8px;
60 text-decoration: none;
61 transition-duration: 0.2s;
62 cursor: pointer;
63 }
64 .button:hover {
65 background: #DCDCDC;
66 color: #1C1C1C;
67 border-color: #DCDCDC;
68 }
69 </style>
70 </head>
71 <body>
72 <p class="title">umu</p>
73 <form>
74 <div class="input"
75 <label for="access_token">Access token:</label>
76 <input type="password" id="access_token" name="access_token">
77 </div>
78 <input class="button" type="submit" value="Log in">
79 </form>
80 </body>
81</html>