Merge pull request #245 from CydarLtd/overlay_notifications

Make notifications appear on top instead of inline
This commit is contained in:
Clément Michaud 2018-07-26 22:29:34 +02:00 committed by GitHub
commit e2e1e08390
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 12 additions and 11 deletions

View File

@ -19,9 +19,10 @@ body {
/* notifications */ /* notifications */
.notification { .notification {
padding: 10px; padding: 10px;
margin: 10px 0px; margin: 15px 0px;
border-radius: 6px; border-radius: 6px;
display: none; display: none;
position: absolute;
} }
.notification img { .notification img {
width: 24px; width: 24px;
@ -63,4 +64,4 @@ body {
} }
h1 { h1 {
font-size: 25px; font-size: 25px;
} }

View File

@ -7,9 +7,9 @@ block form-header
h1 Sign in h1 Sign in
block content block content
div(class="notification")
img(class="header-img" src="/img/user.png" alt="user profile") img(class="header-img" src="/img/user.png" alt="user profile")
p Enter your credentials to sign in p Enter your credentials to sign in
div(class="notification")
form(class="form-signin") form(class="form-signin")
div(class="form-inputs") div(class="form-inputs")
input(type="text" class="form-control" id="username" placeholder="Username" required autofocus) input(type="text" class="form-control" id="username" placeholder="Username" required autofocus)

View File

@ -7,12 +7,12 @@ block form-header
h1 Reset password h1 Reset password
block content block content
div(class="notification")
img(class="header-img" src="/img/password.png" alt="password") img(class="header-img" src="/img/password.png" alt="password")
p Set your new password and confirm it. p Set your new password and confirm it.
div(class="notification")
form(class="form-signin") form(class="form-signin")
div(class="form-inputs") div(class="form-inputs")
input(class="form-control" type="password" name="password1" id="password1" placeholder="New password" required="required") input(class="form-control" type="password" name="password1" id="password1" placeholder="New password" required="required")
input(class="form-control" type="password" name="password2" id="password2" placeholder="Password confirmation" required="required") input(class="form-control" type="password" name="password2" id="password2" placeholder="Password confirmation" required="required")
button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
span(class="clearfix") span(class="clearfix")

View File

@ -7,12 +7,12 @@ block form-header
h1 Reset password h1 Reset password
block content block content
div(class="notification")
div div
img(class="header-img" src="/img/password.png" alt="password") img(class="header-img" src="/img/password.png" alt="password")
p After giving your username, you will receive an email to change your password. p After giving your username, you will receive an email to change your password.
div(class="notification")
form(class="form-signin") form(class="form-signin")
div(class="form-inputs") div(class="form-inputs")
input(type="text" class="form-control" name="username" id="username" placeholder="Your username" required="required") input(type="text" class="form-control" name="username" id="username" placeholder="Your username" required="required")
button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password button(id="reset-password-button" class="btn btn-lg btn-primary btn-block" type="submit") Reset Password
span(class="clearfix") span(class="clearfix")

View File

@ -7,16 +7,16 @@ block form-header
h1 Sign in h1 Sign in
block content block content
div div
div(class="notification notification-totp")
h3 Hi <b>#{username}</b> h3 Hi <b>#{username}</b>
div(class="row") div(class="row")
div(class="u2f-token") div(class="u2f-token")
img(src="/img/pendrive.png", alt="security key") img(src="/img/pendrive.png", alt="security key")
p p
| Please, touch your <a href="https://www.yubico.com/products/yubikey-hardware/fido-u2f-security-key/">security key</a><br/> | Please, touch your <a href="https://www.yubico.com/products/yubikey-hardware/fido-u2f-security-key/">security key</a><br/>
b Or<br/> b Or<br/>
| Get a one-time password | Get a one-time password
div(class="notification notification-totp")
form(class="form-signin totp") form(class="form-signin totp")
div(class="form-inputs") div(class="form-inputs")
input(type="text" autocomplete="off" class="form-control" id="token" placeholder="Token" required autofocus) input(type="text" autocomplete="off" class="form-control" id="token" placeholder="Token" required autofocus)
@ -28,4 +28,4 @@ block content
| | | |
a(href=totp_identity_start_endpoint, class="link register-totp") Google Authenticator a(href=totp_identity_start_endpoint, class="link register-totp") Google Authenticator
span(class="clearfix") span(class="clearfix")
script(src="/js/u2f-api.js", type="text/javascript") script(src="/js/u2f-api.js", type="text/javascript")