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

[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
@Heenawter
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 •
edited
Loading

@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 🙈

@Heenawter Heenawter mentioned this issue Jan 17, 2024
Merged
3 tasks
@Heenawter Heenawter self-assigned this Jan 17, 2024
@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
Member

cee-chen commented Jan 26, 2024 •
edited
Loading

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
@Heenawter
[Controls] Fix text alignment of options list control selections (#17…
0a2ccf5 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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)
nreese pushed a commit to nreese/kibana that referenced this issue Jan 31, 2024
@Heenawter @nreese
[Controls] Fix text alignment of options list control selections (ela…
2f2fa14 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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)
WafaaNasr pushed a commit to WafaaNasr/kibana that referenced this issue Feb 5, 2024
@Heenawter @WafaaNasr
[Controls] Fix text alignment of options list control selections (ela…
6b155cb 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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)
WafaaNasr pushed a commit to WafaaNasr/kibana that referenced this issue Feb 6, 2024
@Heenawter @WafaaNasr
[Controls] Fix text alignment of options list control selections (ela…
73057de 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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
@Heenawter @CoenWarmer
[Controls] Fix text alignment of options list control selections (ela…
60cf48a 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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
@Heenawter @CoenWarmer
[Controls] Fix text alignment of options list control selections (ela…
462d4ad 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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
@Heenawter @fkanout
[Controls] Fix text alignment of options list control selections (ela…
a8d3094 
…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:/elastic/kibana/assets/8698078/d40993fc-ed16-4ca6-86fa-aa156e4ef4d8)
| ![Jan-17-2024
16-04-00](https:/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
Assignees

@Heenawter Heenawter

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
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[Controls] Fix text alignment of options list control selections Heenawter/kibana
5 participants
@ryankeairns @cee-chen @Heenawter @ThomThomson @elasticmachine