[wp-trac] [WordPress Trac] #62781: Twenty Twenty: Inconsistent caption styles between editor and front-end in Calendar block

[WordPress Trac]

#62781: Twenty Twenty: Inconsistent caption styles between editor and front-end in
Calendar block
-------------------------------------------------+-------------------------
 Reporter:  sukhendu2002                         |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  Awaiting
                                                 |  Review
Component:  Bundled Theme                        |     Version:
 Severity:  minor                                |  Resolution:
 Keywords:  has-screenshots has-patch needs-     |     Focuses:  css
  testing changes-requested                      |
-------------------------------------------------+-------------------------
Changes (by sabernhardt):

 * focuses:   => css


Comment:

 PR 8110 would inherit the block's custom `font-weight`, but is `inherit`
 the best choice?

 1. I think `inherit` would make the caption unexpectedly thin if someone
 selects an Appearance option of Regular `400` or lighter (with or without
 Italic).
 2. The `block-library` styles set header cells to `400`, and their weight
 does not change with the block setting.
 3. For a [https://developer.mozilla.org/en-US/docs/Web/CSS/font-
 weight#meaning_of_relative_weights relative value], the style override
 could use `bolder` on the caption. I think it could be better in some
 cases, but then selecting Semi Bold `600` would give the caption a weight
 of `900` (which is likely the most surprising result in this context).
 4. If neither `inherit` nor `bolder` would fit all selections well enough,
 should the caption and/or header cells inherit the custom weight //only//
 when the block text is thicker than `600`?
 {{{
 .wp-block-calendar:where(
         [style*="font-weight:700"],
         [style*="font-weight:800"],
         [style*="font-weight:900"],
         [style*="font-weight:1000"],
         ) :is(caption, th) {
         font-weight: inherit;
 }
 }}}

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