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.

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] File Block center align behavior #8303

Merged
merged 2 commits into from
Aug 1, 2018
Merged

[Fix] File Block center align behavior #8303

merged 2 commits into from
Aug 1, 2018

Conversation

nfmohit
Copy link
Member

@nfmohit nfmohit commented Jul 30, 2018

Description

This PR addresses #8296 which reports the un-responsive alignment behavior of the file block in the editor when it is set to center align.

How has this been tested?

This PR has been tested by going through the following steps:

  1. Started a new post using the Gutenberg editor.
  2. Added a "File" block and added a file from the media library.
  3. Set the block alignment to "center".
  4. Made sure that the block is center aligned in the editor.

This was tested in WP 4.9.7, Gutenberg 3.3.0, Apache server with PHP 7.2.0 and MySQL 5.6.34. According to initial tests, the code doesn’t seem to affect any other areas.

Screenshots

pull-8296

Types of changes

This PR just adds a bit CSS to the block flexbox element's file child div, so that it grows up to the remaining space in the container.

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.

@@ -4,6 +4,10 @@
align-items: center;
margin-bottom: 0;

> div {
Copy link
Member

@jorgefilipecosta jorgefilipecosta Jul 31, 2018

Choose a reason for hiding this comment

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

Minor: Maybe we can add a class to this div something like wp-block-file__content-wrapper so we can target it using the class name instead of "> div" which is more vulnerable to a regression in a future change.

Copy link
Member Author

Choose a reason for hiding this comment

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

This sounds much better. Addressed in this commit. Thank you ❤️

Copy link
Member

@jorgefilipecosta jorgefilipecosta left a comment

Choose a reason for hiding this comment

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

This seems to fix the problem thank you for looking into this problem @nfmohit-wpmudev!

@nfmohit
Copy link
Member Author

nfmohit commented Jul 31, 2018

Thank you so much for the review @jorgefilipecosta ❤️

Copy link
Member

@noisysocks noisysocks left a comment

Choose a reason for hiding this comment

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

Thanks @nfmohit-wpmudev!

@noisysocks noisysocks merged commit f9f20aa into WordPress:master Aug 1, 2018
@noisysocks noisysocks added this to the 3.5 milestone Aug 1, 2018
@nfmohit
Copy link
Member Author

nfmohit commented Aug 1, 2018

Thank you so much @noisysocks ❤️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants