Improve login form layout

This commit is contained in:
Midgard 2020-03-31 11:30:35 +02:00
parent 1fcb86cf06
commit 77b1d465a3
Signed by: midgard
GPG key ID: 511C112F1331BBB4
2 changed files with 15 additions and 19 deletions

View file

@ -182,18 +182,20 @@ ul#server_selection_list {
display: none; display: none;
text-align: center; text-align: center;
} }
#login h2 {
margin-bottom: 0.3em;
}
#login:target { #login:target {
display: block; display: block;
} }
#login table { #login input {
margin: 0 auto 1em; width: 100%;
} }
#login table th { #login_server {
font-weight: normal; margin-bottom: 1em;
text-align: right;
} }
#login_server_row td, #login_server_row th { .login-form {
padding-bottom: 1em; margin-bottom: 0.5em;
} }
.post { .post {

View file

@ -27,18 +27,12 @@
<div id="login"> <div id="login">
<h2>Add a server</h2> <h2>Add a server</h2>
<table> <div class="login-form">
<tr id="login_server_row"> <input type="text" id="login_server" placeholder="Server URL" value="http://localhost:8080" required/>
<th>Server</th>
<td><input type="text" id="login_server" value="http://localhost:8080" required/></td> <input type="text" id="login_login_id" placeholder="Username or email" required/>
</tr><tr> <input type="password" id="login_password" placeholder="Password" required/>
<th>Email or username</th> </div>
<td><input type="text" id="login_login_id" required/></td>
</tr><tr>
<th>Password</th>
<td><input type="password" id="login_password" required/></td>
</tr>
</table>
<button id="login_button">Log in</button> <button id="login_button">Log in</button>
<a href="#"><button id="server_selection_add">Cancel</button></a> <a href="#"><button id="server_selection_add">Cancel</button></a>