Revising the default CSS files

[RobSmith]

I'm new to Oxygen and CSS. I'm running Oxygen Author 26.1 build 2024091606.
I create a Webhelp HTML using the 'Project to WebHelp Responsive" transformation.
Looking at the output, the background color of the Navigation bar is controlled by a section of oxygen.css (in class .wh_header).in my project's "/out/webhelp-responsive/oxygen-webhelp/template/" folder.

My question, as a starting point to learning more - where or what do I edit or create in order to have the background color of that Navigation bar stay at a value of my own choosing?

I tried to associate a CSS file to the project's ditamap file and made sure that it contained a class definition for .wh_header, but it is not having the effect I hoped it would.

I have not yet touched anything to do with templates - because that subject is beyond 'new' to me.

Also note that if I perform a search for Unreferenced resources, the css file I created and associated to my ditamap is at the top of the list.

Can I get a hint, please?

Thanks

[ionela]

Hi,

Thank you for your feedback.

The customization of the WebHelp output is usually developed using publishing templates. A visual customization tool that can be used to style the WebHelp output is the Oxygen styles basket.
Also, a very good starting point to find out more about the customization of the WebHelp out is this webinar from our website:
Techniques for Customizing the WebHelp Responsive Output

I hope this helps.

Regards,
Ionela

[RobSmith]

Thank you, Ionela.

For others looking at this thread, I was also pointed to the "Oxygen XML WebHelp Responsive" HTML document on the Documentation page (https://www.oxygenxml.com/documentation.html). In that document/page there is an AI assistant that will respond to written queries.