Adding new icon options to the .json file

[danielvan]

Adding new icon names and alternatives we are providing in a future release.
Approach was to keep the icon options in alphabetical order.

Why are these changes introduced?

We want to add flexibility to merchants.

Demo store Editor

What approach did you take?

Kept alphabetical order in the .json files, which means some icons have new placements in the array.

[tyleralsbury]

I added the new icons. Two observations.

1. The new icons are approximately 21x21. This is a good size, considering the detail in the icons themselves. As a result I bumped up the size they render on the page to 2rem instead of 1.6rem. Note that I think they were intended to be 20x20, because some of them are that size, but there are also ones that are 21x20, 20x21, and 21x21. As a result, I decided to use a 21x21 viewbox for the SVG itself.
2. The older icons were less standardized in size, so some of them look a bit small. Some look okay, but some of them look like they had a 16px viewbox so they render in the top left of the new viewbox (21x21) which makes them look a bit misaligned. We may want to revisit them. Some examples:

Old Icon:

New Icon:

[tyleralsbury]

Thank you for providing each of them directly in a collapsible tab section! Very helpful 👍

Looks good to me, visually. Code looks good, at least as much as I can actually read of SVGs.

I used inspect element to check the viewbox and the positions of the icons within each viewbox looks good, and I also tested to ensure the slightly larger size didn't throw the collapsible content off, visually. Everything looks good.

[LucasLacerdaUX]

They all look good to me! Tested every icon on both sections with different color palettes and they're all ✅ :DD