From fd1ec98c2815e4c8b8f1c416db754fbc222dd846 Mon Sep 17 00:00:00 2001
From: Aaron Raimist <aaron@raim.ist>
Date: Mon, 10 Jan 2022 12:39:55 +0000
Subject: [PATCH 1/3] Truncate long server names on login/register screen

Signed-off-by: Aaron Raimist <aaron@raim.ist>
---
 res/css/views/elements/_ServerPicker.scss      | 2 ++
 src/components/views/elements/ServerPicker.tsx | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/res/css/views/elements/_ServerPicker.scss b/res/css/views/elements/_ServerPicker.scss
index b871c2cdf3a..850a1625965 100644
--- a/res/css/views/elements/_ServerPicker.scss
+++ b/res/css/views/elements/_ServerPicker.scss
@@ -62,6 +62,8 @@ limitations under the License.
         color: $authpage-primary-color;
         grid-column: 1;
         grid-row: 2;
+        overflow: hidden;
+        text-overflow: ellipsis;
     }
 
     .mx_ServerPicker_change {
diff --git a/src/components/views/elements/ServerPicker.tsx b/src/components/views/elements/ServerPicker.tsx
index 51b18ac6c2b..461204aa5fc 100644
--- a/src/components/views/elements/ServerPicker.tsx
+++ b/src/components/views/elements/ServerPicker.tsx
@@ -86,7 +86,7 @@ const ServerPicker = ({ title, dialogTitle, serverConfig, onServerConfigChange }
     return <div className="mx_ServerPicker">
         <h3>{ title || _t("Homeserver") }</h3>
         { !disableCustomUrls ? <AccessibleButton className="mx_ServerPicker_help" onClick={onHelpClick} /> : null }
-        <span className="mx_ServerPicker_server">{ serverName }</span>
+        <span className="mx_ServerPicker_server" title={serverName}>{ serverName }</span>
         { editBtn }
         { desc }
     </div>;

From f3d0e3cb15a68a43440f511c5ed33adf7bf808b6 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 2 Feb 2022 09:56:41 +0000
Subject: [PATCH 2/3] Add spacing on server picker for when it overflows

---
 res/css/views/elements/_ServerPicker.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/res/css/views/elements/_ServerPicker.scss b/res/css/views/elements/_ServerPicker.scss
index 850a1625965..e5a979d0af3 100644
--- a/res/css/views/elements/_ServerPicker.scss
+++ b/res/css/views/elements/_ServerPicker.scss
@@ -64,6 +64,7 @@ limitations under the License.
         grid-row: 2;
         overflow: hidden;
         text-overflow: ellipsis;
+        margin-right: 8px;
     }
 
     .mx_ServerPicker_change {

From 875f31ea86605ceffbee47181ab9213e48addb27 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 2 Feb 2022 10:02:02 +0000
Subject: [PATCH 3/3] Fix edge case for hsNameIsDifferent tooltip

---
 src/components/views/elements/ServerPicker.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/views/elements/ServerPicker.tsx b/src/components/views/elements/ServerPicker.tsx
index 461204aa5fc..8921dfe19b0 100644
--- a/src/components/views/elements/ServerPicker.tsx
+++ b/src/components/views/elements/ServerPicker.tsx
@@ -86,7 +86,9 @@ const ServerPicker = ({ title, dialogTitle, serverConfig, onServerConfigChange }
     return <div className="mx_ServerPicker">
         <h3>{ title || _t("Homeserver") }</h3>
         { !disableCustomUrls ? <AccessibleButton className="mx_ServerPicker_help" onClick={onHelpClick} /> : null }
-        <span className="mx_ServerPicker_server" title={serverName}>{ serverName }</span>
+        <span className="mx_ServerPicker_server" title={typeof serverName === "string" ? serverName : undefined}>
+            { serverName }
+        </span>
         { editBtn }
         { desc }
     </div>;