mail icon indicating copy to clipboard operation
mail copied to clipboard

feat: compact view for mail layouts

Open GretaD opened this issue 1 month ago • 1 comments

fixes #9713

GretaD avatar Dec 04 '25 14:12 GretaD

Hi @nimishavijay below are the draft screenshots of the new compact view for each of the layouts. Its not polished yet, but you can already review and let me know what do you think.

Vertical layout: Screenshot from 2025-12-10 13-11-30

Horizontal layout:

Screenshot from 2025-12-10 13-11-56

List layout: Screenshot from 2025-12-10 13-13-12

GretaD avatar Dec 10 '25 12:12 GretaD

Looks great! I know this is a draft, but some early feedback:

  • [ ] the unread marker color should be primary and not main-text
  • [ ] For the list view, I would argue we don't even need a compact view because the height of each element is only 48px, but if the point of the compact view is to hide the body and avatar, then we can do this.
    • [ ] remove avatar and body as stated
    • [ ] height of each item is 40px
    • [ ] show the full subject on the left instead of the right
    • [ ] but timestamp stays on the right
    • [ ] unread marker should be center aligned with the text (in your screenshot it is slightly more above)
    • [ ] The gap on either side of the unread marker should also be increased. in the screenshot I attached, the unread marker is aligned with the navigation toggle

End result will look something like this:

image

Important to note: the only way of selecting mails is via hovering over the avatar. if we remove that, selecting mails should be still be possible, for example by showing the checkbox in place of the unread marker on hover

image

nimishavijay avatar Dec 15 '25 13:12 nimishavijay

  • [ ] the unread marker color should be primary and not main-text

The black bullet point in the beginning of the row its not an unread message, but a bullet point instead of the avatar :) I did it like that because thats how roundcube has it. I can do it primary, but maybe it will be confusing with the unread market that is shown in the right.

GretaD avatar Dec 15 '25 17:12 GretaD

The black bullet point in the beginning of the row its not an unread message, but a bullet point instead of the avatar :) I did it like that because thats how roundcube has it. I can do it primary, but maybe it will be confusing with the unread market that is shown in the right.

Oh I see! In that case it is definitely confusing 🙈 Would it be possible to show the multiselect checkbox all the time instead of the bullet? image

It can be color-maxcontrast in order to make sure it doesn't stand out too much in the screen, and when you select an email, the checkbox-filled icon should be primary. Nice to have: once you select an email they can all change to primary to show we "entered" into selection mode

image

What do you think? :)

nimishavijay avatar Dec 16 '25 14:12 nimishavijay

What do you think? :)

sounds good, should work well with the checkbox. I will try and let you know <3

GretaD avatar Dec 16 '25 14:12 GretaD