portico: Add hint text for invite only realm on /login.

Fixes: #10542

This will make obvious for users what to do when they are not able to login.

Test added by hackerkid.

static/styles/portico/portico-signin.scss

@@ -506,6 +506,12 @@ html {
     .inline-block {
         text-align: left;
     }
+
+    .contact-admin p.invite-hint {
+        font-size: 1.3rem;
+        margin-top: 0.8rem;
+        text-align: center;
+    }
 }
 
 #login_form {

templates/zerver/login.html

@@ -131,6 +131,12 @@ page can be easily identified in it's respective JavaScript file. -->
                 {% endif %}
             </div>
         </div>
+
+        {% if realm_invite_required %}
+        <div class="contact-admin">
+            <p class="invite-hint">{{ _("Don't have an account yet? You need to be invited to join this organization.") }}</p>
+        </div>
+        {% endif %}
     </div>
 </div>
 

zerver/tests/test_signup.py

@@ -3956,6 +3956,16 @@ class TestLoginPage(ZulipTestCase):
             result = self.client_get("/en/login/")
             self.assertEqual(result.status_code, 200)
 
+    def test_login_page_registration_hint(self) -> None:
+        response = self.client_get("/login/")
+        self.assert_not_in_success_response(["Don't have an account yet? You need to be invited to join this organization."], response)
+
+        realm = get_realm("zulip")
+        realm.invite_required = True
+        realm.save(update_fields=["invite_required"])
+        response = self.client_get("/login/")
+        self.assert_in_success_response(["Don't have an account yet? You need to be invited to join this organization."], response)
+
 class TestFindMyTeam(ZulipTestCase):
     def test_template(self) -> None:
         result = self.client_get('/accounts/find/')