search

gavinmcfarland / flex-gap-polyfill

A PostCSS plugin to emulate flex gap using margins
https://gavinmcfarland.github.io/flex-gap-polyfill/
Creative Commons Zero v1.0 Universal
147 stars 6 forks source link

This seems to break my @import at the top of the file. Am I missing anything? #38

Closed xdivby0 closed 3 years ago

xdivby0 commented 3 years ago

I have a css file that looks similar to this:

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Jost:wght@400;600;700&family=Roboto+Slab:wght@400;700&display=swap');

// actual css below here

Adding the flex-gap-polyfill postcss plugin breaks this import. I am not 100% sure this root-rule prepending is causing this break but I think so. Am I missing anything?

gavinmcfarland commented 3 years ago

Ah it could be, because it adds a :root rule at the top of the file. I might just need to check for any imports and add the rule after those. Thanks for flagging this.

xdivby0 commented 3 years ago

You are welcome, thank you for doing this project! If I can help or should retest with a different version, hit me up :)

gavinmcfarland commented 3 years ago

Hi @xdivby0 I've just submitted a fix for this. It will now only append the :root rule after @import rules. This assumes all import rules are at the top of the file. You can try it out by installing the latest version. If you use postcss-import it might also be a good idea to put this before flex-gap-polyfill in your list of PostCSS plugins.