[#907] Changed order of login components

with @thaissiqueira

4 files changed, 14 insertions, 12 deletions

diff --git a/web-ui/src/login/about/pixelated-welcome.scss b/web-ui/src/login/about/pixelated-welcome.scss
index 1e63f7c8..17d05f13 100644
--- a/web-ui/src/login/about/pixelated-welcome.scss
+++ b/web-ui/src/login/about/pixelated-welcome.scss
@@ -29,11 +29,10 @@
     font-weight: 300;
     flex-direction: column;
     align-self: flex-end;
-    float: right;
+    order: 2;
     width: 34%;
     margin-right: 8%;
-    margin-top: -7.8em;
-    padding: 0;
+    margin-top: -20.5em;
 
     h3 {
       font-weight: normal;
diff --git a/web-ui/src/login/app.scss b/web-ui/src/login/app.scss
index 6721a8ba..48add805 100644
--- a/web-ui/src/login/app.scss
+++ b/web-ui/src/login/app.scss
@@ -39,6 +39,7 @@
 
   .input-field-group {
     width: 100%;
+    margin: 0 0 1.5em 0;
   }
 
   .submit-button {
@@ -48,11 +49,11 @@
 
 .logo {
   width: 70%;
-  margin-bottom: 1em;
+  margin-bottom: 2em;
 }
 
 @media only screen and (min-width : 500px) {
-  #login_form .input-field-group {
+  #login_form {
     margin-top: 1em;
   }
 
@@ -85,6 +86,7 @@
 
   .logo {
     height: 6em;
+    margin-bottom: 1em;
     margin-top: 1.5em;
   }
 
@@ -92,8 +94,4 @@
     width: 34%;
     margin-left: 8%;
   }
-
-  #login_form {
-    margin-top: -11em;
-  }
 }
diff --git a/web-ui/src/login/error/auth-error.scss b/web-ui/src/login/error/auth-error.scss
index 9d57eb87..f6256be4 100644
--- a/web-ui/src/login/error/auth-error.scss
+++ b/web-ui/src/login/error/auth-error.scss
@@ -19,11 +19,11 @@
 
 .auth-error {
   color: $error;
-  margin: 0;
+  margin: -1em 0 1em 0;
 }
 
 @media only screen and (min-width : 960px) {
   .auth-error {
-    margin: -1em 0 0 0;
+    margin: -2em 0 1em 0;
   }
 }
diff --git a/web-ui/src/login/error/generic-error.scss b/web-ui/src/login/error/generic-error.scss
index b08651b4..5a077f32 100644
--- a/web-ui/src/login/error/generic-error.scss
+++ b/web-ui/src/login/error/generic-error.scss
@@ -41,10 +41,15 @@
   .generic-error {
     flex-direction: column;
     align-self: flex-end;
+    order: 2;
     width: 34%;
     margin-right: 8%;
-    margin-top: -9em;
+    margin-top: -19.5em;
     padding: 0;
+
+    h2 {
+      margin: 0;
+    }
   }
 
   .dead-mail {