Change header background colour and navigation bar background colour

joomlafuture

I would like to change header background colour to white and navigation bar background to the theme primary colour.

Would it be possible to do this through the T4 Framework Theme Colour and Palettes? I couldn't find anything to change the Main Menu background colour, for instance. Only text and link colours.

The documentation for the template doesn't mention how one would do this.

I tried creating new Theme Colours and Palettes and assigning them through Layout Settings, but encountered a few bugs.

Otherwise I assume I'd have to do it with custom CSS/overrides?

For example, for the header

.header-top {
  background-color: var(--color-primary);
}

change to:

.header-top {
  background-color: #fff;
}

And for the menu/navigation:

.t4-header-height {
  background-color: var(--color-primary);
}

Please advise.

saguaros

joomlafuture

Hello,

The background color is determined by the template's style rather than the palette.

You can override it with the following code:

#t4-header .header-top {
    background-color: unset !important;
}

#t4-header .t4-header-height {
    background-color: var(--color-primary);
}

Additionally, you may need to adjust the text color in this header section, as it may blend with the background after applying the above changes.