oui icon indicating copy to clipboard operation
oui copied to clipboard

Should button `title` tooltips apply to the entire button or just the label/icon?

Open joshuarrrr opened this issue 1 year ago • 4 comments

Is your feature request related to a problem? Please describe.

In https://github.com/opensearch-project/oui/pull/1160, we fixed an issue where icon-only buttons didn't have a tooltip/title attribute to display text on hover. Now that we've fixed that, I noticed that, because the title attribute is only applied to the button content it only activates when hovering directly over the label text or icon. If you hover the part of the button that's mostly padding, you don't get the tooltip hint. See the demo:

https://github.com/opensearch-project/oui/assets/1679762/c286ab6a-a677-4e4b-97a1-4071e88a1ce6

Describe the solution you'd like

I think the tooltip is especially helpful in cases where users aren't familiar with the icon. But it seems like it would be better to trigger/apply it to the entire button, rather than just the contents. @kgcreative any thoughts or preferences from the UX side?

joshuarrrr avatar Jan 11 '24 22:01 joshuarrrr

@joshuarrrr @BSFishy you can give me this tot ake a look

BigSamu avatar Jan 12 '24 12:01 BigSamu

I'd like a little more validation that other folks think this is a good idea/worth doing before we invest in it.

joshuarrrr avatar Jan 12 '24 23:01 joshuarrrr

for accessibility reasons, it should trigger on hover over the whole button element

kgcreative avatar Jan 12 '24 23:01 kgcreative

Agree on that. Thinking that in terms of UX experience this better for a user

BigSamu avatar Jan 13 '24 12:01 BigSamu