Try our conversational search powered by Generative AI!

Convert quicknav-arrow.png to a SVG


The RenderEPiServerQuickNavigator() function generates a link to the CSS stylesheet /Util/styles/quicknavigator.css (example)

The #epi-quickNavigator .epi-quickNavigator-dropdown-arrow selector uses a PNG as a background, which is 15kb.  An SVG equivalent would be much smaller, for example the bootstrap Chevron down icon is 290 bytes ( 

While not huge in the first place, to not seem obsessive: this Lighthouse message motivated me to look into it:

The SVG format is an easy replacement.  I did this to override the style:

#epi-quickNavigator .epi-quickNavigator-dropdown-arrow {
	background-image: url(/Static/img/quicknav-arrow.svg);

Wouldn't be a bad thing to get switched on the official package.

Dec 28, 2021 18:08
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.