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

[UnifiedDataTable] Migrate Buttons to shared UX toolbar buttons styles #167245

Closed
Tracked by #168084
kertal opened this issue Sep 26, 2023 · 0 comments · Fixed by #166744
Closed
Tracked by #168084

[UnifiedDataTable] Migrate Buttons to shared UX toolbar buttons styles #167245

kertal opened this issue Sep 26, 2023 · 0 comments · Fixed by #166744
Assignees
@jughosta
Labels
enhancement New value added to drive a business result Feature:UnifiedDataTable impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover App Team (Document Explorer, Saved Search, Surrounding documents, Graph)
Projects
Discover

Comments

@kertal
Copy link
Member

kertal commented Sep 26, 2023

For the redesign of Discover we need to migrate the button style to "Shared UX toolbar button styles".

  • This can be done by CSS magic in areas where we currently can't directly style button elements.
  • The style should be applied to Saved search embeddables or other consumers of the table

Here's how the buttons of the Data Table should look like:

Image

  • Out of scope the number of documents, since this is a bigger refactoring, and therefore the left part of the toolbar still should display the columns and sorting
@botelastic botelastic bot added the needs-team Issues missing a team label label Sep 26, 2023
@kertal kertal added Feature:UnifiedDataTable and removed needs-team Issues missing a team label labels Sep 26, 2023
@botelastic botelastic bot added the needs-team Issues missing a team label label Sep 26, 2023
@kertal kertal added Team:DataDiscovery Discover App Team (Document Explorer, Saved Search, Surrounding documents, Graph) enhancement New value added to drive a business result and removed needs-team Issues missing a team label labels Sep 26, 2023
@kibanamachine kibanamachine added this to Inbox in Discover Sep 26, 2023
@kertal kertal added impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort labels Sep 26, 2023
@jughosta jughosta mentioned this issue Sep 28, 2023
Merged
3 tasks
@kertal kertal mentioned this issue Oct 5, 2023
Closed
jughosta added a commit that referenced this issue Oct 19, 2023
@jughosta @davismcphee
[Discover] Custom grid toolbar (#166744)
a8335fa 
- Closes #167245

## Summary

This PR customizes the grid toolbar for Discover. The controls will have
the "ToolbarButton" look.

<img width="600" alt="Screenshot 2023-10-17 at 11 23 16"
src="https://github.com/elastic/kibana/assets/1415710/0fbc67a5-af2c-4642-8b89-ae384ea4a608">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 00"
src="https://github.com/elastic/kibana/assets/1415710/82e2605f-5d98-4035-835e-619a4c7cfde7">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 44"
src="https://github.com/elastic/kibana/assets/1415710/147f084c-d3d1-455f-b02b-399724e07fb9">


 

### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

---------

Co-authored-by: Davis McPhee <davis.mcphee@elastic.co>
benakansara pushed a commit to benakansara/kibana that referenced this issue Oct 22, 2023
@jughosta @davismcphee @benakansara
[Discover] Custom grid toolbar (elastic#166744)
ba9b99f 
- Closes elastic#167245

## Summary

This PR customizes the grid toolbar for Discover. The controls will have
the "ToolbarButton" look.

<img width="600" alt="Screenshot 2023-10-17 at 11 23 16"
src="https://github.com/elastic/kibana/assets/1415710/0fbc67a5-af2c-4642-8b89-ae384ea4a608">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 00"
src="https://github.com/elastic/kibana/assets/1415710/82e2605f-5d98-4035-835e-619a4c7cfde7">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 44"
src="https://github.com/elastic/kibana/assets/1415710/147f084c-d3d1-455f-b02b-399724e07fb9">


 

### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

---------

Co-authored-by: Davis McPhee <davis.mcphee@elastic.co>
benakansara pushed a commit to benakansara/kibana that referenced this issue Oct 22, 2023
@jughosta @davismcphee @benakansara
[Discover] Custom grid toolbar (elastic#166744)
724c0e8 
- Closes elastic#167245

## Summary

This PR customizes the grid toolbar for Discover. The controls will have
the "ToolbarButton" look.

<img width="600" alt="Screenshot 2023-10-17 at 11 23 16"
src="https://github.com/elastic/kibana/assets/1415710/0fbc67a5-af2c-4642-8b89-ae384ea4a608">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 00"
src="https://github.com/elastic/kibana/assets/1415710/82e2605f-5d98-4035-835e-619a4c7cfde7">
<img width="600" alt="Screenshot 2023-10-17 at 11 23 44"
src="https://github.com/elastic/kibana/assets/1415710/147f084c-d3d1-455f-b02b-399724e07fb9">


 

### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

---------

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

@jughosta jughosta

Labels
enhancement New value added to drive a business result Feature:UnifiedDataTable impact:high Addressing this issue will have a high level of impact on the quality/strength of our product. loe:small Small Level of Effort Team:DataDiscovery Discover App Team (Document Explorer, Saved Search, Surrounding documents, Graph)
Projects
No open projects
Discover
Inbox
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[Discover] Custom grid toolbar jughosta/kibana
2 participants
@kertal @jughosta