Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: legend dark mode hover color #820

Merged
merged 7 commits into from
Sep 15, 2020

Conversation

nickofthyme
Copy link
Collaborator

@nickofthyme nickofthyme commented Sep 15, 2020

Summary

Related to elastic/kibana#77283

Fixes bad styles for dark theme after changes to legend item hover styles in #749

Screen Recording 2020-09-14 at 07 12 PM

Checklist

  • Any consumer-facing exports were added to src/index.ts (and stories only import from ../src except for test data & storybook)
  • This was checked for cross-browser compatibility
  • Proper documentation or storybook story was added for features that require explanation or tutorials
  • Unit tests were updated or added to match the most common scenarios

@nickofthyme nickofthyme added bug Something isn't working :legend Legend related issue :styling Styling related issue labels Sep 15, 2020
Copy link
Member

@markov00 markov00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

cchaos
cchaos previously requested changes Sep 15, 2020
@@ -16,7 +16,7 @@ $legendItemVerticalPadding: $echLegendRowGap / 2;
}

&:hover {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should actually only get background color on :focus. Leaving the underline as the hover state.

Suggested change
&:hover {
&:focus {

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unfortunately, at the moment we don't have accessible interactions on the legend and thus focus would do nothing. This will be revisited in #580.

Are you ok with it being hover until then?

@cchaos cchaos requested review from miukimiu and removed request for cchaos September 15, 2020 14:35
src/components/legend/_legend_item.scss Outdated Show resolved Hide resolved
@nickofthyme nickofthyme dismissed stale reviews from cchaos and miukimiu September 15, 2020 21:20

In favor of #820 (review)

@nickofthyme nickofthyme merged commit 5227b2e into elastic:master Sep 15, 2020
@nickofthyme nickofthyme deleted the fix/legend-color branch September 15, 2020 21:56
markov00 pushed a commit that referenced this pull request Sep 16, 2020
# [21.3.0](v21.2.0...v21.3.0) (2020-09-16)

### Bug Fixes

* legend dark mode hover color ([#820](#820)) ([5227b2e](5227b2e))

### Features

* cancel brush/click event with escape key ([#819](#819)) ([b599d13](b599d13))
* show crosshair for external pointer events ([#817](#817)) ([f591a6a](f591a6a))
@markov00
Copy link
Member

🎉 This PR is included in version 21.3.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

@markov00 markov00 added the released Issue released publicly label Sep 16, 2020
AMoo-Miki pushed a commit to AMoo-Miki/OpenSearch-Dashboards that referenced this pull request Feb 10, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working :legend Legend related issue released Issue released publicly :styling Styling related issue
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants