react icon indicating copy to clipboard operation
react copied to clipboard

ActionList.Item danger variant changes color on hover

Open jdrush89 opened this issue 1 year ago • 5 comments

Description

It looks like there are conflicting styles on ActionList.Items when using the danger variant. There are two that have the same specificity that change the color of the text on hover, and it seems like the behavior you get depends on which style sheet happens to load first.

Image

Steps to reproduce

Create an ActionList with an ActionList.Item variant="danger" Hover over the item Check in the inspector that there are two styles that can possibly change the color if you don't see the color change to default.

Image

Version

v36.9.0

Browser

Chrome

jdrush89 avatar Feb 21 '24 21:02 jdrush89

Uh oh! @jdrush89, the image you shared is missing helpful alt text. Check your issue body.

Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image.

Learn more about alt text at Basic writing and formatting syntax: images on GitHub Docs.

github-actions[bot] avatar Feb 21 '24 21:02 github-actions[bot]

I'm not able to reproduce this in Storybook, can you link to the code for this specific menu? I see it in production but that item is disabled. Is it meant to be disabled in your screenshot?

langermank avatar Feb 21 '24 22:02 langermank

The code is here, it's not doing anything special with the styles. It's not disabled in the screenshot, you can enable the button by sending a message to start a thread.

jdrush89 avatar Feb 22 '24 17:02 jdrush89

@langermank we moved this to in progress since you assigned it to yourself. Let us know if you have any concern with it 🙌

broccolinisoup avatar Feb 27 '24 00:02 broccolinisoup