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: make sure first floated element has top margin #903

Merged
merged 2 commits into from
Apr 28, 2020

Conversation

laurelfulford
Copy link
Contributor

All Submissions:

Changes proposed in this Pull Request:

Right now floated blocks don't have a top margin, so their placement seems more natural mid-page. But this also means all but the image block look wacky when they're the first thing in the content.

This PR updates the styles that remove the top margin, so they're only applied when a floated block isn't the first thing in the content.

Closes #892.

How to test the changes in this Pull Request:

  1. Create a post, and add a group block to the top with a background colour, and float it left or right, along with some regular text content.
  2. View the post on the front-end; note that the floated blocks stick up above the content:

image

  1. Apply the PR and run npm run build
  2. Refresh the post; verify that the floated group block now has space above it:

image

Other information:

  • Have you added an explanation of what your changes do and why you'd like us to include them?
  • Have you written new tests for your changes, as applicable?
  • Have you successfully ran tests with your changes locally?

@laurelfulford laurelfulford added [Status] Needs Review The issue or pull request needs to be reviewed Smaller PR This PR is smaller and quick to test. labels Apr 25, 2020
Copy link
Contributor

@jeffersonrabb jeffersonrabb left a comment

Choose a reason for hiding this comment

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

This one was tough to set up due to various Gutenberg 7.9 editor issues but once I did it works well on the frontend.

@jeffersonrabb jeffersonrabb added [Status] Approved The pull request has been reviewed and is ready to merge and removed [Status] Needs Review The issue or pull request needs to be reviewed labels Apr 28, 2020
@laurelfulford
Copy link
Contributor Author

Thanks Jeff! Apologies for not adding a disclaimer that this block is a mess in the editor at the moment 😬

@laurelfulford laurelfulford merged commit 733d482 into master Apr 28, 2020
@laurelfulford laurelfulford deleted the fixes/892-update-top-margin branch April 28, 2020 16:20
matticbot pushed a commit that referenced this pull request Apr 29, 2020
## [1.6.1](v1.6.0...v1.6.1) (2020-04-29)

### Bug Fixes

* add a temporary fix for a doubled block button outline ([#907](#907)) ([57df314](57df314))
* add color selectors for the editor ([#898](#898)) ([6e94411](6e94411))
* improve appearance of caption with beside featured image setting ([#882](#882)) ([1da6e44](1da6e44))
* make sure amp styles work with logo centering ([#887](#887)) ([0aaec4c](0aaec4c))
* make sure first floated element has top margin ([#903](#903)) ([733d482](733d482))
* tweak primary menu to be properly centred ([#884](#884)) ([9897cb1](9897cb1))
@matticbot
Copy link
Contributor

🎉 This PR is included in version 1.6.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
released Smaller PR This PR is smaller and quick to test. [Status] Approved The pull request has been reviewed and is ready to merge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Align Left and Right: If first block aligned left/right, it should have a top margin
3 participants