Move icon docs from the pattern library to the contribution guidelines
These guidelines are currently in the “Getting Started: Icons” page of the pattern library. These should be moved to a markdown file, like we've done for symbol-specific guidelines: https://gitlab.com/gitlab-org/gitlab-design/blob/master/doc/pattern-library.md#symbols
This is documentation specific to building the icons, not about using them. Usage guidelines are tackled by https://gitlab.com/gitlab-org/design.gitlab.com/merge_requests/60 and included in the Design System.
Other information, originally included in https://gitlab.com/gitlab-org/design.gitlab.com/merge_requests/60:
Follow these guidelines when developing icons:
- Icons should be simple and use as few points as possible. The default bounding box size of icons is **16x16px**. Inside of that bounding box, some icons are larger, others are smaller, depending on their design.
- Todo: Add do/don't examples
- Use whole pixels to create icons in order to align properly to a pixel grid.
- Todo: Add do/don't examples
- Use rounded strokes.
- Todo: Add do/don't examples
- Simplify icons for clarity and legibility.
- Todo: Add do/don't examples
- Make the icons front-face instead of different dimensions.
- Todo: Add do/don't examples
…
* Border thickness: 2px
* Border radius: 3px
Exporting icons as SVG
----------------------
When exporting SVGs, be sure to follow the following guidelines:
1. Convert all strokes to outlines.
2. Use pathfinder tools to combine overlapping paths and create compound paths.
3. SVGs that are limited to one color should be exported without a fill color so the color can be set using CSS.
4. Ensure that exported SVGs have been run through an [SVG cleaner](https://github.com/RazrFalcon/SVGCleaner) to remove unused elements and attributes.
You can open your svg in a text editor to ensure that it is clean. Incorrect files will look like this:
Todo: Add SVG code example
Correct file will look like this:
Todo: Add SVG code example