Pretty up the login page to match everywhere else

This commit is contained in:
Danielle McLean 2017-10-09 20:30:50 +11:00
parent 400c9ca8b4
commit 3b58b57cc5
Signed by: 00dani
GPG key ID: 5A5D2D1AFF12EEC5
3 changed files with 19 additions and 7 deletions

View file

@ -215,6 +215,7 @@ instance YesodAuth App where
where loginForm :: Route App -> Widget where loginForm :: Route App -> Widget
loginForm action = do loginForm action = do
mtok <- reqToken <$> getRequest mtok <- reqToken <$> getRequest
setTitle "log in"
$(widgetFile "auth/login") $(widgetFile "auth/login")
authHttpManager = getHttpManager authHttpManager = getHttpManager

View file

@ -1,3 +1,14 @@
body > main body > main
display: flex display: flex
align-items: center align-items: center
justify-content: center
.form-control
background-color: #1d1f21
color: #c9cacc
&:focus
background-color: #404449
color: #c9cacc
.input-group-addon
background-color: #000
color: #fff
width: 2.4rem

View file

@ -5,20 +5,20 @@
<div .card.bg-dark> <div .card.bg-dark>
<div .card-body> <div .card-body>
<div .form-group> <div .form-group>
<label .sr-only for="auth-login-username">Username <label .sr-only for="auth-login-username">username
<div .input-group> <div .input-group>
<span .input-group-addon aria-hidden> <span .input-group-addon aria-hidden>
<i .fa.fa-user> <i .fa.fa-at>
<input #auth-login-username .form-control type="text" name="username" required> <input #auth-login-username .form-control type="text" name="username" placeholder="username" required>
<div .form-group> <div .form-group>
<label .sr-only for="auth-login-password">Password <label .sr-only for="auth-login-password">password
<div .input-group> <div .input-group>
<span .input-group-addon aria-hidden> <span .input-group-addon aria-hidden>
<i .fa.fa-key> <i .fa.fa-asterisk>
<input #auth-login-password .form-control type="password" name="password" required> <input #auth-login-password .form-control type="password" name="password" placeholder="password" required>
<div .card-footer> <div .card-footer>
<button type="submit" class="btn btn-primary"> <button type="submit" class="btn btn-primary">
<i .fa.fa-sign-in> <i .fa.fa-sign-in>
Log In log in