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

Improve 'stop all' for long translations #12

Merged
merged 2 commits into from
Apr 23, 2024
Merged

Improve 'stop all' for long translations #12

merged 2 commits into from
Apr 23, 2024

Conversation

SiobhyB
Copy link

@SiobhyB SiobhyB commented Apr 23, 2024 •
edited
Loading

Related to 6667-gh-Automattic/dotcom-forge

Proposed Changes

With this PR, some tweaks are made to the 'stop all' button's styles, to ensure it remains visually pleasing with long translations.

Breakdown of the code changes:

  • e9caaa0: Removes shrink-0 to ensure the button's content can overflow onto a new line. (Note, this class was first added in 49d1c37 but no longer seems necessary following 756a223.)
  • bc24777: Aligns the button's contents to the right. Without this, longer translations appeared to be 'floating' in a way that didn't seem right to me, but I'm open to hearing different perspectives.

Testing Instructions

  • Set locale to a language with longer translations, such as Polish.
  • Start the server for at least one site within the Studio app.
  • Observe the 'Stop all' button and confirm it looks visually pleasing.
Before After

Pre-merge Checklist

  • Have you checked for TypeScript, React or other console errors?

@SiobhyB SiobhyB added the [Type] Enhancement Improvement upon an existing feature label Apr 23, 2024
@SiobhyB SiobhyB self-assigned this Apr 23, 2024
@SiobhyB SiobhyB marked this pull request as ready for review April 23, 2024 00:25
@derekblank derekblank self-requested a review April 23, 2024 01:30
derekblank
derekblank approved these changes Apr 23, 2024
View reviewed changes
Copy link
Contributor

@derekblank derekblank left a comment

Choose a reason for hiding this comment

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

LGTM! 🚀 I was able to test successfully with some long languages like Polish and Russian.

Polish Russian
Zrzut ekranu 2024-04-23 o 11 03 52 AM Снимок экрана 2024-04-23 в 11 01 23 AM

@SiobhyB SiobhyB requested a review from a team April 23, 2024 05:01
@SiobhyB SiobhyB merged commit fe07b1e into trunk Apr 23, 2024
5 checks passed
@SiobhyB SiobhyB deleted the fix/improve-appearance-of-stop-button-long-text branch April 23, 2024 19:01
@wojtekn
Copy link
Contributor

wojtekn commented Apr 24, 2024

Thanks @SiobhyB , looks much better now!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@derekblank derekblank derekblank approved these changes

Assignees

@SiobhyB SiobhyB

Labels
[Type] Enhancement Improvement upon an existing feature
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@SiobhyB @wojtekn @derekblank