Element-web: Support inlined mentions properly

[MightyCreak]

Right now, I think the mentioning system is quite verbosy:

I propose to hide all that in a nice manner by adding the avatar before the user's name and removing the server info (this is pure UI, nothing to change on matrix). Here is a mockup I've made:

On the UX side, the common "@" to make a mention is replaced by the actual avatar of the user, so we're pretty sure who it is, also when hovering the mouse on the name or the avatar, your see the whole ID "@user:server.com".

[uhoreg]

related to #553

[ara4n]

Yup. this precisely how mentions are meant to work. The intention is that the mention is sent as <a href="mx://matrix.org/user/matthew">Matthew (@matthew:matrix.org)</a>, and any client smart enough to parse the a tag will go and render it as you propose. Less intelligent clients which can't handle HTML messages would then fall back to the plain text, which would behave as it does today.

[MightyCreak]

part of #2984

[ara4n]

(there's also a debate on whether these should be <a href= or <a rel= fwiw.)

[grahamperrin]

… adding the avatar …

Re: #4403 I prefer the cleanliness of mentions without avatars.

Without a circle at one end of the pill, the two rounded ends appear strange, so (for myself) I added to Stylish to improve the shape – and make the text more legible with a dark theme:

  .mx_UserPill {
    height: 1;
    line-height: 1;
    border-radius: 3px;
    border: none;
    background: rgb(0, 0, 0) !important;
    padding: .2em;
  }

Screenshot: https://matrix.to/#/!DgvjtOljKujDBrxyHk:matrix.org/$15014320683017427xcRTL:matrix.org

[MightyCreak]

I politely disagree. Please Riot devs, don't transform Riot into yet another IRC client.

As a user of other non-IRC software, I want avatars, I want rich-text edit, I want post edition, I want in-line preview, I want that the displayed text can elegantly hide some secondary information (like the complete ID), etc, etc.

I consider that if a Matrix user want to have an IRC UX, then maybe he should look at another client than Riot.

I know I won't make friends saying that, but IRC is simply too outdated to be taken as a reference.

[t3chguy]

@MightyCreak if it gets added it'll be a default-off option.

[MightyCreak]

Why is it closed? There's a fix?

[t3chguy]

@MightyCreak yes - see https://riot.im/develop/

[MightyCreak]

That's beautiful!
Well done, thanks!

[t3chguy]

It looks near-identical to your mockup @MightyCreak
and @lukebarnard1 is the one to thank, he did all the Pill stuff

[MightyCreak]

Thanks @lukebarnard1 !! 😄 ❤️