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

Reddit logo is chopped off on the sides. #1

Open
TheSeamau5 opened this issue Jun 11, 2015 · 8 comments
Open

Reddit logo is chopped off on the sides. #1

TheSeamau5 opened this issue Jun 11, 2015 · 8 comments

Comments

@TheSeamau5
Copy link
Contributor

It seems that at all sizes, the reddit logo is chopped off on the sides. It is due to how the svg width and height are set. If you manually increase the width, then the logo appears whole.

@jacobstanley
Copy link
Owner

Thanks for the report, I assumed they were all the same size, I guess that's not the case

@jacobstanley
Copy link
Owner

Hmm, it's quite odd, if I check the source svg, it has the same width/height/viewBox as all the other images, namely 1792.

@jterbraak
Copy link

I believe the same thing happens with toggle_on and toggle_off. Both clipped on both sides.

@TheSeamau5
Copy link
Contributor Author

It is also the case with newspaper_o. I think the idea would be to tweak the width/height/viewBox parameters appropriately to accomodate for the weird cases. In order not to add in API complexity, rather than exposing a second paramter for width and height, you can consider the input size as a maximum. Basically, the svg icon should live in a square and the icon would be fitted to the square.

@jacobstanley
Copy link
Owner

@TheSeamau5 yeah that would be ideal, I think that the best fix would be if we can fix the svgs upstream so that they stay within their viewBox, this is the code that is generating them: https://github.com/encharm/Font-Awesome-SVG-PNG/blob/master/lib/getIconSvg.js

@Zinggi
Copy link

Zinggi commented Mar 1, 2018

Seems like this has been fixed upstream:
Rush/Font-Awesome-SVG-PNG#48

Would be nice to get an updated version 😄
(I'm using your library here, it's great)

@jacobstanley
Copy link
Owner

I recently did a a new release (https://github.com/jystic/elm-font-awesome/pull/10), give it a shot!

@Zinggi
Copy link

Zinggi commented Mar 2, 2018

We'll I'm using that version.
So it seems like This still isn't fixed.

Here is a demo of my library, which uses version 3.0.0 of your library.
As you can see, many icons are chopped off.
It looks like the path goes out of the viewBox.
By changing the viewBox parameters I can get it to center, so this seems to be possible to fix here.
It seems like you always use 0 0 512 512 as viewBox, but upstream seems to be using a variable viewBox size: https://github.com/encharm/Font-Awesome-SVG-PNG/blob/master/lib/getIconSvg.js#L56

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

4 participants