Compare commits

...

4 commits

Author SHA1 Message Date
Bad
48c6ae7efb Increase the size of the homeserver explanation
All checks were successful
continuous-integration/drone/pr Build is passing
continuous-integration/drone/push Build is passing
2020-11-01 17:57:19 +01:00
Bad
fc5dbe93e7 Make homeserver explanatoin accessible 2020-11-01 17:55:57 +01:00
Bad
d8343f5976 Change homserver-question into a class 2020-11-01 17:35:10 +01:00
Bad
157bb9fc47 style fixes 2020-11-01 17:33:27 +01:00
4 changed files with 10 additions and 10 deletions

View file

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

View file

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

View file

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

View file

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