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.

Sign up for GitHub

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

Jump to bottom

[Discover] Document column field highlighting has poor contrast in dark mode #146339

Closed
davismcphee opened this issue Nov 25, 2022 · 2 comments · Fixed by #165866
Closed

[Discover] Document column field highlighting has poor contrast in dark mode #146339

davismcphee opened this issue Nov 25, 2022 · 2 comments · Fixed by #165866
Assignees
@kertal @jughosta
Labels
Feature:Discover Discover Application impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. usability

Comments

@davismcphee
Copy link
Contributor

The document column field highlighting has poor contrast in dark mode which makes the actual field names difficult to read. We should explore increasing the colour contrast in dark mode to improve legibility:
image
@davismcphee davismcphee added Feature:Discover Discover Application usability loe:small Small Level of Effort impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. labels Nov 25, 2022
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-data-discovery (Team:DataDiscovery)

@jughosta
Copy link
Contributor

Hi @andreadelrio,

How can we improve color contrast here? Should the text be darker?
Also, considering the redesign, can we already change field names here for both light and dark themes (and skip field tokens for now)? In the newer version we remove the background from field names, right?

@kertal kertal self-assigned this Aug 22, 2023
@kertal kertal mentioned this issue Sep 7, 2023
Merged
@jughosta jughosta self-assigned this Sep 7, 2023
jughosta added a commit that referenced this issue Sep 12, 2023
@jughosta @kibanamachine @davismcphee
[Discover] Redesign for the grid, panels and sidebar v1 (#165866)
6cb937a 
## Summary

### Part 1

- Resolves #164287
- Closes #146339
- Previously separate PR #164187

Changes:
- ~~swaps checkbox and row selection~~
- removes vertical borders
- adds rows highlight
- increases cell padding
- adds row stripes
- updates header background
- removes grey background from field name and makes it bolder (part of
#164634)
- updates Surrounding Documents side paddings

### Part 2

- Resolves #164661
- Previously separate PR #165687

Changes:
- removes background from panels, tabs and sidebar
- updates "Add a field" button style
- removes shadow from field list items
- makes field search compact

### Part 3

- Resolves #164662

Changes:
- wraps "Add a field" button in its own container with a top border
- ~~adds a drag handle to sidebar items~~
- ~~adds new Show/Hide buttons to toggle sidebar~~ moves sidebar toggle
button from discover plugin to unified field list
- reduces spaces between sidebar items from 4px to 2px
- reduces padding on Single Document page
- removes border above grid tabs

<img width="600" alt="Screenshot 2023-09-07 at 14 39 48"
src="https://github.com/elastic/kibana/assets/1415710/976db247-fd70-4c9b-8634-552ece45b522">


Please note that "auto" row height is in a separate PR which is also
ready for review #164218

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Davis McPhee <davismcphee@hotmail.com>
Co-authored-by: Davis McPhee <davis.mcphee@elastic.co>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@kertal kertal

@jughosta jughosta

Labels
Feature:Discover Discover Application impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. usability
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[Discover] Redesign for the grid, panels and sidebar v1 jughosta/kibana
4 participants
@kertal @jughosta @elasticmachine @davismcphee