src/js/login.js

@@ -54,12 +54,12 @@ class Homeserver extends ElemJS {
 	constructor() {
 		super(q("#homeserver"));
 
-		this.tippy = tippy.default(q(".homeserver-question"), {
+		this.tippy = tippy.default(q("#homeserver-question"), {
 			content: q("#homeserver-popup-template").innerHTML,
 			allowHTML: true,
 			interactive: true,
 			interactiveBorder: 10,
-			trigger: "focus mouseenter",
+			trigger: "mouseenter",
 			theme: "carbon",
 			arrow: tippy.roundArrow,
 		})

src/login.pug

@@ -24,7 +24,7 @@ html
             .form-input-container
               .homeserver-label
                 label(for="homeserver") Homeserver
-                span.homeserver-question(tabindex=0) (What's this?)
+                span#homeserver-question (What's this?)
               input(type="text" name="homeserver" placeholder="matrix.org")#homeserver
 
           #feedback

src/sass/login.sass

@@ -44,8 +44,9 @@
 .form-error
   color: red
 
-.homeserver-question
-  font-size: 0.8em
+#homeserver-question
+  font-size: 0.6em
+  padding-left: 0.2em
 
 .homeserver-label
   display: flex

src/sass/tippy.sass

@@ -3,8 +3,7 @@
 @use "./colors.sass" as c
 
 .tippy-box[data-theme~="carbon"] 
-  background-color: c.$milder
-  border: 2px solid c.$divider 
-
-  .tippy-svg-arrow
-    fill: c.$milder
+	background-color: c.$milder
+	border: 2px solid c.$divider 
+	.tippy-svg-arrow 
+		fill: c.$milder