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

[Discover] Design changes to main panels #164661

Closed
Tracked by #168084
kertal opened this issue Aug 24, 2023 · 1 comment · Fixed by #165866
Closed
Tracked by #168084

[Discover] Design changes to main panels #164661

kertal opened this issue Aug 24, 2023 · 1 comment · Fixed by #165866
Assignees
Labels
enhancement New value added to drive a business result Feature:Discover Discover Application impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:medium Medium Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL.

Comments

@kertal
Copy link
Member

kertal commented Aug 24, 2023

Extracted task of the POC #164339

  • The panels of Discover Main no longer have a background, there are no rounded corners, or shadows. So it's a white / black background (depending on theme)
  • For changes to the UnifiedFieldList please refer to the dedicated issue [UnifiedFieldList] Redesign #164662
  • [Sidebar] Field name search should be compressed - to better align with histogram breakdown select - Only in Discover
  • [Sidebar] Add a field button should adopt a style similar to SharedUX's toolbar buttons (light gray border, text/icon in black).
  • [Tabs] Until we remove Field Statistics we should remove background from these tabs
  • [UnifiedSearchBar] this is a change we might only do in Discover for now => remove background

That's how it looks like in the POC currently:

Image

End goal as shown in Figma

Image

@kertal kertal added Feature:Discover Discover Application Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL. labels Aug 24, 2023
@elasticmachine
Copy link
Contributor

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

@kertal kertal added enhancement New value added to drive a business result loe:medium Medium Level of Effort impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. labels Aug 24, 2023
jughosta added a commit that referenced this issue Sep 12, 2023
## 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
Labels
enhancement New value added to drive a business result Feature:Discover Discover Application impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:medium Medium Level of Effort Team:DataDiscovery Discover, search (e.g. data plugin and KQL), data views, saved searches. For ES|QL, use Team:ES|QL.
Projects
None yet
3 participants