[wp-trac] [WordPress Trac] #59922: Twenty Nineteen is using CSS selectors that are no longer used in the editor

[WordPress Trac]

#59922: Twenty Nineteen is using CSS selectors that are no longer used in the
editor
-------------------------------------+-----------------------------
 Reporter:  poena                    |       Owner:  SergeyBiryukov
     Type:  defect (bug)             |      Status:  reopened
 Priority:  normal                   |   Milestone:  6.5
Component:  Bundled Theme            |     Version:
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch needs-testing  |     Focuses:  css
-------------------------------------+-----------------------------

Comment (by poena):

 It is complicated by the changes to the editor in different versions.
 It is tricky to find in what WP version the blocks themselves have been
 introduced and changed.

 The space is meant for the WP versions before 5.8 where wp-block and wp-
 block-name classes are on different elements.
 The wp-block class is used to increase the specificity enough to override
 the default styles.
 It results in some duplication but I don't know which selectors would be
 better.

 >Should there always be a space after .wp-block or not?
 So the answer is, if we are using this selector, we need both.

 This is all the testing I am able to do today.


 # File block
 Before 5.8, the file block link is not a link element, so the general link
 styles are not applied.
 The class name for the link was .wp-block-file__textlink, and it was
 removed in 5.8.
 The color is decided by .editor-styles-wrapper .wp-block .wp-block-file
 .wp-block-file__textlink
 The :hover, which does not have a space, isn't working and should be
 updated.
 .editor-styles-wrapper .wp-block.wp-block-file .wp-block-
 file__textlink:hover
 should have been:
 .editor-styles-wrapper .wp-block .wp-block-file .wp-block-
 file__textlink:hover

 The file block button background color is not working, because
 .editor-styles-wrapper .wp-block.wp-block-file .wp-block-file__button
 needs to be duplicated and a space added:
 .editor-styles-wrapper .wp-block .wp-block-file .wp-block-file__button

 In later versions:
 - The file block link color is decided by the general link colors.
 - The file block button background color is decided by
 .editor-styles-wrapper .wp-block.wp-block-file .wp-block-file__button
 - The wp-block and wp-block-file classes are on the same element.

 # Pullquote block

 The CSS only applies to the solid color block variation.
 This variation was added in 5.1 and removed in Gutenberg version 11.2,
 which would mean 5.9.
 It needs to have the selectors with and without the space,
 for any sites that added the style variation when it was available.

 # Classic editor quote
 The border color does not work for 5.8+ because the selector without the
 space is missing.

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