Yuva Theme Header colour and Image sizing

Topic summary

A user working with the Yuva theme encountered two main issues: the header background color (#055146) displayed correctly in the customizer but remained white on the live site, and a media banner image was being cropped instead of resizing properly.

Resolution provided:

  • A helper (@ThePrimeWeb) supplied custom CSS code to be added to the theme.liquid file (below the <head> tag)
  • The code fixed both the header color and image banner sizing issues
  • Header text/icons were also changed to white for better visibility against the dark green background
  • An initial code error caused the media banner to disappear completely, but was quickly corrected with updated CSS

Additional help:

  • The solution works regardless of where the media banner is placed on the page
  • Line breaks in banner text can be added using <br> tags, though theme support may vary

Open issue:
Another user reported that applying the same banner code caused buttons to appear on top of the banner instead of over it, suggesting potential compatibility concerns with different implementations.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.

Oh apologies, sure @ThePrimeWeb !

It’s not live yet, you can use the password “test” on www.schermuit.nl