Kibana [6.7.2] How to customize left navigation bar?

[swood1]

I am trying to change the color of the left nav bar in kibana 6.7.2.

I've opened up dev tools and found the class definition where the background color is applied.

I've found the _global_nav.scss file where the css is defined and edited it to a new color. When I stop and re-start the kibana server, the colour change is not respected.

I've read that you may need to delete the root/optimize folder in order to get css changes to be respected. Even when I do this the css changes are not respected.

How can I change these stylings?

Than you

[swood1]

It looks like there are several optimize folders spread out through the directory tree, not sure which is "supposed" to be deleted

[tylersmalley]

SCSS is not rebuilt in production. The best method is to create a plugin to inject your own CSS, though, I am not positive if you would be able to overwrite it depending on the loading order.

[swood1]

Thanks Tyler,

So there is no way of simple way editing any of the left navbar styles? Is this a regression? I thought this was relatively simple in previous kibana releases.

I also have replaced the files in src/ui/public/assets/favicons to update my favicons but this does not take effect. Any ideas why this is happening?

Thanks for your help

[tylersmalley]

You could try editing the CSS in /built_assets/css.

Is this a regression?

It would only be a regression if it was something which was supported. Directly editing the source of our build was nothing we have ever supported. Taking the approach you are is going to make upgrades extremely difficult for this reason.

I also have replaced the files in src/ui/public/assets/favicons to update my favicons but this does not take effect. Any ideas why this is happening?

Is it cached in your browser?

[swood1]

Hi Tyler,

Is there an alternative approach I could take which make more sense to customize the CSS a bit? Not entirely sure what all my options are. Is there a "recommended" solution?

Thanks again