Stop using data: URIs for icons and other graphics

[lol768]

PR #20329 introduced a data:image/svg+xml background:

https://github.com/patrickhlauke/bootstrap/blob/d125860464d2a47f957193440097b502acf95832/scss/_navbar.scss#L107-L114

This requires whitelisting data: as an content security policy img-src. The MDN guide says this about the data: source:

Allows data: URIs to be used as a content source. This is insecure; an attacker can also inject arbitrary data: URIs. Use this sparingly and definitely not for scripts.

Whilst this doesn't present an immediate XSS risk as far as I know, it's less than ideal that using Bootstrap effectively forces you to whitelist this source if you want e.g. the responsive navbar to work.

This would be better implemented as a separate image file, which would have the added benefit of being cached even if the cached CSS was invalidated. With most clients supporting HTTP/2.0 there's not going to be a need to open a new TCP connection.

---

For local projects, I've 'fixed' this by overriding the background-image property and referencing an actual svg file.

[XhmikosR]

I doubt we'll change this. I totally understand your point of view, but the extra file is a lot more troublesome than some of the users having to whitelist this.