Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Attribute fill-rule seems to be ignored #79

Closed
vitto opened this issue Mar 31, 2021 · 4 comments
Closed

Attribute fill-rule seems to be ignored #79

vitto opened this issue Mar 31, 2021 · 4 comments

Comments

@vitto
Copy link

vitto commented Mar 31, 2021

I'm trying to build a font with some svg exported from Figma, as flatten shape, when I export it from Figma it generates this svg as a terminal icon:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 4.89543 2.89543 4 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20H4C2.89543 20 2 19.1046 2 18V6ZM4 6H6V8H4V6ZM14 6H8V8H14V6ZM4 10H10V12H4V10ZM20 6H16V8H20V6Z" fill="black"/>
</svg>

When I use it to build the font, no errors are thrown, but when I try to see the icon it is show like fill-rule="evenodd" is ignored, resulting like this svg:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" d="M2 6C2 4.89543 2.89543 4 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20H4C2.89543 20 2 19.1046 2 18V6ZM4 6H6V8H4V6ZM14 6H8V8H14V6ZM4 10H10V12H4V10ZM20 6H16V8H20V6Z" fill="black"/>
</svg>

Would it be nice if this can be fixed.

It seems to be an existing problem also for other libs: nfroidure/svgicons2svgfont#62

@vitto
Copy link
Author

vitto commented Mar 31, 2021

I found a workaround from Figma for it in case someone need to fix it with Fill Rule Editor plug-in, but it would be nice if there is an automatic way to fix it.

jaywcjlove added a commit that referenced this issue Mar 31, 2021
@jaywcjlove
Copy link
Owner

@vitto Some attributes converted to font svg are lost.

@schmidt-oliver
Copy link

Hi @vitto, please try using SVGFixer to outline the icons before converting them to font. Or use a figma plugin to change the winding rule from even-odd to non-zero.

@jaywcjlove
Copy link
Owner

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants