From 58d00af6c34215a6bdad81ebf8c9169391396ef3 Mon Sep 17 00:00:00 2001 From: Brock Whittaker Date: Mon, 1 May 2017 12:33:41 -0700 Subject: [PATCH] portico-pages: Fix flex height issues with content. This fixes the existing issue where the titles of content is chopped off when the screen height is too small. --- static/styles/landing-page.css | 2 +- static/styles/portico-signin.css | 27 ++-- static/styles/portico.css | 5 +- templates/zerver/accounts_home.html | 111 +++++++-------- templates/zerver/find_my_team.html | 97 ++++++------- templates/zerver/login.html | 203 ++++++++++++++-------------- templates/zerver/register.html | 2 +- templates/zerver/reset.html | 63 +++++---- 8 files changed, 264 insertions(+), 246 deletions(-) diff --git a/static/styles/landing-page.css b/static/styles/landing-page.css index 5d69390feb..4c9d260043 100644 --- a/static/styles/landing-page.css +++ b/static/styles/landing-page.css @@ -868,7 +868,7 @@ a:not(.no-style):hover:before { } .features-app .main { - margin: 0px auto 20px; + margin: 0px auto; width: calc(100% - 40px); } diff --git a/static/styles/portico-signin.css b/static/styles/portico-signin.css index 5c165752bf..e30967ec46 100644 --- a/static/styles/portico-signin.css +++ b/static/styles/portico-signin.css @@ -126,7 +126,6 @@ html { .forgot-password-container { width: 503px; - margin-top: calc(50vh - 150px); } .forgot-password-container form { @@ -348,7 +347,20 @@ html { color: #444; } -.new-style .input-box .text-error { +.new-style .input-box p.text-error { + display: block; + padding: 0px; + + color: #d26666; + font-size: 0.7em; + font-weight: 600; + height: 0; + + position: relative; + top: -4px; +} + +.new-style .input-box label.text-error { display: block; top: 66px; @@ -360,14 +372,9 @@ html { } .new-style .get-started { - height: 0px; - margin: 0px; - font-size: 2.5rem; text-align: center; color: #666; - - transform: translateY(-90px); } .new-style button { @@ -654,6 +661,8 @@ button.login-google-button { .split-view .left-side { width: 500px; border-right: 1px solid #eee; + position: relative; + left: -1px; } .split-view .left-side + .right-side { @@ -742,10 +751,6 @@ button.login-google-button { .split-view .right-side { width: 324px; } - - .new-style .get-started { - transform: translateY(-70px); - } } @media (max-width: 500px) { diff --git a/static/styles/portico.css b/static/styles/portico.css index 53ba3acb8d..c9a0949a25 100644 --- a/static/styles/portico.css +++ b/static/styles/portico.css @@ -276,8 +276,7 @@ img.screenshot { #registration #pw_strength { width: 325px; - height: 8px; - margin: -5px 0 0 0; + margin-top: 20px; } .def:before { @@ -1233,7 +1232,7 @@ input.new-organization-button { .markdown { max-width: 800px; - margin: 20px auto; + margin: 20px auto 0px auto; padding: 20px; font-weight: 400; diff --git a/templates/zerver/accounts_home.html b/templates/zerver/accounts_home.html index ff39947d5d..9949a7fe51 100644 --- a/templates/zerver/accounts_home.html +++ b/templates/zerver/accounts_home.html @@ -11,70 +11,71 @@ $(function () {
-
-
-
-
-

{{ _("Sign up for Zulip") }}

-
- {% if realm_name %} -
-
-
-
-
{{ realm_name }}
-
{{ realm_uri }}
+
+
+
+

{{ _("Sign up for Zulip") }}

+
+
+
+ {% if realm_name %} +
+
+
+
+
{{ realm_name }}
+
{{ realm_uri }}
+
+
+
+ {{ realm_description }}
-
- {{ realm_description }} -
-
- {% endif %} -
- {% if no_auth_enabled %} -
-

No authentication backends are enabled on this - server yet, so it is impossible to register!

+ {% endif %} +
+ {% if no_auth_enabled %} +
+

No authentication backends are enabled on this + server yet, so it is impossible to register!

-

See - the Zulip - authentication documentation to learn how to - configure authentication backends.

-
- {% else %} -
- {{ csrf_input }} - -
- - -
- +

See + the Zulip + authentication documentation to learn how to + configure authentication backends.

+ {% else %} + + {{ csrf_input }} - -
+
+ + +
+ +
-
- {% if form.email.errors %} - {% for error in form.email.errors %} -
{{ error }}
- {% endfor %} - {% endif %} + + - {% if google_auth_enabled %} -
or
+
+ {% if form.email.errors %} + {% for error in form.email.errors %} +
{{ error }}
+ {% endfor %} + {% endif %} -
- - - + {% if google_auth_enabled %} +
or
+ +
+ + + +
+ {% endif %} + {% endif %}
- {% endif %} - {% endif %} -
diff --git a/templates/zerver/find_my_team.html b/templates/zerver/find_my_team.html index ea4236ec36..4ae668d9a3 100644 --- a/templates/zerver/find_my_team.html +++ b/templates/zerver/find_my_team.html @@ -4,57 +4,62 @@
-
-

{{ _("Find your team") }}…

- {% if emails %} -
-

- Emails sent! You will only receive emails at addresses associated - with Zulip organizations. The addresses entered on the previous page - are listed below: -

+
+
+

{{ _("Find your team") }}…

+
-
    - {% for email in emails %} -
  • {{ email }}
    • - {% endfor %} -
+
+ {% if emails %} +
+

+ Emails sent! You will only receive emails at addresses associated + with Zulip organizations. The addresses entered on the previous page + are listed below: +

- {% if development_environment %} -
- {{ _("In the Zulip development environment, outgoing emails are printed to the run-dev.py console") }} +
    + {% for email in emails %} +
  • {{ email }}
    • + {% endfor %} +
+ + {% if development_environment %} +
+ {{ _("In the Zulip development environment, outgoing emails are printed to the run-dev.py console") }} +
+ {% endif %} + +
+ {% else %} +
+

+ We will send you an email with the sign-in information for + any Zulip organization(s) associated with the addresses you enter below. +

+
+ {{ csrf_input }} +
+
+ + +
+ +
+ +
+
{{ form.emails.help_text }}
+
+
+ {% if form.emails.errors %} + {% for error in form.emails.errors %} +
{{ error }}
+ {% endfor %} + {% endif %}
{% endif %} -
- {% else %} -
-

- We will send you an email with the sign-in information for - any Zulip organization(s) associated with the addresses you enter below. -

-
- {{ csrf_input }} -
-
- - -
- -
- -
-
{{ form.emails.help_text }}
-
-
- {% if form.emails.errors %} - {% for error in form.emails.errors %} -
{{ error }}
- {% endfor %} - {% endif %} -
- {% endif %}
{% endblock %} diff --git a/templates/zerver/login.html b/templates/zerver/login.html index a701aad0fc..c14d05193c 100644 --- a/templates/zerver/login.html +++ b/templates/zerver/login.html @@ -41,125 +41,128 @@ autofocus('#id_username');