Add icon buttons

[tinykite]

What this does

• Adds a new component, IconButton for use with many of the standalone icon buttons throughout Perma:

• Adds a new css class, c-button--icon to style them.

Notes

A small handful of the icons used on the Perma Dashboard are from Font Awesome. Others don't appear to be — for example, the Perma dashboard licenses Font Awesome 3.0.2, which includes a much chunkier chevron style than the one featured throughout the dashboard.

This component intends to make it easy to use:

• Font Awesome icons (which rely on an icon font)
• New, svg versions of the 18x9px up and down chevrons. These should resize gracefully, and can be stylized however we need, as an improvement on the original base-64 encoded png in use.

Linear Issue

Satisfies LIL-2312

Screenshot

How to test

• To test this out, you'll need to enable both the vue-dashboard and developer-playground Django flags
• Once both flags are enabled (either through a query parameter or through the Django admin) you should be able to see several buttons just above the GUI developer playground editing UI.
• Clicking any of the buttons should console.log the name of each button.

[tinykite]

I didn't include "search" as one of the icon options here because it differs in more than a couple of ways in use from these other icons — it's a smaller size, etc.

It should be easy to add it (and any others) in if we decide to reuse the IconButton component within the search functionality on the page.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 69.03%. Comparing base (1dbeec8) to head (8b14ea6).
Report is 26 commits behind head on develop.

Additional details and impacted files

@@           Coverage Diff            @@
##           develop    #3589   +/-   ##
========================================
  Coverage    69.03%   69.03%           
========================================
  Files           48       48           
  Lines         6978     6978           
========================================
  Hits          4817     4817           
  Misses        2161     2161           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[cmsetzer]

Good idea to abstract this into a component!