XF 2.2 Custom dark style for bbTable <th> elements

[Slion]

Is there a way to change background color of bbTable <th> without doing CSS?
I've designed a dark theme but my table headers are showing white.

 

[Paul B]

It will require custom CSS in the extra.less template.

 

[Slion]

That's weird, somehow an older version of those could get it done. Then again maybe they do use extra.less somehow.

 

[Slion]

I checked again @Jordyn styles and somehow he does manage the change the bbTable <th> color without CSS.
@Jordyn Is there any chance you could share your trick?

 

[Slion]

Ok, it's simply using paletteColor1 which is a bummer... ho well. Though maybe it's using it indirectly?

 

[Slion]

So I guess the solution when designing a dark theme and avoid having to use CSS is to make sure you reverse the color palette to prevent those issues. paletteColor1 should be the darkest and paletteColor5 the lightest. Same for accent and neutral colors.
Then you redefine basic colors as needed from your palette colors mostly swapping the 5s with 1s and 4s with 2s.
All other style properties group should be using basic colors rather than palette colors, just fix those that don't.

This should make sure the rare cases where color palette usage is hard coded should still remain readable. It also helps keeping you sane while designing your style

If you want to customise the table itself I guess you should look at add-ons overriding default TABLE bbCode. I didn't look into it though and that's off topic here.

 

[Jordyn]

I checked again @Jordyn styles and somehow he does manage the change the bbTable <th> color without CSS.
@Jordyn Is there any chance you could share your trick?

Sorry mate, i haven't been online much. Little busy at the moment.

Oh and its certainly not fun making a style without the use of style css lol.

Sorry for the late reply.

In Style properties, I think i removed "@xf-contentBg" from BB code blocks background and "@xf-subNavBg" from Sub-navigation row background adding my own color code.

After that, in Basic colors>>Alternate content background color, i just removed "xf-intensify(@xf-contentBg, 3.5%)" again adding my own color code.

Unfortunately, changing Alternate content background color also changes the bbcode header color to. So some fine tuning needs to be done without the use of style css.

I think i also found a bug switching Style type to dark in Color palette. That is why i used Light at the time.

Good luck mate.

 

[Slion]

I think i also found a bug switching Style type to dark in Color palette. That is why i used Light at the time.

I kept that one on light as well. My understanding is that it reverses the behaviour of xf-intensify and xf-diminish macros and that made the style look weird.

 

[Jordyn]

I kept that one on light as well. My understanding is that it reverses the behaviour of xf-intensify and xf-diminish macros and that made the style look weird.

Yeah that's probably it mate for sure. All the best with your style.

 

[Slion]

BB table border color is derived from paletteNeutral1 and made darker for light themes and probably lighter for dark themes.