[wp-trac] [WordPress Trac] #45672: Bundled themes and Gutenberg: Lists styling mismatch in the editor and front end

[WordPress Trac]

#45672: Bundled themes and Gutenberg: Lists styling mismatch in the editor and
front end
-----------------------------------------+-----------------------------
 Reporter:  afercia                      |       Owner:  (none)
     Type:  defect (bug)                 |      Status:  new
 Priority:  normal                       |   Milestone:  Future Release
Component:  Bundled Theme                |     Version:  5.0
 Severity:  normal                       |  Resolution:
 Keywords:  has-screenshots needs-patch  |     Focuses:
-----------------------------------------+-----------------------------
Changes (by laurelfulford):

 * keywords:  has-screenshots => has-screenshots needs-patch
 * milestone:  Awaiting Review => Future Release


Comment:

 Thanks for the report, @afercia!

 I agree that this can be improved in these themes, though it might take
 some investigating/testing to figure out the best place to fix each issue.

 For example, in Twenty Nineteen's case, it does have the correct indent
 set in its editor style, but the editor itself is using more specific
 selectors to add its own:

 https://github.com/WordPress/gutenberg/blob/master/packages/block-
 library/src/list/editor.scss

 I'm not sure how easy that would be to change Gutenberg — it may be tough
 to make that selector less specific and still make sure the lists in the
 editor's content aren't inheriting styles from other lists in Gutenberg's
 interface. It’s worth digging into on that side first, though!

 On the flip side, Twenty Twelve is the only theme inheriting Gutenberg’s
 nested list styles:
 https://github.com/WordPress/gutenberg/blob/master/packages/editor/src
 /editor-styles.scss#L32-L35

 This ''seems'' like it would be easier to change in Gutenberg, but again,
 investigation might prove me wrong!

 In the case of themes that don’t outdent lists properly (Twenties
 Seventeen, Sixteen and Fifteen) -- that one is on me. I know for certain I
 didn’t attempt this, instead opting to follow what the classic editor
 displayed. This was because I was a little paranoid about causing issues
 by pushing elements outside of the editable space. Being more comfortable
 styling the editor now, I think it should be doable, and would be a nice
 touch!

 This could be a bit of a messy one -- I think a good first step, before
 trying to patch anything, would be to put together a list of exactly what
 needs to be fixed in each theme, and where.

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