Login: Added forgot password btn and fixed create account button

2 files changed, 37 insertions, 28 deletions

diff --git a/res/client/css/partials/login.scss b/res/client/css/partials/login.scss
index 2f5b4254..55d75cd4 100644
--- a/res/client/css/partials/login.scss
+++ b/res/client/css/partials/login.scss
@@ -61,7 +61,7 @@
 }
 
 .login-form {
-  width: 70%;
+  width: 80%;
   margin-left: auto;
   margin-right: auto;
 }
@@ -163,27 +163,33 @@
 }
 
 .login-form_button {
-    cursor: pointer;
-    background-color: $magenta;
-    color: $white;
-    font-size: $h3-size;
-    margin-top: $two-baselines;
-    padding: $one-baseline;
-    width: 100%;
+  cursor: pointer;
+  background-color: $magenta;
+  color: $white;
+  font-size: $h3-size;
+  margin-top: $two-baselines;
+  padding: $one-baseline;
+  width: 100%;
+
+  &:hover {
+    background-color: $dark-magenta;
+  }
 
-    &:hover {
-      background-color: $dark-magenta;
-    }
+  &:focus {
+    background-color: $dark-magenta; 
+  }
 }
 
-.create-account-button {
-  color: $mid-grey;
-  background: none;
-  margin: $one-baseline auto $one-baseline auto;
-  width: 70%;
-  
+#login-page_forgot-password-button {
+  margin-top: $one-baseline;
+}
+
+#login-page_create-account-button {
+  color: $light-grey;
+  background-color: $mid-grey;
+  padding: $one-baseline 0;
+
   &:hover {
-      color: $dark-grey;
-      background: none;
+      background-color: $dark-grey;
   }
 }
diff --git a/res/client/css/style.css b/res/client/css/style.css
index ae58ef0e..12466a9b 100644
--- a/res/client/css/style.css
+++ b/res/client/css/style.css
@@ -185,7 +185,7 @@ table {
     clear: both; }
 
 .login-form {
-  width: 70%;
+  width: 80%;
   margin-left: auto;
   margin-right: auto; }
 
@@ -272,15 +272,18 @@ table {
   width: 100%; }
   .login-form_button:hover {
     background-color: #d10a40; }
+  .login-form_button:focus {
+    background-color: #d10a40; }
 
-.create-account-button {
-  color: #919095;
-  background: none;
-  margin: 12px auto 12px auto;
-  width: 70%; }
-  .create-account-button:hover {
-    color: #363636;
-    background: none; }
+#login-page_forgot-password-button {
+  margin-top: 12px; }
+
+#login-page_create-account-button {
+  color: #f5f5fa;
+  background-color: #919095;
+  padding: 12px 0; }
+  #login-page_create-account-button:hover {
+    background-color: #363636; }
 
 .btn-regular {
   cursor: pointer;