Pavliko / postcss-svg

PostCSS plug-in which to insert inline SVG to CSS and allows you to manage it colors.
http://pavliko.github.io/postcss-svg/
Creative Commons Zero v1.0 Universal
124 stars 23 forks source link

Are we reusing the inline-svg here? #18

Closed kamlekar closed 7 years ago

kamlekar commented 9 years ago

This is a question. It seems the generated css is having the same svg many times with just the fill or stroke colors differently.

I am thinking this is against the concept of reusability (that will definitely increase the css file size).

Please correct me if I am wrong.

Pavliko commented 9 years ago

Yes, but after gzip compression increasing the size of the file will not be as significant.

kamlekar commented 9 years ago

Can't say..

What if I have a requirement where the icons color changes based on the selected themes. And there are lot of themes?

I am not trying to argue with you but I think this is a not an optimized way of approaching the solution

cmnstmntmn commented 8 years ago

@kamlekar in fact you will load a single winter_theme.css or easter_theme.css; you won't make use of both at the same time.

so basicaly you have no redundancy over inline-svg code.

kamlekar commented 8 years ago

@cmnstmntmn that is fine for managing themes. but what if I have to change the same icon color to other colors on different actions like active, hover, disabled etc. ?

In such cases, here we are generating the same svg several times with different colors. My argument here is that this plugin is not reusing the SVG as we do by using inline SVG concept. and If I am right, my question is why we are doing so?

Please guide me.

jonathantneal commented 7 years ago

Inline SVG is an awesome Sassy option.

PostCSS SVG focuses on inlining the standard url() function, leveraging SVG Parameters to let you push compiled CSS variables into your SVGs, and Modules to let you reference the media or main fields from a package.json.

See example.