Headings inside custom block appear white in editor

  • Using version 1.31.9, headings inside of my custom block (which has the ‘has-background-color’ class, yet no explicit background color) appear white. I believe the cause is this CSS:

    .has-background-color {
  color:var(--wp--preset--color--background,#fff)!important;
}

    I think there is an error here, as the color and not the background color is being set?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Munir Kamal

    (@munirkamal)

    Can you please provide the page URL? Are you sure this CSS is coming from this plug-in?

    Thread Starter stevygee1987

    (@stevygee1987)

    Yes, the CSS above is from this file:
    /wp-content/plugins/block-options/extendify-sdk/public/build/extendify-utilities.css?ver=13.1

    The issue only appears in the backend (editor), not the frontend. To reproduce, using Twenty Twenty One and the latest plugin version 1.32.1:

    1. Add a Group block
    2. Put “has-background-color” into Additional CSS classes
    3. Add a Heading block into the Group block
    The heading text is now invisible.

    The issue seems to have been introduced in 1.31.8 and upwards. It does not appear using 1.31.7.

    Hey @stevygee1987 — I’m looking into this. What value is your existing .has-background-color class applying to the headings?

    It’s a tad confusing, but the .has-background-color is actually applying the site’s background colorPalette color, as the text color in this class — not the background color.

    Thread Starter stevygee1987

    (@stevygee1987)

    Thanks for taking a look!
    I actually tested this on WP 5.8.2 with the Twenty Twenty One theme without any other plugins active. So there is no custom styling from me on the Heading or the Group.
    It seems like the problem only occurs whenever the .has-background-color is set but no actual background color is chosen. That class is usually only set in combination with a color, which might make this an edge case.
    Still, I feel like this class shouldn’t affect the text color by default.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Headings inside custom block appear white in editor’ is closed to new replies.