chore(icons): replace badges.svg with icon classes

[danielhjacobs]

Summary

Fixes the remainder of number 3 (deprecated icon is different in badges.svg) from #5571 and just seems nicer

Also fix #5844

Problem

Stop using badges.svg.

Solution

Uses the same type of code used for the BCD

---

Screenshots

Before

After

[danielhjacobs]

The test needed to use the selector svg, abbr. This is because it tested items marked as obsolete, which would still have the svg tag, not the abbr tag, even after these changes. That test could probably be changed to remove obsolete, since it should no longer be in use, however, I didn't want to change the existing test functionality beyond what I needed to change without waiting for feedback.

[danielhjacobs]

Side Note: I got side tracked. I manually looked at every result from https://github.com/mdn/content/search?q=obsolete. https://developer.mozilla.org/en-US/docs/Web/API/RTCDataChannel#obsolete_properties and https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection#obsolete_events are the only pages out of those still using the obsolete icon (rather than just the word obsolete).

[caugner]

I will have to check internally if there is consensus for removing the color of those icons, but the changes themselves make sense. Thanks!

[danielhjacobs]

Misclicked and ended up requesting a review closing and reopening.

[danielhjacobs]

I added the colors back until a decision is reached, which should make this mergeable before then. To remove color from the sidebar, these lines should be removed:

yari/client/src/document/organisms/sidebar/index.scss

Lines 179 to 187 in 6e13bf8

	/* icons in sidebars */
	.icon-experimental,
	.icon-nonstandard {
	background-color: var(--icon-information);
	}
	.icon-deprecated {
	background-color: var(--icon-critical);
	}

[danielhjacobs]

Added a commit to fix #5844.

[caugner]

LGTM, but I will request a 2nd review from a peer

[caugner]

@schalkneethling This looks good to me, but maybe we can even remove the badge.svg, since it's no longer referenced anywhere (as far as VSCode search tells)?

[danielhjacobs]

maybe we can even remove the badge[s].svg

I thought the same, but was just worried I may have missed something. I can remove it if we're sure it's now un-used.

[schalkneethling]

Hey @danielhjacobs and @caugner. I will take a look at this one today. Thanks for the ping.

[schalkneethling]

Apologies for taking so long to get back to you. This looks good to me. Thanks @danielhjacobs 🎉