Convert menu icons from manually defined pathed svg tags, to simple png's
In the left hand navigation menu (app.component.html) and throughout the reset of the app, the graphics are written as tags with manual paths to draw the icons:
example
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24"
xml:space="preserve">
<path d="M17,12h-5v5h5V12z M16,1v2H8V1H6v2H5C3.89,3,3.01,3.9,3.01,5L3,19c0,1.1,0.89,2,2,2h14c1.1,0,2-0.9,2-2V5c0-1.1-0.9-2-2-2
h-1V1H16z M19,19H5V8h14V19z"></path>
</svg>
Now, this is really clever, because it gives really nice scaling. However, it's really hard to work with and nearly impossible to switch out icons. Our other apps use a suite of .png images with two colors, the blue and the grey, that are used to signify active/inactive entries accordingly. Is it possibel for us to switch out these svg tags for simple img tags? If so, can we have the img switch from the grey to the blue when an option is selected? I'd like to reuse as many assets as we can between apps, and this is one of the last holdouts. It's pretty prevalent in the app that these manual svg's are used