The Header and Footer shared some duplicated code related to external
links. We moved the markup and CSS into a separate Links component to
DRY it up.
We currently apply a 'line-through' style to the Figma links, since they
are not yet implemented. This is a visual treatment only an needs fixed
before production release!
The Notice component can now act as a general indicator component,
exposing four types: "wait", "help", "warn", or "none". These types
display different icons and make this a much more reusable element.
We also render children passed to us, making this even more extendable.
In future, we may wish to extract all message props altogether as
children instead.
This patch reworks the mobile breakpoint to allow whitespace wrapping of
code snippets and does away with horizontal scroll. Overall, the
usability and intuitiveness is much better, though readability of the
code itself takes a hit.
In addition, we added the ability to download an icon as a PNG thanks to
the svg2png-converter library. PNGs adopt the current preview weight and
color, and are sized at 256x256.
