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

[Controls] Options list control selections are centered #174971

Closed
Heenawter opened this issue Jan 16, 2024 · 5 comments · Fixed by #175073
Closed

[Controls] Options list control selections are centered #174971

Heenawter opened this issue Jan 16, 2024 · 5 comments · Fixed by #175073
Assignees
Labels
bug Fixes for quality problems that affect the customer experience 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 Project:Controls Team:Presentation Presentation Team for Dashboard, Input Controls, and Canvas

Comments

@Heenawter
Copy link
Contributor

Kibana version: main

Describe the bug:
All control selections should be left aligned; not sure what changed, but they are currently being center aligned:

Expected Actual
Jan-16-2024 14-29-55 Jan-16-2024 14-28-12

Seems to be fixed if you add text-align: left to the optionsList--filterGroup class, but there might be a better way.

@Heenawter Heenawter added bug Fixes for quality problems that affect the customer experience Team:Presentation Presentation Team for Dashboard, Input Controls, and Canvas 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. Project:Controls labels Jan 16, 2024
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-presentation (Team:Presentation)

@ThomThomson
Copy link
Contributor

I wonder how this happened??

@Heenawter
Copy link
Contributor Author

Heenawter commented Jan 16, 2024

@ThomThomson Most likely culprit is #174487, since changes were made to the EuiFilterButton component - didn't notice those when reviewing, since I was only looking at the range + time sliders 🙈

@ryankeairns
Copy link
Contributor

@cee-chen it seems this PR - removing the inner span - might have led to this issue. @Heenawter has a fix in the related PR, but I suspect an EUI fix may be in order. Thoughts?

@cee-chen
Copy link
Contributor

cee-chen commented Jan 26, 2024

It was an intentional change :) DOM cleanups are part and parcel of frontend life (EUI can't be so afraid of changing the DOM that we create a component and never touch it thereafter), and markup is not an API we guarantee or flag as a breaking change. I try to grep for obvious className usages during my EUI upgrades and update them as I find them, but I do miss some. Thanks for catching this one Hannah!

Heenawter added a commit that referenced this issue Jan 30, 2024
…5073)

Closes #174971

## Summary

This PR fixes the alignment issue for the options list control that
happened due to the most recent EUI update.

| Before | After |
|--------|--------|
| ![Jan-17-2024
16-03-07](https://github.com/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https://github.com/elastic/kibana/assets/8698078/1746cecb-8c93-46a9-b381-1ef07b1d9999)
|

### Checklist

- [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)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
CoenWarmer pushed a commit to CoenWarmer/kibana that referenced this issue Feb 15, 2024
…stic#175073)

Closes elastic#174971

## Summary

This PR fixes the alignment issue for the options list control that
happened due to the most recent EUI update.

| Before | After |
|--------|--------|
| ![Jan-17-2024
16-03-07](https://github.com/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https://github.com/elastic/kibana/assets/8698078/1746cecb-8c93-46a9-b381-1ef07b1d9999)
|

### Checklist

- [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)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
fkanout pushed a commit to fkanout/kibana that referenced this issue Mar 4, 2024
…stic#175073)

Closes elastic#174971

## Summary

This PR fixes the alignment issue for the options list control that
happened due to the most recent EUI update.

| Before | After |
|--------|--------|
| ![Jan-17-2024
16-03-07](https://github.com/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https://github.com/elastic/kibana/assets/8698078/1746cecb-8c93-46a9-b381-1ef07b1d9999)
|

### Checklist

- [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)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Fixes for quality problems that affect the customer experience 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 Project:Controls Team:Presentation Presentation Team for Dashboard, Input Controls, and Canvas
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants