Closed Bug 1743509 Opened 7 months ago Closed 7 months ago

Improve the HTML structure of the email protocols in the Account Setup

Categories

(Thunderbird :: Account Manager, enhancement)

enhancement

Tracking

(thunderbird_esr91 wontfix, thunderbird95 wontfix)

RESOLVED FIXED
97 Branch
Tracking Status
thunderbird_esr91 --- wontfix
thunderbird95 --- wontfix

People

(Reporter: aleca, Assigned: aleca)

References

Details

Attachments

(2 files)

Following these great suggestions from Henry to simplify the HTML structure and use a more consistent and easily manageable style.

Henry:
"You could expand the idea and apply the grid display to the resultsOption-* elements with

grid-template-columns: auto auto 1fr;
gap: 3px 6px;

and

.toggle-container-with-text,
.result-details,
.result-details-row {
  display: contents;
}

and set the grid-column of the other elements appropriately (e.g. result-indent would be 2 / 4), plus remove all inline margins, and other tidying.

This would also fix the 1px misalignment of the start of .toggle-container-with-text > span and .result-indent and .result-indent: the latter two have an inline margin of 21px, but the first element starts at 22px (from the 16px width and 6px margin-inline of the <input>)."

Related: The protocol label is now on its own row. Seems we could just have e.g. [POP3] Incoming, and [SMTP] Outgoing instead.

(In reply to Magnus Melin [:mkmelin] from comment #1)

Related: The protocol label is now on its own row. Seems we could just have e.g. [POP3] Incoming, and [SMTP] Outgoing instead.

The protocol label ends up on its own row only if the hostname is long enough to force a text wrap.
I can move the protocol in the title area, but it looks a bit strange. (attachment)

Not super strange, maybe a bit out of balance and unexpected.
Does the reading flow of the data make sense with protocol type and protocol title?

Comment on attachment 9253558 [details]
Screenshot from 2021-12-02 17-26-54.png

LGTM

Attachment #9253558 - Flags: feedback+

The protocol label ends up on its own row only if the hostname is long enough to force a text wrap.

Ah, that's nice, I didn't realize that. Maybe add a screenshot for that normal case?

Does the reading flow of the data make sense with protocol type and protocol title?

If we do it like this, then indeed, It should be "Incoming IMAP <hostname>".
And, to make the domain stick out more, I would not make the "Incoming" and "Username" labels bold.

If we do it like this, then indeed, It should be "Incoming IMAP <hostname>".
And, to make the domain stick out more, I would not make the "Incoming" and "Username" labels bold.

The Incoming and Outgoing text are meant to be the "header" of the printed info, keeping them bold and on their line helps with the visual separation and creating a better reading rhythm.

The hostname+domain info should be on the same line, unless the hostname is so long that triggers the natural wrapping, but that should be a very unusual edge case and it won't affect the readability or understanding of these info, for users that know what these info are.

I'll put the protocol after the title (Incoming IMAP), as it makes more sense from a reading/data POV.

Small test failure

Pushed by geoff@darktrojan.net:
https://hg.mozilla.org/comm-central/rev/2257fd744bc8
Improve the HTML structure of the protocols in Account setup.r=mkmelin

Status: ASSIGNED → RESOLVED
Closed: 7 months ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.