search

carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.86k stars 1.82k forks source link

Reduce selector specificity in _header.scss #9789

Open mateusbandeiraa opened 3 years ago

mateusbandeiraa commented 3 years ago

Is it really necessary to select only icon buttons with class .#{$prefix}--tooltip__trigger? https://github.com/carbon-design-system/carbon/blob/354bf5c43d816485d602bef68e336911105f3829/packages/styles/scss/components/ui-shell/header/_header.scss#L82-L84

As the selector is right now, it won't select icon-only buttons that don't have a tooltips. E.g: image Left button doesn't have a tooltip, right button has a tooltip.

Can we change the selector to .#{$prefix}--header__action.#{$prefix}--btn--icon-only?

tay1orjones commented 3 years ago

icon-only buttons that don't have a tooltips

To my knowledge, icon only buttons are intended to always have tooltips as an accessibility affordance. I'm not opposed to decreasing the selector specificity, but for context this was added as a visual fix as part of https://github.com/carbon-design-system/carbon/pull/7736 that we'll need to ensure still works as intended.

mateusbandeiraa commented 3 years ago

I agree that in most cases icon-only buttons should have tooltips. Though in some cases it feels redundant; "notifications" is illustrated by the bell icon almost everywhere on the internet... I think aria-label should be used in that case, instead of a tooltip.

I'll work on a PR for this change, but it will be my first one on this repository. I probably won't get everything right in the first try.