[wp-trac] [WordPress Trac] #64166: Twenty Twenty: Update theme to add Gutenberg styles and support

[WordPress Trac]

#64166: Twenty Twenty: Update theme to add Gutenberg styles and support
---------------------------+-------------------------------
 Reporter:  westonruter    |       Owner:  westonruter
     Type:  defect (bug)   |      Status:  assigned
 Priority:  normal         |   Milestone:  6.9
Component:  Bundled Theme  |     Version:  5.3
 Severity:  normal         |  Resolution:
 Keywords:                 |     Focuses:  css, performance
---------------------------+-------------------------------
Changes (by westonruter):

 * keywords:  close =>


Comment:

 @sabernhardt Yes, I can see a styling impact with this, for example on the
 Sample Page the quote blocks render differently.

 Diffs of the Sample Page HTML on `6.8` and `trunk` with and without `wp-
 block-styles` theme support:
 https://gist.github.com/westonruter/0a4b7a2d8560a3391f4e1eaf07d2dc4f

 The problem is that `wp-block-styles` apparently is not ''only'' used as a
 signal for whether opinionated block styles are added. In particular,
 `register_block_type_from_metadata()` will only register block-specific
 stylesheets when that theme support is present:

 {{{#!php
 <?php
 if ( current_theme_supports( 'wp-block-styles' ) &&
 wp_should_load_separate_core_block_assets() ) {
         $metadata['style']   = (array) $metadata['style'];
         $metadata['style'][] = "wp-block-{$block_name}-theme";
 }
 }}}

 With #64099, classic themes are automatically opted-in to
 `should_load_separate_core_block_assets`. But without `wp-block-styles`
 then this benefit is lost for Twenty Twenty due to the above logic. When
 that theme support is present, however, the amount of CSS added to the
 Sample Page page is drastically reduced from 270KB to 136KB, almost a 50%
 reduction!

 I want to find some way to make this work.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/64166#comment:2>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform