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

Gutenberg: Fix the styling of the checkboxes #28111

Merged
merged 2 commits into from
Nov 1, 2018
Merged

Gutenberg: Fix the styling of the checkboxes #28111

merged 2 commits into from
Nov 1, 2018

Conversation

mmtr
Copy link
Member

@mmtr mmtr commented Oct 26, 2018

Changes proposed in this Pull Request

Fixes #28101.

The checkboxes that appear in the Calypso Gutenberg editor has some styling issues caused by:

  • Lack of Core styles in @wordpress/components.
  • Calypso default styles for the form elements.

This PR adds temporarily the missing Core styles (to be removed after WordPress/gutenberg#11089 is solved) and unsets the Calypso defaults styles causing the issues.

Note: Core displays the check marks using the Dashicons font face, but given this is not available in Calypso, I have applied a workaround using the check mark SVG image from Gridicons.

Testing instructions

  • Start creating a new post using Gutenberg.
  • Check any of the checkboxes on the sidebar (Stick to the Front Page, Categories, Allow comments, ...).
  • Make sure they look like the After screenshot below.

Screenshots

Before
screen shot 2018-10-25 at 18 23 55

After
screen shot 2018-10-26 at 11 48 37

@mmtr mmtr added [Type] Bug [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. [Goal] Gutenberg Working towards full integration with Gutenberg labels Oct 26, 2018
@mmtr mmtr self-assigned this Oct 26, 2018
@matticbot
Copy link
Contributor

Test live: https://calypso.live/?branch=fix/gutenberg-styling-checkboxes

@mmtr mmtr requested a review from a team October 26, 2018 09:50
Copons
Copons previously requested changes Oct 26, 2018
View reviewed changes
Copy link
Contributor

@Copons Copons left a comment

Choose a reason for hiding this comment

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

This looks very good already! ✨

I've left two changes that, although very minor, need to be sorted out before merging.

client/gutenberg/editor/style.scss Show resolved Hide resolved
client/gutenberg/editor/style.scss Outdated Show resolved Hide resolved
vindl
vindl approved these changes Oct 31, 2018
View reviewed changes
Copy link
Member

@vindl vindl left a comment

Choose a reason for hiding this comment

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

Tests well for me! :shipit:

@vindl vindl added [Status] Ready to Merge and removed [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. labels Oct 31, 2018
@vindl vindl dismissed Copons’s stale review October 31, 2018 05:22

Requested changes addressed in update.

@mmtr mmtr merged commit d1b4ca0 into master Nov 1, 2018
@mmtr mmtr deleted the fix/gutenberg-styling-checkboxes branch November 1, 2018 08:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@vindl vindl vindl approved these changes

@Copons Copons Copons left review comments

Assignees

@mmtr mmtr

Labels
[Goal] Gutenberg Working towards full integration with Gutenberg [Type] Bug
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@mmtr @matticbot @vindl @Copons