Gutenberg: Heading Block: Double alignment controls in toolbar

Created on 20 Oct 2020  路  1Comment  路  Source: WordPress/gutenberg

Describe the bug
After #25917 was merged, the block alignment toolbar is automatically added to the Heading block toolbar, and it controls the align attribute. This attribute was already in use for text alignment, so now there are two controls which both control align.

To reproduce

  1. Add a Heading block
  2. Click the text alignment to center the text
  3. Decide you also want it wide, so click the block alignment & select wide
  4. The text is now left-aligned

Expected behavior
Probably text alignment and block size (default/wide/full) should be separate, so that you can have a wide centered heading. Otherwise, maybe use just the BlockAlignmentToolbar & remove the text alignment, so it's clear that you can't have wide + center.

Screenshots

Screen Shot 2020-10-20 at 4 36 19 PM

If you have a wide heading like above, then click text align center, it goes back to default width.

Screen Shot 2020-10-20 at 4 36 30 PM

Editor version (please complete the following information):

  • WordPress version: 5.6-alpha
  • Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default? Plugin
  • If the Gutenberg plugin is installed, which version is it? master
[Block] Heading [Priority] High [Status] In Progress [Type] Bug

Most helpful comment

It looks like the solution here is to update the Heading block to use an attribute called textAlign for the text alignment (with a deprecation to convert existing blocks from WP 5.5).

>All comments

It looks like the solution here is to update the Heading block to use an attribute called textAlign for the text alignment (with a deprecation to convert existing blocks from WP 5.5).

Was this page helpful?
0 / 5 - 0 ratings

Related issues

aaronjorbin picture aaronjorbin  路  3Comments

nylen picture nylen  路  3Comments

jasmussen picture jasmussen  路  3Comments

aduth picture aduth  路  3Comments

youknowriad picture youknowriad  路  3Comments