diff --git a/html_resources/main.css b/html_resources/main.css
index d7b451c..8cb6de0 100644
--- a/html_resources/main.css
+++ b/html_resources/main.css
@@ -93,7 +93,7 @@ pre > div{
.comment{ color: rgb(50,180,90) }
.selector{ color: silver }
-.pseudo{ color: silver }
+.pseudo{ color: violet }
.id{ color: rgb(240, 148, 138) }
.class{ color: skyblue }
.attribute{ color: rgb(120,230,170) }
diff --git a/html_resources/selector.js b/html_resources/selector.js
index fddfdf8..ba9daa5 100644
--- a/html_resources/selector.js
+++ b/html_resources/selector.js
@@ -266,7 +266,16 @@ const Highlighter = new(function(){
clearCodeBlock();
let node = document.createElement("div");
-
+
+ function createNewRuleset(){
+ let ruleset = document.createElement("span");
+ ruleset.className = "ruleset";
+ node.appendChild(ruleset);
+ return ruleset
+ }
+
+ let rulesetUnderConstruction = createNewRuleset();
+
function createElementFromToken(type,c){
if(token.length === 0 && !c){
return
@@ -275,6 +284,8 @@ const Highlighter = new(function(){
switch(type){
case "selector":
+ // This isn't exactly correct, but it works because parser treats \r\n sequences that follow a closed comment as "selector"
+ rulesetUnderConstruction = createNewRuleset();
let parts = token.split(/([\.#:\[]\w[\w-_"'=\]]*|\s\w[\w-_"'=\]]*)/);
for(let part of parts){
@@ -341,7 +352,7 @@ const Highlighter = new(function(){
n.className = (`token ${type}`);
token = "";
- node.appendChild(n);
+ rulesetUnderConstruction.appendChild(n);
return
}