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

Fix RTL block alignments #11293

Merged
merged 2 commits into from Nov 1, 2018

Conversation

Projects
None yet
3 participants
@jasmussen
Contributor

jasmussen commented Oct 31, 2018

When you explicitly pick an alignment in the editor, this alignment should be respected regardless of text direction.

"Align left" is always align left. This PR fixes that by adding ignore comments to the auto RTL prefixer.

Steps to reproduce:

  • Set WordPress to an RTL language
  • Explicitly left or right align a block, and verify that this alignment looks right in both the editor and the frontend.

Before:

screenshot 2018-10-31 at 12 04 04

After:

screenshot 2018-10-31 at 12 04 10

Fix RTL block alignments
When you explicitly pick an alignment in the editor, this alignment should be respected regardless of text direction.

"Align left" is always _align left_. This PR fixes that by adding ignore comments to the auto RTL prefixer

@jasmussen jasmussen added this to the 4.3 milestone Oct 31, 2018

@jasmussen jasmussen requested a review from WordPress/gutenberg-core Oct 31, 2018

@jasmussen jasmussen self-assigned this Oct 31, 2018

jasmussen added a commit to WordPress/twentynineteen that referenced this pull request Oct 31, 2018

Fix RTL alignments
This fixes #325.

It should be paired with WordPress/gutenberg#11293.

This PR adds RTL ignore comments to the block alignment classes so the values are not overridden.

@jasmussen jasmussen referenced this pull request Oct 31, 2018

Merged

Fix RTL alignments #425

@jasmussen jasmussen force-pushed the fix/rtl-alignments branch from 506348c to dcdad03 Oct 31, 2018

@jasmussen

This comment has been minimized.

Contributor

jasmussen commented Oct 31, 2018

Pushed an additional fix that addresses an issue with block toolbars. Before:

screenshot 2018-10-31 at 12 35 30

screenshot 2018-10-31 at 12 35 35

After:

screenshot 2018-10-31 at 12 34 51

screenshot 2018-10-31 at 12 34 57

@kjellr

kjellr approved these changes Oct 31, 2018

Looks good!

LTR:
screen shot 2018-10-31 at 8 47 18 am

RTL:
screen shot 2018-10-31 at 8 46 50 am

@gziolo gziolo added the i18n label Oct 31, 2018

@jasmussen

This comment has been minimized.

Contributor

jasmussen commented Oct 31, 2018

Note that the frontend will only look right once the upstream gutenberg PR is merged.

@jasmussen

This comment has been minimized.

Contributor

jasmussen commented Oct 31, 2018

Oh sorry I wrote that comment on the wrong repo 😅

@jasmussen jasmussen merged commit 9b4ef60 into master Nov 1, 2018

2 checks passed

codecov/project 48.6% remains the same compared to 73d9759
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details

@jasmussen jasmussen deleted the fix/rtl-alignments branch Nov 1, 2018

daniloercoli added a commit that referenced this pull request Nov 1, 2018

Merge branch 'master' of https://github.com/WordPress/gutenberg into …
…rnmobile/port-quote-block-step-1

* 'master' of https://github.com/WordPress/gutenberg: (22 commits)
  Add removed periods to block descriptions. (#11367)
  Remove findDOMNode usage from the inserter (#11363)
  Remove deprecated componentWillReceiveProps from TinyMCE component (#11368)
  Create file blocks when dropping multiple files at once (#11297)
  Try avoiding the deprecated findDOMNode API from DropZone Provider (#11168)
  Fix: make meta+A behaviour of selecting all blocks work on safari and firefox. (#8180)
  Remove _wpGutenbergCodeEditorSettings and wp.codeEditor assets (#11342)
  Remove the Cloudflare warning (#11350)
  Image Block: Use source_url for media file link (#11254)
  Enhance styling of nextpage block using the Hr element (#11354)
  Embed block refactor and tidy (#10958)
  Nonce Middleware: Wrap the nonce middleware function into it's own function that isn't regenerated on every API request. (#11347)
  Fix RTL block alignments (#11293)
  RichText: fix buggy enter/delete behaviour (#11287)
  Remove code coverage setup (#11198)
  Parser: Runs all parser implementations against the same tests (#11320)
  Stop trying to autosave when title and classic block content both are empty. (#10404)
  Fix "Mac OS" typo + use fancy quotes consistently (#11310)
  Update documentation link paths (#11324)
  Editor: Reshape blocks state under own key (#11315)
  ...

# Conflicts:
#	gutenberg-mobile

antpb added a commit to antpb/gutenberg that referenced this pull request Nov 5, 2018

Fix RTL block alignments (WordPress#11293)
* Fix RTL block alignments

When you explicitly pick an alignment in the editor, this alignment should be respected regardless of text direction.

"Align left" is always _align left_. This PR fixes that by adding ignore comments to the auto RTL prefixer

* Fix issue with toolbar as well.

grey-rsi pushed a commit to OnTheGoSystems/gutenberg that referenced this pull request Nov 22, 2018

Fix RTL block alignments (WordPress#11293)
* Fix RTL block alignments

When you explicitly pick an alignment in the editor, this alignment should be respected regardless of text direction.

"Align left" is always _align left_. This PR fixes that by adding ignore comments to the auto RTL prefixer

* Fix issue with toolbar as well.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment