diff --git a/content.js b/content.js index c50936da93e0a0045b3ba479939c0001ba55317b..03f93bc522e640d16047259c552bc9bd741b13fa 100644 --- a/content.js +++ b/content.js @@ -155,10 +155,15 @@ function midiEvent(type, data) { } }); if (eventIn) { - let els = document.querySelectorAll(element.element); - els.forEach(e => { - e.style[element.property] = value; - }); + if (element.pseudo) { + root.style.setProperty("--pseudo-" + element.element.replaceAll(':', '') + '-' + element.property, value); + } + else { + let els = document.querySelectorAll(element.element); + els.forEach(e => { + e.style[element.property] = value; + }); + } } }); }); @@ -466,10 +471,15 @@ function audioEvent() { } }); if (eventIn) { - let els = document.querySelectorAll(element.element); - els.forEach(e => { - e.style[element.property] = value; - }); + if (element.pseudo) { + root.style.setProperty("--pseudo-" + element.element.replaceAll(':', '') + '-' + element.property, value); + } + else { + let els = document.querySelectorAll(element.element); + els.forEach(e => { + e.style[element.property] = value; + }); + } } }); } @@ -489,12 +499,24 @@ function pureCss() { } result.all.forEach(element => { element.templates.forEach(template => { - if (template.type == 'pure') { + if (template.type == 'pure' || element.pseudo) { if (element.element.includes(':after') || element.element.includes(':before')) { - var elemDiv = document.createElement('style'); - elemDiv.innerText = element.element + '{' + element.property + ':' + element.value + ';}'; - elemDiv.className = 'CSSLSD'; - document.body.appendChild(elemDiv); + if (template.type != 'pure') { + var elemDiv = document.createElement('style'); + elemDiv.innerText = ':root { --pseudo-' + element.element.replaceAll(':', '') + '-' + element.property + ' : "";}'; + elemDiv.className = 'CSSLSD'; + document.body.appendChild(elemDiv); + var elemDiv = document.createElement('style'); + elemDiv.innerText = element.element + '{' + element.property + ': var(--pseudo-' + element.element.replaceAll(':', '') + '-' + element.property + ');}'; + elemDiv.className = 'CSSLSD'; + document.body.appendChild(elemDiv); + } + else { + var elemDiv = document.createElement('style'); + elemDiv.innerText = element.element + '{' + element.property + ':' + element.value + ';}'; + elemDiv.className = 'CSSLSD'; + document.body.appendChild(elemDiv); + } } else { let els = document.querySelectorAll(element.element); diff --git a/main.js b/main.js index 2844aee083848d779da4efe2042d340e31063d4e..b8a64ddfea62a256bc05e5abf3462b58e78436fe 100644 --- a/main.js +++ b/main.js @@ -199,7 +199,7 @@ function analyseAll() { var sheet = parser.parse(result.css, false, false); if (sheet !== null && sheet.cssRules.length > 0) { sheet.cssRules.forEach(element => { - if (element.declarations.length > 0) { + if (element !== null && element.declarations.length > 0) { element.declarations.forEach(css => { var templates = []; cssValue = css.valueText; @@ -314,6 +314,7 @@ function analyseAll() { } all.push({ element: element.mSelectorText, + pseudo: (element.mSelectorText.includes(':') ? true : false), property: css.property, value: css.valueText, templates: templates