Join GitHub today
GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together.Sign up
CSS Paker: block padding and grouping #147
Firstly, thanks for making this great tool!
This is kinda a request for either some new functionality or possibly a new extensibility point. Its a bit long, so bear with me!
For context, we are using the tool to generate CSS using the packed layout and a svg sprite sheet. It works well. :)
But we have some sprites that represent different states of an icon (i.e. a
This is not a SVG specific problem ... it happens with raster sprite sheets too and has been happening for a long time ... because browsers all do different sub-pixel rounding for the sprite's starting screen coordinates when you zoom in/out (note that it does not happen AFAICT if you zoom via touch though)
Anyways, to mitigate this (to some degree) we monkey patched two changes into the
I'd like to see if you are open to adding this functionality into the tool itself or if we could get an extension point (i.e. pass a function in somewhere) so we could get rid of the monkey patching.
(That said, thank you for designing the code in a way where we at least have the possibility to monkey patch it and get something working!)
The Monkey Patching
The two changes we are patching into packer.js are both in the
These seemed to help mitigate the problem to a large degree. We also customized the css template to use position.absolute.px instead of position.relative.xy and that helped as well.
Here the actual change we made, which may be more useful than my explanation
Hey @aarondail, I finally found the time to dive into your issue — thanks a lot for this awesome submission. I really learnt a lot reading your code! :)
I'm currently doing some house cleaning with svg-sprite and will deal with the more fundamental issues first (like updating dependencies), but I'll definitely keep thinking about your proposal. In the meantime, could you please have a look at #142 and tell me if you see any relationship between these issues? Thanks!
But as it happens, I also wanted to use absolute pixel coordinates in my sprite sheet so I customized the default template to do that. FWIW, using absolute pixel coordinates seems to also help with the same problem I opened this ticket for (emphasis on "seems to").