Skip to content

Conversation

@noahtallen
Copy link
Member

@noahtallen noahtallen commented Oct 14, 2020

Description

Adds a button to the template dropdown button which shows the template sidebar. Related: #21246. Resolves #25929. cc @mtias who proposed this idea

To do:

How has this been tested?

locally, in edit site. Test by opening the info area dropdown and clicking the button that shows up there.

Screenshots

2020-10-14 16 15 05

Screen Shot 2020-10-14 at 4 17 41 PM

Types of changes

enhancement

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.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@github-actions
Copy link

github-actions bot commented Oct 14, 2020

Size Change: +279 B (0%)

Total Size: 1.19 MB

Filename Size Change
build/block-editor/style-rtl.css 11 kB +8 B (0%)
build/block-editor/style.css 10.9 kB +8 B (0%)
build/edit-site/index.js 21.5 kB +112 B (0%)
build/edit-site/style-rtl.css 3.89 kB +78 B (2%)
build/edit-site/style.css 3.89 kB +73 B (1%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.54 kB 0 B
build/api-fetch/index.js 3.35 kB 0 B
build/autop/index.js 2.72 kB 0 B
build/blob/index.js 668 B 0 B
build/block-directory/index.js 8.6 kB 0 B
build/block-directory/style-rtl.css 943 B 0 B
build/block-directory/style.css 942 B 0 B
build/block-editor/index.js 130 kB 0 B
build/block-library/editor-rtl.css 8.65 kB 0 B
build/block-library/editor.css 8.65 kB 0 B
build/block-library/index.js 142 kB 0 B
build/block-library/style-rtl.css 7.71 kB 0 B
build/block-library/style.css 7.71 kB 0 B
build/block-library/theme-rtl.css 741 B 0 B
build/block-library/theme.css 741 B 0 B
build/block-serialization-default-parser/index.js 1.78 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 47.6 kB 0 B
build/components/index.js 169 kB 0 B
build/components/style-rtl.css 15.4 kB 0 B
build/components/style.css 15.4 kB 0 B
build/compose/index.js 9.63 kB 0 B
build/core-data/index.js 12.1 kB 0 B
build/data-controls/index.js 684 B 0 B
build/data/index.js 8.63 kB 0 B
build/date/index.js 31.9 kB 0 B
build/deprecated/index.js 772 B 0 B
build/dom-ready/index.js 569 B 0 B
build/dom/index.js 4.43 kB 0 B
build/edit-navigation/index.js 10.6 kB 0 B
build/edit-navigation/style-rtl.css 868 B 0 B
build/edit-navigation/style.css 871 B 0 B
build/edit-post/index.js 306 kB 0 B
build/edit-post/style-rtl.css 6.37 kB 0 B
build/edit-post/style.css 6.35 kB 0 B
build/edit-widgets/index.js 21.6 kB 0 B
build/edit-widgets/style-rtl.css 3.09 kB 0 B
build/edit-widgets/style.css 3.09 kB 0 B
build/editor/editor-styles-rtl.css 480 B 0 B
build/editor/editor-styles.css 482 B 0 B
build/editor/index.js 42.4 kB 0 B
build/editor/style-rtl.css 3.85 kB 0 B
build/editor/style.css 3.84 kB 0 B
build/element/index.js 4.45 kB 0 B
build/escape-html/index.js 733 B 0 B
build/format-library/index.js 7.49 kB 0 B
build/format-library/style-rtl.css 547 B 0 B
build/format-library/style.css 548 B 0 B
build/hooks/index.js 1.74 kB 0 B
build/html-entities/index.js 622 B 0 B
build/i18n/index.js 3.54 kB 0 B
build/is-shallow-equal/index.js 709 B 0 B
build/keyboard-shortcuts/index.js 2.39 kB 0 B
build/keycodes/index.js 1.85 kB 0 B
build/list-reusable-blocks/index.js 3.02 kB 0 B
build/list-reusable-blocks/style-rtl.css 476 B 0 B
build/list-reusable-blocks/style.css 476 B 0 B
build/media-utils/index.js 5.12 kB 0 B
build/notices/index.js 1.69 kB 0 B
build/nux/index.js 3.27 kB 0 B
build/nux/style-rtl.css 671 B 0 B
build/nux/style.css 668 B 0 B
build/plugins/index.js 2.44 kB 0 B
build/primitives/index.js 1.34 kB 0 B
build/priority-queue/index.js 789 B 0 B
build/redux-routine/index.js 2.85 kB 0 B
build/reusable-blocks/index.js 3.04 kB 0 B
build/rich-text/index.js 13 kB 0 B
build/server-side-render/index.js 2.6 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.24 kB 0 B
build/url/index.js 4.07 kB 0 B
build/viewport/index.js 1.75 kB 0 B
build/warning/index.js 1.13 kB 0 B
build/wordcount/index.js 1.17 kB 0 B

compressed-size-action

@david-szabo97
Copy link
Member

One minor thingy:
image

When the button is :active, the text is almost unreadable. Clicking on the button causes a big contrast between normal vs active state. Just did some further testing and looks like this only happens in Safari.

Otherwise all good!

@vindl
Copy link
Member

vindl commented Oct 15, 2020

  1. Looking at the issue that seems most closely related to this Add link to templates and template parts listing in site editor #21246 it says the following:

The same way we have a link to "manage reusable blocks" we should have links to the Templates and Template Parts post type listings.

It sounds to me like Browse all Templates should link to wp-admin CPT listing page if I'm not getting this wrong. I left my comment questioning the usefulness of that in the issue.

  1. When I try tabbing through the dropdown I can't see the focus styles change for the button, and it's impossible to leave the dropdown that way. Is this expected?

@mtias
Copy link
Member

mtias commented Oct 15, 2020

This current implementation is what I had in mind. The same way you can open the big inserter from the quick inserter. This allows opening the W menu for templates.

@vindl
Copy link
Member

vindl commented Oct 15, 2020

This current implementation is what I had in mind. The same way you can open the big inserter from the quick inserter. This allows opening the W menu for templates.

Thanks for the clarification, the "same as manage reusable blocks" part threw me off. That version looks a lot better to me.

@mtias
Copy link
Member

mtias commented Oct 15, 2020

Now it's probably the W menu the one that should let you go to "all templates" similarly to "manage all reusable blocks" :)

@noahtallen noahtallen force-pushed the add/view-all-templates-in-dropdown branch 2 times, most recently from c24bf59 to 5190990 Compare October 15, 2020 20:13
@noahtallen noahtallen requested a review from ellatrix as a code owner October 15, 2020 20:13
@noahtallen
Copy link
Member Author

When the button is :active, the text is almost unreadable. Clicking on the button causes a big contrast between normal vs active state. Just did some further testing and looks like this only happens in Safari.

just added a more legible color for the active state (gray-400)

@noahtallen noahtallen force-pushed the add/view-all-templates-in-dropdown branch from 5190990 to d0e77b7 Compare October 15, 2020 20:31
@noahtallen
Copy link
Member Author

updated focus to be blue

2020-10-15 13 59 34

@noahtallen noahtallen merged commit d14b01d into master Oct 15, 2020
@noahtallen noahtallen deleted the add/view-all-templates-in-dropdown branch October 15, 2020 22:01
@github-actions github-actions bot added this to the Gutenberg 9.2 milestone Oct 15, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Package] Edit Site /packages/edit-site [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Link to nav sidebar from settings dropdown

5 participants