posthtml-inline-css
posthtml-inline-css copied to clipboard
posthtml
Remove unnecessary CSS and class names
Before:
<head>
<style>
body{color:silver}
.class1{color:red}
.class1:hover{color:blue !important}
.class2{color:purple}
</style>
</head>
<body>
<a class="class1"></a>
<a class="class2"></a>
</body>
After:
<head>
<style>
.class1:hover{color:blue !important}
</style>
</head>
<body style="color:silver">
<a class="class1" style="color:red"></a>
<a style="color:purple"></a>
</body>
styliner does this, and juice sort of does.
I've started working on it from scratch, borrowing ideas from posthtml-inline-css - see here:
https://github.com/cossssmin/posthtml-postcss-inline
Regarding this:
posthtml-email-remove-unused-css may help with this.
It's no longer available and its successor, email-comb, doesn't work that way - it needs to see the selector missing from one place to remove it from the other.
What I've done is to introduce an option that will remove each successfully-inlined selector - currently works for the <style> tag, but will try to expand it to the corresponding HTML elements.
If anyone wants to help work on this just let me know, I'd also be happy to merge it back here so we don't publish multiple plugins that solve the same problem 👍
