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

Bring consistency to block toolbar for text blocks #15964

Closed
wants to merge 3 commits into from

Conversation

gziolo
Copy link
Member

@gziolo gziolo commented Jun 3, 2019

Description

Closes #15096.

Right now the toolbar across text blocks change a fair bit, and in the case of the heading block, it's not possible to set the alignment unless you open the sidebar. Let's simplify and unify that:

Screenshot 2019-04-22 at 08 05 00

A toolbar for text-blocks consists of these elements and in this order:

  1. The block switcher. This doubles as a block type indicator, even when a block has no transformations.
  2. An optional "level selector". For headings, this lets you select the level of the heading. For the list block, this lets you pick between the type of list.
  3. Text alignments. This one can collapse.
  4. Inline formatting. Don't put any buttons here that apply on the block level, it's inline-only.
  5. More menu.

A few other details in this mockup:

  • The More menu button has been made thinner, as the vertical icon affords this.
  • The dropdown triangle buttons have been made thinner as well.

How has this been tested?

Screenshots

It's still work in progress. I just wanted to document where we are at the moment.

Screen Shot 2019-06-03 at 15 26 31
Screen Shot 2019-06-03 at 15 26 43
Screen Shot 2019-06-03 at 15 27 17

Types of changes

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.

@gziolo gziolo added [Type] Enhancement A suggestion for improvement. [Package] Block library /packages/block-library labels Jun 3, 2019
@gziolo gziolo self-assigned this Jun 3, 2019
@gziolo gziolo force-pushed the update/block-toolbar-text-consistency branch from c7c58e4 to c8ed3f8 Compare June 18, 2019 06:57
@gziolo gziolo added the [Status] In Progress Tracking issues with work in progress label Jun 18, 2019
@gziolo
Copy link
Member Author

gziolo commented Jul 29, 2019

@draganescu is working on moving text alignment to the block toolbar in #16682.

I will take care of adding text alignment to the List block in new PR. I'm closing this one for now.

@gziolo gziolo closed this Jul 29, 2019
@gziolo gziolo deleted the update/block-toolbar-text-consistency branch July 29, 2019 09:10
@gziolo gziolo removed the [Status] In Progress Tracking issues with work in progress label Jul 29, 2019
@gziolo
Copy link
Member Author

gziolo commented Jul 29, 2019

I opened #16792 as a replacement.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Package] Block library /packages/block-library [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Bring consistency to block toolbar for text blocks
3 participants