JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://www.glazman.org/JSCSSP/cssParser.js"></script>
<textarea style="width: 100%" rows="15" id="source" spellcheck="false">/* JSCSSP test */
@variables screen { myMargin: 10px }
@keyframes my_anim { from { opacity: 1; } to { opacity: 0; } }
h1 {
margin-top: var(myMargin);
margin-right: var(myMargin);
background-image: -moz-linear-gradient(90deg, white, #c0c0c0);
}
/* shorthands */
#myP {
border: thin groove silver;
}
/* escapes */
.f\00C4 oo { p\roperty: value; content: "foo \
bar" }
</textarea>
JavaScript
var source = document.getElementById("source");
ss = source.value;
var parser = new CSSParser();
var sheet = parser.parse(ss, false, true);
console.log(sheet);