[wp-trac] [WordPress Trac] #50304: Twenty Twenty: Text in Verse Block in the block editor is too dark to see against a dark page background (was: Twenty Twenty theme: Text in Verse Block in the block editor is too dark to see against a dark page background)

[WordPress Trac]

#50304: Twenty Twenty: Text in Verse Block in the block editor is too dark to see
against a dark page background
-------------------------------------------+------------------------------
 Reporter:  pauljacobson                   |       Owner:  (none)
     Type:  defect (bug)                   |      Status:  new
 Priority:  normal                         |   Milestone:  Awaiting Review
Component:  Bundled Theme                  |     Version:  5.4.1
 Severity:  normal                         |  Resolution:
 Keywords:  has-screenshots needs-testing  |     Focuses:  ui, css
-------------------------------------------+------------------------------
Changes (by sabernhardt):

 * keywords:  has-screenshots => has-screenshots needs-testing
 * focuses:  ui => ui, css


Old description:

> The color of text in a Verse Block is dark, and when used on a site with
> the Twenty Twenty theme, and where the site's background is set to a dark
> color, it's not possible to see the text in the block editor.
>
> #### Steps to reproduce
>
> 1. Activated Twenty Twenty on a test site on WordPress.com
> 2. Changed the site background (main content and header/footer) to black
> in Colors in the Customizer
> 3. Created a new post in the block editor, and added a Verse Block
> 4. Added text to the Verse Block (pasted from an external source, no
> external/inline styling was added to the pasted text).
>
> #### What I expected
>
> Verse Block text should adapt to the dark background like text in other
> blocks, like a Paragraph Block.
>
> #### What happened instead
>
> Instead, the text in the Verse Block is almost impossible to see because
> it's dark text against a dark background.
>
> #### Browser / OS version
>
> Firefox Developer Edition v77b, macOS 10.15.5 (not sure what the user who
> reported this issue is using)
>
> #### Screenshot / Video
>
> https://d.pr/i/dOYOBN/qWszm6Wi9y
> https://d.pr/i/luTBOl/5MIvbyOEBE
> https://d.pr/i/iq2G6M/7TtwenDVkH
>
> #### Context / Source
>
> User report on WordPress.com (3022847-zen)

New description:

 The color of text in a Verse Block is dark, and when used on a site with
 the Twenty Twenty theme, and where the site's background is set to a dark
 color, it's not possible to see the text in the block editor.

 ==== Steps to reproduce

 1. Activated Twenty Twenty on a test site on WordPress.com
 2. Changed the site background (main content and header/footer) to black
 in Colors in the Customizer
 3. Created a new post in the block editor, and added a Verse Block
 4. Added text to the Verse Block (pasted from an external source, no
 external/inline styling was added to the pasted text).

 ==== What I expected

 Verse Block text should adapt to the dark background like text in other
 blocks, like a Paragraph Block.

 ==== What happened instead

 Instead, the text in the Verse Block is almost impossible to see because
 it's dark text against a dark background.

 ==== Browser / OS version

 Firefox Developer Edition v77b, macOS 10.15.5 (not sure what the user who
 reported this issue is using)

 ==== Screenshot / Video

 https://d.pr/i/dOYOBN/qWszm6Wi9y
 https://d.pr/i/luTBOl/5MIvbyOEBE
 https://d.pr/i/iq2G6M/7TtwenDVkH

 ==== Context / Source

 User report on WordPress.com (3022847-zen)

--

Comment:

 Thanks for the ticket and sorry for the delayed response!

 The Verse block had specified a dark text color within the editor before
 WordPress 5.8 (GB27736):
 {{{
 pre.wp-block-verse {
         color: $gray-900;
 }
 }}}

 I did not experience the dark text on the front end, even with an older
 WordPress version, so I think we can call this fixed.

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