[wp-trac] [WordPress Trac] #61571: Twenty Fifteen: Code block font family is different in iframe editor (was: Twenty Fifteen: Code block font family is different in back-end & Front-end.)

[WordPress Trac]

#61571: Twenty Fifteen: Code block font family is different in iframe editor
-------------------------------------+-----------------------------
 Reporter:  pranitdugad              |       Owner:  (none)
     Type:  defect (bug)             |      Status:  new
 Priority:  normal                   |   Milestone:  Future Release
Component:  Bundled Theme            |     Version:  6.4
 Severity:  minor                    |  Resolution:
 Keywords:  has-patch needs-testing  |     Focuses:  css
-------------------------------------+-----------------------------
Changes (by sabernhardt):

 * keywords:   => has-patch needs-testing
 * focuses:   => css
 * version:   => 6.4
 * milestone:  Awaiting Review => Future Release


Comment:

 In the iframe-based editor, WordPress 6.4 stopped adding `.editor-styles-
 wrapper` to selectors it pulled from the theme's `editor-style.css`. Then
 Twenty Fifteen's Inconsolata font in `code` element styles did not
 override `.wp-block-code code {font-family: inherit}` from `block-
 library/style.css`, which inherited `.wp-block-code {font-family:
 Menlo,Consolas,monaco,monospace}` from `block-library/theme.css`.

 [attachment:"61571.1.patch"] adds Inconsolata to the Code block (not the
 `code` element) within block editor styles. The font could be added to the
 existing ruleset instead, but I chose to target `.wp-block-code` without
 raising the specificity.

 Note: Twenty Sixteen would need a similar change in its `editor-
 blocks.css` (other themes should not need a change).

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