Header card inlines text color - why?

Developer help
1

For the love of god why is the “Header” card CSS inlining text color?
How do I make it stop?
Thank you
/m

card-inline
card-inline984×140 6.25 KB

r

2

The text color is adjusted based on the selected background color and set as part of the card data which is then rendered out as an inline style. There’s no way to make that stop with the current header card implementation.

What is the inline CSS stopping you from doing?

3

Black text over light background image, thinking either I’ll put a gradient on the image, or write a script which wipes/replaces kg-header-card-heading inline style on DOMcontent loaded - any other options?
tx /magnus

4

I’ll raise it with the team because it does seem pretty annoying that you can’t swap the dark/light text when the auto calculation for text color doesn’t pick correctly.

In the meantime you can still use CSS to adjust the color. In your post’s code injection head:

<style>
    .kg-header-card-heading {
        color: black !important;
    }
</style>
2 Likes
5

!important overrides even inline, that’s the solution, thank you.

1 Like