Header icon invisible after upgrade

The same header icon as before:

This time upgrade from 2.0.0 to v2.3.0.beta2 +206

Resulted: icon is still the right size and highlights properly, but the lightning is not visible anymore. I wonder what happened here?

Can be the reason in this?


This is very likely. I will proceed with testing…

I used this as a guide and managed to fix it: Introducing Font Awesome 5 and SVG icons (Also added fa-bolt to settings…)

Now I’m pondering how to change colour of the top buttons…


You need to target the SVG element and apply color to it using CSS.

1 Like

I’m already getting a colour change by changing the colour scheme of the entire site. However, if I set the color of the top texts and icons to ffffff, they appear grey; if efffff, they appear quite blue…

weird colours.pdf (1.1 MB)

By default we adjust the colors to reduce contrast against the background. You can override this behavior with CSS (add to admin > customize > themes > edit html/css > common).

ul.d-header-icons .d-icon {
   color: #fff;

Thank you, it worked like a charm!

All header problems fixed! :slight_smile:

1 Like

(switched this to a brand new topic)