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

Reduce the margin of the block toolbar. #38746

Merged
merged 3 commits into from Feb 17, 2022

Conversation

Alex-Kostov
Copy link
Contributor

Reduced the margin of the block toolbar
Fixes #38391

Description

Reduced the spacing above the toolbar, now it sits evenly.

Testing Instructions

  1. Activate a classic theme.
  2. Go to Appearance → Customize → Widgets.
  3. Select the first block.
  4. Check if the spacing on the top is reduced.

Screenshots

Types of changes

Bug fix

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).
  • I've updated related schemas if appropriate.

Reduced the margin of the block toolbar
Fixes WordPress#38391
@github-actions
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @Alex-Kostov! In case you missed it, we'd love to have you join us in our Slack community, where we hold regularly weekly meetings open to anyone to coordinate with each other.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Feb 11, 2022
@noisysocks
Copy link
Member

Thanks for fixing this up, @Alex-Kostov!

Here's how it looks now:

Screen Shot 2022-02-14 at 15 01 18

I believe in the original design there was a little bit of gap above the toolbar. Changing grid-margin-10 to grid-margin-20 looks about right to me:

Screen Shot 2022-02-14 at 15 06 20

I'll make that change for you since it's a quick one.

Hope to see you around the Gutenberg repo now that you know how to make changes and submit a PR! Lots more issues with a Good First Issue label if you're interested 🙂

@noisysocks
Copy link
Member

The failing E2E test here is because of a pre-existing bug in trunk that's been unsurfaced by this change. It seems that the block toolbar doesn't get dismissed when opening the slide-out inserter which means that it obscures one of the inserter buttons that Puppeteer tries to click. Investigating a fix...

@noisysocks noisysocks added [Feature] Widgets Customizer Ability to add and edit blocks in Customize → Widgets. [Type] Bug An existing feature does not function as intended CSS Styling Related to editor and front end styles, CSS-specific issues. labels Feb 17, 2022
…2E tests

The block toolbar sometimes obscures buttons in the inserter causing
test failures. It's not clear whether this is desired behaviour or not.
For now, let's just work around it in the E2E test.
@noisysocks noisysocks merged commit 04ba33e into WordPress:trunk Feb 17, 2022
@noisysocks
Copy link
Member

I worked around the test failure for now. Thanks for the patch @Alex-Kostov!

@github-actions github-actions bot added this to the Gutenberg 12.7 milestone Feb 17, 2022
@cbravobernal cbravobernal changed the title Fix for widget customizer panel, Reduce the margin of the block toolbar. Feb 26, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CSS Styling Related to editor and front end styles, CSS-specific issues. [Feature] Widgets Customizer Ability to add and edit blocks in Customize → Widgets. First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Widgets customizer panel: Too much padding above first block
2 participants