Fix login UI

This commit is contained in:
Juan de la Cruz 2020-05-27 17:06:39 +02:00
parent 117744f3f7
commit b7f6c72981
6 changed files with 33 additions and 7 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 191 KiB

View file

@ -19,6 +19,7 @@ $color-complete : #a599c6;
$color-warning: #FC8802; $color-warning: #FC8802;
$color-danger: #E65244; $color-danger: #E65244;
$color-info: #59b9e2; $color-info: #59b9e2;
$color-ocean: #4285f4;
// Gray scale // Gray scale
$color-gray-10: #E3E3E3; $color-gray-10: #E3E3E3;

View file

@ -135,6 +135,16 @@
} }
} }
.btn-ocean {
@extend %btn;
background: $color-ocean;
color: $color-white;
&:hover {
background: darken($color-ocean, 16%);
color: $color-white;
}
}
.btn-option { .btn-option {
display: flex; display: flex;
a { a {

View file

@ -23,6 +23,8 @@
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
background-color:#2C233E; background-color:#2C233E;
background-image: url("/images/penpot-login.jpg");
background-size: cover;
.tagline { .tagline {
text-align: center; text-align: center;
@ -35,7 +37,7 @@
.logo { .logo {
svg { svg {
fill: white; fill: white;
width: 280px; width: 200px;
height: 80px; height: 80px;
} }
} }
@ -51,6 +53,10 @@
.form-container { .form-container {
width: 368px; width: 368px;
.btn-ocean {
margin-top: $x-big;
}
} }
.btn-google-auth { .btn-google-auth {

View file

@ -82,7 +82,15 @@ textarea {
} }
.links { .links {
display: flex;
font-size: $fs11; font-size: $fs11;
justify-content: space-between;
margin-bottom: $medium;
&.demo {
justify-content: center;
margin-top: $big;
}
} }
.link-entry { .link-entry {

View file

@ -90,11 +90,6 @@
[:& login-form {:locale locale}] [:& login-form {:locale locale}]
(when cfg/google-client-id
[:a.btn-secondary.btn-large.btn-google-auth
{:on-click login-with-google}
"Login with google"])
[:div.links [:div.links
[:div.link-entry [:div.link-entry
[:a {:on-click #(st/emit! (rt/nav :auth-recovery-request)) [:a {:on-click #(st/emit! (rt/nav :auth-recovery-request))
@ -105,8 +100,14 @@
[:span (t locale "auth.register-label") " "] [:span (t locale "auth.register-label") " "]
[:a {:on-click #(st/emit! (rt/nav :auth-register)) [:a {:on-click #(st/emit! (rt/nav :auth-register))
:tab-index "6"} :tab-index "6"}
(t locale "auth.register")]] (t locale "auth.register")]]]
(when cfg/google-client-id
[:a.btn-ocean.btn-large.btn-google-auth
{:on-click login-with-google}
"Login with Google"])
[:div.links.demo
[:div.link-entry [:div.link-entry
[:span (t locale "auth.create-demo-profile-label") " "] [:span (t locale "auth.create-demo-profile-label") " "]
[:a {:on-click #(st/emit! da/create-demo-profile) [:a {:on-click #(st/emit! da/create-demo-profile)