JSFiddle - React, Tailwind, and code Playground
HTML
<div class="demo">
This is using jss javascript which allow to append css stylesheet.
Testing 123
</div>
JavaScript
/*
* JSS v0.6 - JavaScript Stylesheets
* https://github.com/Box9/jss
*
* Copyright (c) 2011, David Tang
* MIT Licensed (http://www.opensource.org/licenses/mit-license.php)
*/
var jss = (function() {
var adjSelAttrRegex = /((?:\.|#)[^\.\s#]+)((?:\.|#)[^\.\s#]+)/g;
var doubleColonPseudoElRegex = /(::)(before|after|first-line|first-letter|selection)/;
var singleColonPseudoElRegex = /([^:])(:)(before|after|first-line|first-letter|selection)/;
var singleColonForPseudoElements; // flag for older browsers
function getSelectorsAndRules(sheet) {
var rules = sheet.cssRules || sheet.rules || [];
var results = {};
for (var i = 0; i < rules.length; i++) {
// Older browsers and FF report pseudo element selectors in an outdated format
var selectorText = toDoubleColonPseudoElements(rules[i].selectorText);
if (!results[selectorText]) {
results[selectorText] = [];
}
results[selectorText].push({
sheet: sheet,
index: i,
style: rules[i].style
});
}
return results;
}
function getRules(sheet, selector) {
var rules = sheet.cssRules || sheet.rules || [];
var results = [];
// Browsers report selectors in lowercase
selector = selector.toLowerCase();
for (var i = 0; i < rules.length; i++) {
var selectorText = rules[i].selectorText;
// Note - certain rules (e.g. @rules) don't have selectorText
if (selectorText && (selectorText == selector || selectorText == swapAdjSelAttr(selector) || selectorText == swapPseudoElSyntax(selector))) {
results.push({
sheet: sheet,
index: i,
style: rules[i].style
});
}
}
return results;
}
function addRule(sheet, selector) {
var rules =...