BP-Nouveau: Remove tooltip from Friends > Requests buttons

[mercime]

bp-tooltips for the Accept and Reject buttons have become redundant when text is used on the buttons. I remember adding those tooltips way back when the checkmark and crossmark icons were used instead at the next template packs Github repo.

Screenshot and patch coming up.

[hnla]

and I would just like to check back and ensure buttons reverted to text from icons as a deliberate action and not as consequence of some issue, but yes don't want tooltips on text links - do we prefer text button over icon here? opinions?

[DJPaul]

Can't go wrong with text - some icons may mean/represent different things in different cultures (e.g. maybe some languages don't use ticks or crosses, then we have a translation task as well).

[DJPaul]

With regards to the patch - presumably we can just remote the data-bp-tooltip assignment, instead of just replacing with a blank value.

[mercime]

@hnla I can see cases where preference will be to use icons with tooltips instead of text. Will need to also check why the replacement of the icons to text in those buttons pushed <div class=" friends-meta action"> down below the avatar even on desktop view then fix it.

@DJPaul: Didn't remove the data-bp-tooltip attr for those who want to use icons instead of text (after adding span with bp-screen-reader-text around the link text in link_text).

[hnla]

I'm of the notion of Can't go wrong with text too, @mercime lets go with the text and your patch then when we're happy with your above concerns.

[mercime]

@hnla when you have the time, please check the new patch attached:

• removes the tooltip
• fixes some name alignment in mobile view
• re-aligns the friends accept/reject buttons to the right for desktop.

Screenshot shows the before and after for mobile and desktop.

[hnla]

@mercime will do, might be a couple of days but on my todo list.

[hnla]

@mercime Checking over ... do we not also need to remove the class 'bp-tooltip' from the $button array args?

Although on the question of tooltips and icons I remember this is why I had originally added the 'icon' arg to allow switching between text/icons via the function call, not a simple implementation though as it needed to be tied into Customizer ideally and a new set of modular styles, and I got massively pulled in diff directions so couldn't follow it through properly, I'll try and add this as a future enhancement ticket.

On the styles realise this user friends 'requests' screen is one that has escaped detailed styling thus far and needs attention.

In principle agree with those screenies, with some provisos:

• With positioning I'm trying to avoid using pos:abs where possible the principle we can follow is moving elements as blocks using either floats and sibling elements overflow hidden to clear floated sibling or flexbox to grid the wrapping element. Therefore blocks .item & .friends-meta.action could be floated left and overflow: hidden respectively with suitable widths for wide screen or flexboxed for avatar .item & meta block as a row.

• Something I should have spotted but feel a little bothered by; the class 'fiends-list' is not very descriptive of this screen for the UL. Think it would be better if we added or changed to 'friends-requests-list' and used that as a top level parent class -? Principle of a generic class is sound though i.e 'friends-list' however on the other tab 'friends' we have got 'members-friends-list' and no 'friends-list' so really these classes need to be better. At this moment I don't think 'friends-list' is used so we could change it to 'friends-request-list'

[mercime]

Replying to hnla:

@mercime Checking over ... do we not also need to remove the class 'bp-tooltip' from the $button array args?

Although on the question of tooltips and icons I remember this is why I had originally added the 'icon' arg to allow switching between text/icons via the function call, not a simple implementation though as it needed to be tied into Customizer ideally and a new set of modular styles, and I got massively pulled in diff directions so couldn't follow it through properly, I'll try and add this as a future enhancement ticket.

Remove .bp-tooltip and data-bp-tooltip - Done.

On the styles realise this user friends 'requests' screen is one that has escaped detailed styling thus far and needs attention.

In principle agree with those screenies, with some provisos:

• With positioning I'm trying to avoid using pos:abs where possible the principle we can follow is moving elements as blocks using either floats and sibling elements overflow hidden to clear floated sibling or flexbox to grid the wrapping element. Therefore blocks .item & .friends-meta.action could be floated left and overflow: hidden respectively with suitable widths for wide screen or flexboxed for avatar .item & meta block as a row.

Use flexbox - Done.

• Something I should have spotted but feel a little bothered by; the class 'fiends-list' is not very descriptive of this screen for the UL. Think it would be better if we added or changed to 'friends-requests-list' and used that as a top level parent class -? Principle of a generic class is sound though i.e 'friends-list' however on the other tab 'friends' we have got 'members-friends-list' and no 'friends-list' so really these classes need to be better. At this moment I don't think 'friends-list' is used so we could change it to 'friends-request-list'

Use .friends-request-list - Added and done.

Attached 7716.3.patch

[DJPaul]

Please may we aim to have this in trunk by next Wednesday 4th April for beta 1?

[hnla]

Running updated patch...

[hnla]

In 11915:

Nouveau: Remove tooltips on friends request buttons, refactor item layout

Commit removes tooltips.

Adds new class 'friends-requests-list' to better mirror classes on general friends lists.

Updates layout styling for list entries for mobile and desktop views.

Props mercime

Fixes #7716

[hnla]

@mercime Uber work, thanks for the changes, checked over, added a sneaky font size increase for item-title(username) but otherwise it was good to go.

I may do some further tweaks just to get some better parity between friends list and requests lists, but that's more down to me not having focussed more on these two screens, might up the avatar size to match to the friends list etc but these aren't critical.