[wp-trac] [WordPress Trac] #58169: Twenty Nineteen: Quote block having issue when font-size is selected

[WordPress Trac]

#58169: Twenty Nineteen: Quote block having issue when font-size is selected
----------------------------------------------+---------------------
 Reporter:  nidhidhandhukiya                  |       Owner:  (none)
     Type:  defect (bug)                      |      Status:  new
 Priority:  normal                            |   Milestone:  6.3
Component:  Bundled Theme                     |     Version:  6.2
 Severity:  normal                            |  Resolution:
 Keywords:  has-testing-info has-screenshots  |     Focuses:
----------------------------------------------+---------------------

Comment (by sabernhardt):

 Changing the editor styles to match the front can be trickier because the
 `rem` value is not the same. Twenty Nineteen sets the `html` to `22px`
 ([https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentynineteen/style.css?rev=55476#L2215 line 2215 in the
 stylesheet] or `$font__size_base` in the
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentynineteen/sass/typography/_typography.scss typography
 partial]), but the editor uses the browser default (usually `16px`).

 It may be good enough to multiply by 1.375 in
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 content/themes/twentynineteen/style-editor.scss?rev=54106#L446 the editor
 styles].
 {{{
         cite,
         footer,
         .wp-block-quote__citation {
                 @include font-family( $font__heading );
                 font-size: calc(1rem * 1.375 / (1.25 * 1.125));
                 line-height: 1.6;
                 color: inherit;
         }
 }}}

 However, I suggest editing the front end to use `em` measurements instead.
 That way, any custom font sizing for the block would affect the citation
 text.

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