New RR layout unnecessarily wastes horizontal screen estate

[ara4n]

Steps to reproduce

1. Observe the new RR layout when you have a lot of RRs on a message - looks cute!
2. But then realise there's a huge right-hand margin on the message bodies which is presumably left over from the old layout, wasting horizontal screen real estate.

Outcome

What did you expect?

New RR layout to give more horizontal real estate

What happened instead?

It doesn't.

Operating system

No response

Application version

nightly

How did you install the app?

No response

Homeserver

matrix.org

Will you send logs?

No

[niquewoodhouse]

Just to be sure, please, this is referring to this 'gap' between the receipts on the right and the message content on the left?

You're completely right, nothing was changed in terms of where they appear. It was just about what happens when you click.

I think this might be a bigger than small design challenge, but I'm assuming a lot (eg - some need to align them with sent/sending iconography). I'll raise with other designers to see if they can help me understand the area more and if they can't, will ask N4d for all the nuance/history.

[justjanne]

some need to align them with sent/sending iconography

From a technical perspective: sent/sending icons use the same CSS classes as read receipts, so they are aligned and positioned identically.

[t3chguy]

The timeline reserves a right margin to avoid overlapping with the read receipts, since read receipts are much narrower now, the reserved column can be shrunk down to fit

[kittykat]

@niquewoodhouse did you get a follow up from the rest of the design team on this issue? Maybe we could shrink that column down for now to resolve this issue?

[niquewoodhouse]

@kittykat No one had much detail on this area, I have tried to look at this in my but I'm not sure I have a clear design proposal and I'm not sure if the waste of screen estate is overall a negative

• The margin helps align things on the right so the ui isn't as messy
• The margin does separate the receipts from the messages which I understand might be deemed a problem for some but it also gives the message more focus, and makes the receipts clearly a less important element, which feels true.

I think to move this forwards, I might need to pair with an engineer to make a netlify to test with all the various things (bubbles, IRC, different screen sizes).

[germain-gg]

I don't think the idea is to change the right gutter at all, but more to do with the space between the event tile and the read receipts. I've opened a PR that I believe brings the spacing between the read receipt UI and event tile to what it was before the redesign.

Used a 8px spacing between the two elements