Noded/backend
3
0
Fork 0
Code Issues 19 Pull Requests Releases Wiki Activity

Task #17 - Redesign login selection.

Browse Source
This commit is contained in:
QiTao 2020-02-08 01:47:09 -06:00
parent b3f10bdaa8
commit 6fe2eddad8
1 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
app/views/login.pug
View File

@ -16,6 +16,7 @@ html
background-color:#343a40; background-color:#343a40;
} }
#intro { #intro {
margin-top: 10px;
color: #cccccc; color: #cccccc;
text-align: center; text-align: center;
} }
@ -27,17 +28,33 @@ html
} }
.login-container { .login-container {
display: grid; display: grid;
align-items: center; color: #cccccc;
border: 4px solid #ccc; border: solid 7px #cccccc;
padding: 0.01em 0.02em; align-self: center;
border-radius: .35rem; background: transparent;
-webkit-transition: all .5s ease;
transition: all .5s ease;
outline: none;
box-shadow: 20px 38px 34px -26px rgba(0, 0, 0, 0.2);
border-radius: 82px 65px 185px 1085px/72px 225px 58px 15px;
}
.btn-login {
color: #cccccc;
border: solid 7px #cccccc;
align-self: center;
background: transparent;
-webkit-transition: all .5s ease;
transition: all .5s ease;
outline: none;
box-shadow: 20px 38px 34px -26px rgba(0, 0, 0, 0.2);
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
} }
.login-container div a { .login-container div a {
width: 100%; width: 100%;
} }
.icons { .icons {
font-size: 1.6em; font-size: 1.8em;
padding: 1.1em 1.1em 1.1em 1.1em; padding: 1em 1em 1em 1em;
} }
body body
@ -49,22 +66,22 @@ html
.container#login .container#login
.login-container .login-container
div div
a.btn.btn-light.btn-lg(href="/auth/flitter/login") a.btn.btn-login.btn-light(href="/auth/flitter/login")
i.icons.fas.fa-sign-in-alt i.icons.fas.fa-sign-in-alt
span Local Login span Local Login
div div
a.btn.btn-light.btn-lg(href="/auth/github_oauth/login") a.btn.btn-login.btn-light(href="/auth/github_oauth/login")
i.icons.fab.fa-github i.icons.fab.fa-github
span Login with GitHub span Login with GitHub
div div
a.btn.btn-light.btn-lg.disabled(href="google.com") a.btn.btn-login.btn-light.disabled(href="google.com")
i.icons.fab.fa-google i.icons.fab.fa-google
span Login with Google span Login with Google
div div
a.btn.btn-light.btn-lg.disabled(href="microsoft.com") a.btn.btn-login.btn-light.disabled(href="microsoft.com")
i.icons.fab.fa-microsoft i.icons.fab.fa-microsoft
span Login with Microsoft span Login with Microsoft
div div
a.btn.btn-light.btn-lg.disabled(href="microsoft.com") a.btn.btn-login.btn-light.disabled(href="apple.com")
i.icons.fab.fa-apple i.icons.fab.fa-apple
span Login with Apple span Login with Apple