From 8dd29f4e99453405e6ecdf34e91da5280f4d3f2e Mon Sep 17 00:00:00 2001
From: Priyansh Garg <priyanshgarg30@gmail.com>
Date: Sat, 29 Aug 2020 16:11:41 +0530
Subject: [PATCH] portico: Improve error messages display on registration page.

Improves the display of error messages on registration page fixing
mis-positioning of error messages and overlapping with other text
in some cases.

Part of: #15750.
---
 static/js/portico/signup.js               |  3 +++
 static/styles/portico/portico-signin.scss | 12 +++++-------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/static/js/portico/signup.js b/static/js/portico/signup.js
index 9af27c452e..65a89550b3 100644
--- a/static/js/portico/signup.js
+++ b/static/js/portico/signup.js
@@ -46,6 +46,9 @@ $(() => {
             element.next(".help-inline.alert.alert-error").remove();
             if (element.next().is('label[for="' + element.attr("id") + '"]')) {
                 error.insertAfter(element.next()).addClass("help-inline alert alert-error");
+            } else if (element.parent().is('label[for="' + element.attr("id") + '"]')) {
+                // For checkboxes and radio-buttons
+                error.insertAfter(element.parent()).addClass("help-inline alert alert-error");
             } else {
                 error.insertAfter(element).addClass("help-inline alert alert-error");
             }
diff --git a/static/styles/portico/portico-signin.scss b/static/styles/portico/portico-signin.scss
index b79e015a21..4db9f4e7fd 100644
--- a/static/styles/portico/portico-signin.scss
+++ b/static/styles/portico/portico-signin.scss
@@ -478,10 +478,9 @@ html {
             font-size: 0.7em;
             font-weight: 600;
             text-align: left;
-            height: 0;
+            line-height: 1.2;
 
             position: relative;
-            top: -4px;
             left: 1px;
         }
 
@@ -821,11 +820,6 @@ button#register_auth_button_gitlab {
         }
     }
 
-    #id_team_subdomain-error {
-        margin-top: 5px;
-        display: block;
-    }
-
     #subdomain_section {
         .inline-block {
             width: 100%;
@@ -855,6 +849,10 @@ button#register_auth_button_gitlab {
         line-height: 1.2;
     }
 
+    .help-inline {
+        display: block;
+    }
+
     legend {
         margin-bottom: 0;