Card title background

[phillip-kruger]

Hi all. First - Kor is awesome ! I really love how easy I could get started. I have been playing with a few WebComponent UI libraries, and this is my favourite one by far.

I want to create a card (without a photo) where the title bar at the top has a different color. Is that possible ?
(Sorry if this is a dumb question, I am more backend dev than frontend :) )

[eduferfer]

Hi, good to know you found Kor easy to use :)

For changing the style of text in the shadow-dom, I'd recommend doing as follows:

kor-card {
   // this changes the font family, size and style
    --header-1: italic 20px/24px serif;
   // this changes the text color
    --text-1: rgba(200, 50, 100, .90);
}

[phillip-kruger]

Hi, thanks for the answer !

Is there any way to change the background color of just the header of the card ?

[eduferfer]

Hi @phillip-kruger I'm sorry for misunderstanding your question, I thought you meant the text color.

Changing the title background is currently not supported, but I'm thinking of opening up some of these configurations in all components through css variables, such as:

kor-card {
  --title-bg-color: #FFBBAA;
}

Would that help?

[phillip-kruger]

Yes for sure ! Thanks