enhanced css syntax rules

- support for id, class, and element definition syntax
 - support for media selector blocks
 - ensure ruleset highlighting is only applied inside of definition blocks, not the entire document
This commit is contained in:
Sean Kellogg 2011-04-20 17:37:03 -07:00
commit d511a3e992

View file

@ -97,7 +97,7 @@ var CssHighlightRules = function() {
"vertical-ideographic|vertical-text|visible|w-resize|wait|whitespace|" +
"zero").split("|")
);
var colors = lang.arrayToMap(
("aqua|black|blue|fuchsia|gray|green|lime|maroon|navy|olive|orange|" +
"purple|red|silver|teal|white|yellow").split("|")
@ -122,12 +122,12 @@ var CssHighlightRules = function() {
return re.join("");
}
this.$rules = {
"start" : [ {
var base_ruleset = [
{
token : "comment", // multi line comment
regex : "\\/\\*",
next : "comment"
}, {
next : "ruleset_comment"
},{
token : "string", // single line
regex : '["](?:(?:\\\\.)|(?:[^"\\\\]))*?["]'
}, {
@ -190,12 +190,6 @@ var CssHighlightRules = function() {
}, {
token : "constant.numeric", // hex3 color
regex : "#[a-fA-F0-9]{3}"
}, {
token : "lparen",
regex : "\{"
}, {
token : "rparen",
regex : "\}"
}, {
token : function(value) {
if (properties.hasOwnProperty(value.toLowerCase())) {
@ -215,15 +209,121 @@ var CssHighlightRules = function() {
}
},
regex : "\\-?[a-zA-Z_][a-zA-Z0-9_\\-]*"
}],
"comment" : [{
token : "comment", // closing comment
regex : ".*?\\*\\/",
next : "start"
}
];
var ruleset = lang.copyArray( base_ruleset );
ruleset.unshift(
{
token : "rparen",
regex : "\}",
next: "start"
}
);
var media_ruleset = lang.copyArray( base_ruleset );
media_ruleset.unshift(
{
token : "rparen",
regex : "\}",
next: "media"
}
);
var base_comment = [
{
token : "comment", // comment spanning whole line
regex : ".+"
}
];
var comment = lang.copyArray( base_comment );
comment.unshift(
{
token : "comment", // closing comment
regex : ".*?\\*\\/",
next : "start"
}
);
var media_comment = lang.copyArray( base_comment );
media_comment.unshift(
{
token : "comment", // closing comment
regex : ".*?\\*\\/",
next : "media"
}
);
var ruleset_comment = lang.copyArray( base_comment );
ruleset_comment.unshift(
{
token : "comment", // closing comment
regex : ".*?\\*\\/",
next : "ruleset"
}
);
this.$rules = {
"start" : [ {
token : "comment", // multi line comment
regex : "\\/\\*",
next : "comment"
}, {
token : "comment", // comment spanning whole line
regex : ".+"
}]
token: "lparen",
regex: "{",
next: "ruleset"
}, {
token: "string",
regex: "@media.*?{",
next: "media"
},{
token: "keyword",
regex: "#[a-zA-Z0-9-_]+"
},{
token: "variable",
regex: "\\.[a-zA-Z0-9-_]+"
},{
token: "string",
regex: ":[a-zA-Z0-9-_]+"
},{
token: "constant",
regex: "[a-zA-Z0-9-_]+"
}],
"media" : [ {
token : "comment", // multi line comment
regex : "\\/\\*",
next : "media_comment"
}, {
token: "lparen",
regex: "{",
next: "media_ruleset"
},{
token: "string",
regex: "}",
next: "start"
},{
token: "keyword",
regex: "#[a-zA-Z0-9-_]+"
},{
token: "variable",
regex: "\\.[a-zA-Z0-9-_]+"
},{
token: "string",
regex: ":[a-zA-Z0-9-_]+"
},{
token: "constant",
regex: "[a-zA-Z0-9-_]+"
}],
"comment" : comment,
"ruleset" : ruleset,
"ruleset_comment" : ruleset_comment,
"media_ruleset" : media_ruleset,
"media_comment" : media_comment
};
};