Make highlighter create separate ruleset elements
This commit is contained in:
parent
f958ec293a
commit
a7a306f2a6
2 changed files with 14 additions and 3 deletions
|
@ -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) }
|
||||
|
|
|
@ -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
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue