From 419313b06ab21d60773fd95782c655ff79742f06 Mon Sep 17 00:00:00 2001 From: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> Date: Mon, 1 Feb 2021 18:01:15 +0000 Subject: [PATCH] Improve styling and wording of SSO error templates (#9287) --- changelog.d/9287.feature | 1 + synapse/res/templates/sso.css | 6 +- .../templates/sso_account_deactivated.html | 26 +++-- synapse/res/templates/sso_auth_bad_user.html | 27 +++-- synapse/res/templates/sso_error.html | 101 ++++++++++-------- 5 files changed, 101 insertions(+), 60 deletions(-) create mode 100644 changelog.d/9287.feature diff --git a/changelog.d/9287.feature b/changelog.d/9287.feature new file mode 100644 index 0000000000..c21b197ca1 --- /dev/null +++ b/changelog.d/9287.feature @@ -0,0 +1 @@ +Improve the user experience of setting up an account via single-sign on. diff --git a/synapse/res/templates/sso.css b/synapse/res/templates/sso.css index ff9dc94032..428ee917b3 100644 --- a/synapse/res/templates/sso.css +++ b/synapse/res/templates/sso.css @@ -20,6 +20,10 @@ h1 { font-size: 24px; } +.error_page h1 { + color: #FE2928; +} + h2 { font-size: 14px; } @@ -80,4 +84,4 @@ main { .profile .display-name, .profile .user-id { line-height: 18px; -} \ No newline at end of file +} diff --git a/synapse/res/templates/sso_account_deactivated.html b/synapse/res/templates/sso_account_deactivated.html index 4eb8db9fb4..50a0979c2f 100644 --- a/synapse/res/templates/sso_account_deactivated.html +++ b/synapse/res/templates/sso_account_deactivated.html @@ -1,10 +1,24 @@ - - - SSO account deactivated - - -

This account has been deactivated.

+ + + SSO account deactivated + + + + +
+

Your account has been deactivated

+

+ No account found +

+

+ Your account might have been deactivated by the server administrator. + You can either try to create a new account or contact the server’s + administrator. +

+
diff --git a/synapse/res/templates/sso_auth_bad_user.html b/synapse/res/templates/sso_auth_bad_user.html index 3611191bf9..a75c73a142 100644 --- a/synapse/res/templates/sso_auth_bad_user.html +++ b/synapse/res/templates/sso_auth_bad_user.html @@ -1,18 +1,25 @@ - - - Authentication Failed - - -
+ + + + + Authentication failed + + + + +
+

That doesn't look right

- We were unable to validate your {{server_name | e}} account via - single-sign-on (SSO), because the SSO Identity Provider returned - different details than when you logged in. + We were unable to validate your {{ server_name | e }} account + via single sign‑on (SSO), because the SSO Identity + Provider returned different details than when you logged in.

Try the operation again, and ensure that you use the same details on the Identity Provider as when you log into your account.

-
+ diff --git a/synapse/res/templates/sso_error.html b/synapse/res/templates/sso_error.html index 944bc9c9ca..69b93d65c1 100644 --- a/synapse/res/templates/sso_error.html +++ b/synapse/res/templates/sso_error.html @@ -1,53 +1,68 @@ - - - SSO error - - + + + Authentication failed + + + + {# If an error of unauthorised is returned it means we have actively rejected their login #} {% if error == "unauthorised" %} -

You are not allowed to log in here.

+
+

You are not allowed to log in here.

+
{% else %} -

- There was an error during authentication: -

-
{{ error_description | e }}
-

- If you are seeing this page after clicking a link sent to you via email, make - sure you only click the confirmation link once, and that you open the - validation link in the same client you're logging in from. -

-

- Try logging in again from your Matrix client and if the problem persists - please contact the server's administrator. -

-

Error: {{ error }}

+
+

There was an error

+

+ {{ error_description | e }} +

+

+ If you are seeing this page after clicking a link sent to you via email, + make sure you only click the confirmation link once, and that you open + the validation link in the same client you're logging in from. +

+

+ Try logging in again from your Matrix client and if the problem persists + please contact the server's administrator. +

+
+

Error code

+

{{ error | e }}

+
+
- + // We might end up with no error in the URL, so we need to check if we have one + // to print one. + let errorDesc = new URLSearchParams(searchStr).get("error_description") + if (errorDesc) { + document.getElementById("errormsg").innerText = errorDesc; + } + {% endif %}