fix(integrationer): en adresse kan læses helt, også på en telefon
Feed'et, mailadressen, krogen, curl-eksemplet, CalDAV-serveren og de to redirect-URI'er lå i skrivebeskyttede <input>. Et input ombryder ikke — det ruller indeni — så på en telefon stoppede adressen midt i kassen, og resten fandtes kun ved at trække inde i feltet. Der var ikke engang et rullepanel at se: feltet så ud som om det indeholdt det, der stod i det. Målt ved 390 px var kassen 306 px og krogens adresse 634. De er nu <output>. Det er stadig et felt, en <label for> kan pege på, så navnene på felterne bliver ved med at høre sammen med dem, og det er tekst, der ombryder. `user-select: all` beholder det ene, inputtet gjorde bedre: ét tryk tager hele adressen. Det samme gjaldt invitationslinket i en delt note, som vises netop når der ikke er nogen post at sende det med — altså når det er det eneste, der findes. Prøven nævner felterne ved navn frem for at forespørge på en klasse. Den, der måler `.field output` og finder nul, består også den dag felterne er lavet om til noget andet klippet. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 5
parent
72637a153a
commit
61f8887319
@@ -151,7 +151,8 @@
|
||||
|
||||
.settings :global(.field input),
|
||||
.settings :global(.field select),
|
||||
.settings :global(.field textarea) {
|
||||
.settings :global(.field textarea),
|
||||
.settings :global(.field output) {
|
||||
width: 100%;
|
||||
padding: var(--s2) var(--s3);
|
||||
background: var(--surface-sunken);
|
||||
@@ -168,6 +169,22 @@
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
/* Adresserne — feed'et, krogen, CalDAV-serveren — vises i et <output> og ikke i
|
||||
et skrivebeskyttet <input>. Et input kan ikke ombryde: det ruller indeni, så
|
||||
på en telefon står halvdelen af adressen uden for kassen, og der er ingen måde
|
||||
at se resten på. <output> er stadig et felt, en <label for> kan pege på, og det
|
||||
er tekst, der ombryder.
|
||||
|
||||
`user-select: all` er der, fordi det var det eneste, inputtet gjorde bedre: ét
|
||||
tryk tog hele adressen. Uden den skulle man trække hen over fire linjer. */
|
||||
.settings :global(.field output) {
|
||||
display: block;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
user-select: all;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* The field error sits under its own input rather than in a summary at the top:
|
||||
the server answers with a map of field to message, and putting each one where
|
||||
it belongs is the whole point of that shape. */
|
||||
|
||||
Reference in New Issue
Block a user