kotovalexarian-likes-gitlab/gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Merge branch 'docs/fix-ux-guide-tips' into 'master'

Browse source 
Improve markdown and fix links that don't render correctly

See merge request gitlab-org/gitlab-ce!22738
This commit is contained in:
Achilleas Pipinellis 2018-11-01 10:54:45 +00:00
commit b1a03274f4
1 changed files with 7 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
doc/development/ux_guide/tips.md
View file

@ -1,20 +1,16 @@
# Tips
## Contents
* [SVGs](#svgs)
---
## SVGs
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.
1. Use pathfinder tools to combine overlapping paths and create compound paths.
1. SVGs that are limited to one color should be exported without a fill color so the color can be set using CSS.
1. 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.
You can open your svg in a text editor to ensure that it is clean.
Incorrect files will look like this:
```xml
@ -35,10 +31,10 @@ Incorrect files will look like this:
</svg>
```
Correct file will look like this:
Correct files will look like this:
```xml
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 17" enable-background="new 0 0 16 17"><path d="m15.1 1h-2.1v-1h-2v1h-6v-1h-2v1h-2.1c-.5 0-.9.5-.9 1v14c0 .6.4 1 .9 1h14.2c.5 0 .9-.4.9-1v-14c0-.5-.4-1-.9-1m-1.1 14h-12v-9h12v9m0-11h-12v-1h12v1"/><path d="m5.4 11.6l1.5 1.2c.4.3 1.1.3 1.4-.1l2.5-3c.3-.4.3-1.1-.1-1.4-.5-.4-1.1-.3-1.5.1l-1.8 2.2-.8-.6c-.4-.3-1.1-.3-1.4.2-.3.4-.3 1 .2 1.4"/></svg>
```
> TODO: Checkout [https://github.com/svg/svgo](https://github.com/svg/svgo)
> TODO: Checkout <https://github.com/svg/svgo>.