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) }
|
.comment{ color: rgb(50,180,90) }
|
||||||
.selector{ color: silver }
|
.selector{ color: silver }
|
||||||
.pseudo{ color: silver }
|
.pseudo{ color: violet }
|
||||||
.id{ color: rgb(240, 148, 138) }
|
.id{ color: rgb(240, 148, 138) }
|
||||||
.class{ color: skyblue }
|
.class{ color: skyblue }
|
||||||
.attribute{ color: rgb(120,230,170) }
|
.attribute{ color: rgb(120,230,170) }
|
||||||
|
|
|
@ -267,6 +267,15 @@ const Highlighter = new(function(){
|
||||||
clearCodeBlock();
|
clearCodeBlock();
|
||||||
let node = document.createElement("div");
|
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){
|
function createElementFromToken(type,c){
|
||||||
if(token.length === 0 && !c){
|
if(token.length === 0 && !c){
|
||||||
return
|
return
|
||||||
|
@ -275,6 +284,8 @@ const Highlighter = new(function(){
|
||||||
|
|
||||||
switch(type){
|
switch(type){
|
||||||
case "selector":
|
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-_"'=\]]*)/);
|
let parts = token.split(/([\.#:\[]\w[\w-_"'=\]]*|\s\w[\w-_"'=\]]*)/);
|
||||||
|
|
||||||
for(let part of parts){
|
for(let part of parts){
|
||||||
|
@ -341,7 +352,7 @@ const Highlighter = new(function(){
|
||||||
|
|
||||||
n.className = (`token ${type}`);
|
n.className = (`token ${type}`);
|
||||||
token = "";
|
token = "";
|
||||||
node.appendChild(n);
|
rulesetUnderConstruction.appendChild(n);
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue