Ensure icon size classes are not purged

[obulat]

Problem

The icon sizes in VIcon component are set using dynamically-generated Tailwind classnames:

openverse-frontend/src/components/VIcon/VIcon.vue

Lines 2 to 8 in df42a22

	<svg
	class="v-icon"
	:class="`w-${size} h-${size}`"
	xmlns="http://www.w3.org/2000/svg"
	:viewBox="viewBox"
	aria-hidden="true"
	focusable="false"

In production, unused class names are purged, which might cause the icon size to not work correctly.

Description

We should add the commonly-used icon class names to the safelist in tailwind config so that they are never purged.

Alternatives

An alternative could be to apply fully-qualified class names conditionally (ie `:class="size === 4 ? 'w-4 h-4' : 'w-5 h-5'"). But this would be more difficult to adjust if the sizes change, and it would be more difficult to accommodate more that 2 sizes.

Additional context

Implementation

• 🙋 I would be interested in implementing this feature.