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

ItemGroup: fix RTL text alignment when item is clickable #45280

Merged
merged 3 commits into from
Oct 25, 2022
Merged

ItemGroup: fix RTL text alignment when item is clickable #45280

merged 3 commits into from
Oct 25, 2022

Conversation

ciampo
Copy link
Contributor

@ciampo ciampo commented Oct 25, 2022 •
edited
Loading

What?

Quick fix for an issue that I noticed while reviewing #43208

Why?

Making the component look as expected for RTL writing directions

How?

This PR uses logical properties for the value of text-align in the Item component, specifically when the Item is clickable (and therefore rendered as a button)

Testing Instructions

  • Open the ItemGroup's default story on Storybook
  • Set the writing direction to RTL via the toolbar buttons
  • Notice how the text in the clickable elements is correctly aligned to the right, and compare it to the (incorrectly) left-aligned text for the same buttons on trunk

Screenshots or screencast

Before After
Screenshot 2022-10-25 at 15 42 48 Screenshot 2022-10-25 at 15 57 53

@ciampo ciampo added [Type] Bug An existing feature does not function as intended [Package] Components /packages/components labels Oct 25, 2022
@ciampo ciampo requested review from mirka, walbo and chad1008 October 25, 2022 13:58
@ciampo ciampo self-assigned this Oct 25, 2022
@ciampo ciampo requested a review from ajitbohra as a code owner October 25, 2022 13:58
@ciampo ciampo force-pushed the fix/item-group-button-rtl branch from c81941a to 63fb9e8 Compare October 25, 2022 14:01
mirka
mirka approved these changes Oct 25, 2022
View reviewed changes
Copy link
Member

@mirka mirka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense 🚢

Good to go after the snapshot is updated.

@ciampo ciampo merged commit b032c57 into trunk Oct 25, 2022
@ciampo ciampo deleted the fix/item-group-button-rtl branch October 25, 2022 22:29
@github-actions github-actions bot added this to the Gutenberg 14.5 milestone Oct 25, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@mirka mirka mirka approved these changes

@walbo walbo Awaiting requested review from walbo

@chad1008 chad1008 Awaiting requested review from chad1008

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra is a code owner

Assignees

@ciampo ciampo

Labels
[Package] Components /packages/components [Type] Bug An existing feature does not function as intended
Projects
None yet
Milestone
Gutenberg 14.5
Development

Successfully merging this pull request may close these issues.
2 participants
@ciampo @mirka