tutanota icon indicating copy to clipboard operation
tutanota copied to clipboard

Change attachment layout in mail viewer

Open bedhub opened this issue 2 years ago • 2 comments

Ui proposals This approach might be a little bit more consistent in user navigation but we need to play around with really wide screens. It also does not use the bubbles anymore as we have the buttons available already.

One attachment Image

Multiple attachments - collapsed Image

Multiple attachments - expanded Image

bedhub avatar Jul 26 '22 07:07 bedhub

So I went and implemented a quick working demo on top of Tutanota's current UI, and here is what it looks like on a widescreen display.

In normal usage, the window will look like this: image

When stretched, the window will look like this: image

And if we made just the attachments handle widescreen displays, it looks like this: image

It seems if you set a maximum width on just the list, it will not be aligned with the rest of the mail. You could have it left aligned and the right side won't be aligned. And you could have it right aligned, but the left side won't be aligned. Center alignment gives a more neutral appearance, but it doesn't go with the rest of the mail, either.

After a short discussion with a couple people, we think it would probably be even better if widescreen support was a considered for the entire mail viewer's UI rather than just attachments, as that would allow the attachments to look more in place with the rest of the viewer, too.

paw-hub avatar Aug 04 '22 07:08 paw-hub

The proposed list method is really nice, but we couldn't come up with a way to make it work at both lower and higher resolutions. I noted what the issues were at higher resolutions in my previous commit, but lower resolutions resulted in some more annoying issues, too, since we need room for both the attachment and the download button (and possibly an Open button).

As a list: image

To make matters worse, some clients have some of these buttons disabled such as the web client having no Open button thus one of the buttons on the header does not have anything to align to: image

We decided for now to stick to the old styling and just fix the problem with the buttons being in a weird location in between attachments.

image

image

image

We will need to revisit this later for the new layout.

paw-hub avatar Aug 08 '22 13:08 paw-hub

Design work was done in #4290

charlag avatar Sep 21 '22 12:09 charlag