[EuiSelectableMessage] Fixed flex alignment #5966
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
cchaos
force-pushed
the
fix/selectable_message
branch
from
798f09f to
6be849a
Compare
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_5966/ |
cee-chen
approved these changes
Jun 13, 2022
Contributor
cee-chen
left a comment
cee-chen
left a comment
There was a problem hiding this comment.
Looks good to me, great catch!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This component based it's layout on the fact that EuiText created a second wrapping element for
color. Since we removed that element the flex layout was not targeting the actual (multiple) children vs the single text color div. In order to put the elements back into the direction, I had to addflex-direction: columndirectly.It's most noticeable when showing the loading state of EuiSelectble.
Before
After
Checklist
[ ] Checked in both light and dark modes[ ] Checked in mobile[ ] Props have proper autodocs and playground toggles[ ] Added documentation[ ] Checked Code Sandbox works for any docs examples[ ] Added or updated jest and cypress tests[ ] Checked for breaking changes and labeled appropriately[ ] Checked for accessibility including keyboard-only and screenreader modes[ ] Updated the Figma library counterpart