| 1 | CodeMirror.defineMode("css", function(config) { |
|---|
| 2 | var indentUnit = config.indentUnit, type; |
|---|
| 3 | |
|---|
| 4 | var atMediaTypes = keySet([ |
|---|
| 5 | "all", "aural", "braille", "handheld", "print", "projection", "screen", |
|---|
| 6 | "tty", "tv", "embossed" |
|---|
| 7 | ]); |
|---|
| 8 | |
|---|
| 9 | var atMediaFeatures = keySet([ |
|---|
| 10 | "width", "min-width", "max-width", "height", "min-height", "max-height", |
|---|
| 11 | "device-width", "min-device-width", "max-device-width", "device-height", |
|---|
| 12 | "min-device-height", "max-device-height", "aspect-ratio", |
|---|
| 13 | "min-aspect-ratio", "max-aspect-ratio", "device-aspect-ratio", |
|---|
| 14 | "min-device-aspect-ratio", "max-device-aspect-ratio", "color", "min-color", |
|---|
| 15 | "max-color", "color-index", "min-color-index", "max-color-index", |
|---|
| 16 | "monochrome", "min-monochrome", "max-monochrome", "resolution", |
|---|
| 17 | "min-resolution", "max-resolution", "scan", "grid" |
|---|
| 18 | ]); |
|---|
| 19 | |
|---|
| 20 | var propertyKeywords = keySet([ |
|---|
| 21 | "align-content", "align-items", "align-self", "alignment-adjust", |
|---|
| 22 | "alignment-baseline", "anchor-point", "animation", "animation-delay", |
|---|
| 23 | "animation-direction", "animation-duration", "animation-iteration-count", |
|---|
| 24 | "animation-name", "animation-play-state", "animation-timing-function", |
|---|
| 25 | "appearance", "azimuth", "backface-visibility", "background", |
|---|
| 26 | "background-attachment", "background-clip", "background-color", |
|---|
| 27 | "background-image", "background-origin", "background-position", |
|---|
| 28 | "background-repeat", "background-size", "baseline-shift", "binding", |
|---|
| 29 | "bleed", "bookmark-label", "bookmark-level", "bookmark-state", |
|---|
| 30 | "bookmark-target", "border", "border-bottom", "border-bottom-color", |
|---|
| 31 | "border-bottom-left-radius", "border-bottom-right-radius", |
|---|
| 32 | "border-bottom-style", "border-bottom-width", "border-collapse", |
|---|
| 33 | "border-color", "border-image", "border-image-outset", |
|---|
| 34 | "border-image-repeat", "border-image-slice", "border-image-source", |
|---|
| 35 | "border-image-width", "border-left", "border-left-color", |
|---|
| 36 | "border-left-style", "border-left-width", "border-radius", "border-right", |
|---|
| 37 | "border-right-color", "border-right-style", "border-right-width", |
|---|
| 38 | "border-spacing", "border-style", "border-top", "border-top-color", |
|---|
| 39 | "border-top-left-radius", "border-top-right-radius", "border-top-style", |
|---|
| 40 | "border-top-width", "border-width", "bottom", "box-decoration-break", |
|---|
| 41 | "box-shadow", "box-sizing", "break-after", "break-before", "break-inside", |
|---|
| 42 | "caption-side", "clear", "clip", "color", "color-profile", "column-count", |
|---|
| 43 | "column-fill", "column-gap", "column-rule", "column-rule-color", |
|---|
| 44 | "column-rule-style", "column-rule-width", "column-span", "column-width", |
|---|
| 45 | "columns", "content", "counter-increment", "counter-reset", "crop", "cue", |
|---|
| 46 | "cue-after", "cue-before", "cursor", "direction", "display", |
|---|
| 47 | "dominant-baseline", "drop-initial-after-adjust", |
|---|
| 48 | "drop-initial-after-align", "drop-initial-before-adjust", |
|---|
| 49 | "drop-initial-before-align", "drop-initial-size", "drop-initial-value", |
|---|
| 50 | "elevation", "empty-cells", "fit", "fit-position", "flex", "flex-basis", |
|---|
| 51 | "flex-direction", "flex-flow", "flex-grow", "flex-shrink", "flex-wrap", |
|---|
| 52 | "float", "float-offset", "font", "font-feature-settings", "font-family", |
|---|
| 53 | "font-kerning", "font-language-override", "font-size", "font-size-adjust", |
|---|
| 54 | "font-stretch", "font-style", "font-synthesis", "font-variant", |
|---|
| 55 | "font-variant-alternates", "font-variant-caps", "font-variant-east-asian", |
|---|
| 56 | "font-variant-ligatures", "font-variant-numeric", "font-variant-position", |
|---|
| 57 | "font-weight", "grid-cell", "grid-column", "grid-column-align", |
|---|
| 58 | "grid-column-sizing", "grid-column-span", "grid-columns", "grid-flow", |
|---|
| 59 | "grid-row", "grid-row-align", "grid-row-sizing", "grid-row-span", |
|---|
| 60 | "grid-rows", "grid-template", "hanging-punctuation", "height", "hyphens", |
|---|
| 61 | "icon", "image-orientation", "image-rendering", "image-resolution", |
|---|
| 62 | "inline-box-align", "justify-content", "left", "letter-spacing", |
|---|
| 63 | "line-break", "line-height", "line-stacking", "line-stacking-ruby", |
|---|
| 64 | "line-stacking-shift", "line-stacking-strategy", "list-style", |
|---|
| 65 | "list-style-image", "list-style-position", "list-style-type", "margin", |
|---|
| 66 | "margin-bottom", "margin-left", "margin-right", "margin-top", |
|---|
| 67 | "marker-offset", "marks", "marquee-direction", "marquee-loop", |
|---|
| 68 | "marquee-play-count", "marquee-speed", "marquee-style", "max-height", |
|---|
| 69 | "max-width", "min-height", "min-width", "move-to", "nav-down", "nav-index", |
|---|
| 70 | "nav-left", "nav-right", "nav-up", "opacity", "order", "orphans", "outline", |
|---|
| 71 | "outline-color", "outline-offset", "outline-style", "outline-width", |
|---|
| 72 | "overflow", "overflow-style", "overflow-wrap", "overflow-x", "overflow-y", |
|---|
| 73 | "padding", "padding-bottom", "padding-left", "padding-right", "padding-top", |
|---|
| 74 | "page", "page-break-after", "page-break-before", "page-break-inside", |
|---|
| 75 | "page-policy", "pause", "pause-after", "pause-before", "perspective", |
|---|
| 76 | "perspective-origin", "pitch", "pitch-range", "play-during", "position", |
|---|
| 77 | "presentation-level", "punctuation-trim", "quotes", "rendering-intent", |
|---|
| 78 | "resize", "rest", "rest-after", "rest-before", "richness", "right", |
|---|
| 79 | "rotation", "rotation-point", "ruby-align", "ruby-overhang", |
|---|
| 80 | "ruby-position", "ruby-span", "size", "speak", "speak-as", "speak-header", |
|---|
| 81 | "speak-numeral", "speak-punctuation", "speech-rate", "stress", "string-set", |
|---|
| 82 | "tab-size", "table-layout", "target", "target-name", "target-new", |
|---|
| 83 | "target-position", "text-align", "text-align-last", "text-decoration", |
|---|
| 84 | "text-decoration-color", "text-decoration-line", "text-decoration-skip", |
|---|
| 85 | "text-decoration-style", "text-emphasis", "text-emphasis-color", |
|---|
| 86 | "text-emphasis-position", "text-emphasis-style", "text-height", |
|---|
| 87 | "text-indent", "text-justify", "text-outline", "text-shadow", |
|---|
| 88 | "text-space-collapse", "text-transform", "text-underline-position", |
|---|
| 89 | "text-wrap", "top", "transform", "transform-origin", "transform-style", |
|---|
| 90 | "transition", "transition-delay", "transition-duration", |
|---|
| 91 | "transition-property", "transition-timing-function", "unicode-bidi", |
|---|
| 92 | "vertical-align", "visibility", "voice-balance", "voice-duration", |
|---|
| 93 | "voice-family", "voice-pitch", "voice-range", "voice-rate", "voice-stress", |
|---|
| 94 | "voice-volume", "volume", "white-space", "widows", "width", "word-break", |
|---|
| 95 | "word-spacing", "word-wrap", "z-index" |
|---|
| 96 | ]); |
|---|
| 97 | |
|---|
| 98 | var colorKeywords = keySet([ |
|---|
| 99 | "black", "silver", "gray", "white", "maroon", "red", "purple", "fuchsia", |
|---|
| 100 | "green", "lime", "olive", "yellow", "navy", "blue", "teal", "aqua" |
|---|
| 101 | ]); |
|---|
| 102 | |
|---|
| 103 | var valueKeywords = keySet([ |
|---|
| 104 | "above", "absolute", "activeborder", "activecaption", "afar", |
|---|
| 105 | "after-white-space", "ahead", "alias", "all", "all-scroll", "alternate", |
|---|
| 106 | "always", "amharic", "amharic-abegede", "antialiased", "appworkspace", |
|---|
| 107 | "arabic-indic", "armenian", "asterisks", "auto", "avoid", "background", |
|---|
| 108 | "backwards", "baseline", "below", "bidi-override", "binary", "bengali", |
|---|
| 109 | "blink", "block", "block-axis", "bold", "bolder", "border", "border-box", |
|---|
| 110 | "both", "bottom", "break-all", "break-word", "button", "button-bevel", |
|---|
| 111 | "buttonface", "buttonhighlight", "buttonshadow", "buttontext", "cambodian", |
|---|
| 112 | "capitalize", "caps-lock-indicator", "caption", "captiontext", "caret", |
|---|
| 113 | "cell", "center", "checkbox", "circle", "cjk-earthly-branch", |
|---|
| 114 | "cjk-heavenly-stem", "cjk-ideographic", "clear", "clip", "close-quote", |
|---|
| 115 | "col-resize", "collapse", "compact", "condensed", "contain", "content", |
|---|
| 116 | "content-box", "context-menu", "continuous", "copy", "cover", "crop", |
|---|
| 117 | "cross", "crosshair", "currentcolor", "cursive", "dashed", "decimal", |
|---|
| 118 | "decimal-leading-zero", "default", "default-button", "destination-atop", |
|---|
| 119 | "destination-in", "destination-out", "destination-over", "devanagari", |
|---|
| 120 | "disc", "discard", "document", "dot-dash", "dot-dot-dash", "dotted", |
|---|
| 121 | "double", "down", "e-resize", "ease", "ease-in", "ease-in-out", "ease-out", |
|---|
| 122 | "element", "ellipsis", "embed", "end", "ethiopic", "ethiopic-abegede", |
|---|
| 123 | "ethiopic-abegede-am-et", "ethiopic-abegede-gez", "ethiopic-abegede-ti-er", |
|---|
| 124 | "ethiopic-abegede-ti-et", "ethiopic-halehame-aa-er", |
|---|
| 125 | "ethiopic-halehame-aa-et", "ethiopic-halehame-am-et", |
|---|
| 126 | "ethiopic-halehame-gez", "ethiopic-halehame-om-et", |
|---|
| 127 | "ethiopic-halehame-sid-et", "ethiopic-halehame-so-et", |
|---|
| 128 | "ethiopic-halehame-ti-er", "ethiopic-halehame-ti-et", |
|---|
| 129 | "ethiopic-halehame-tig", "ew-resize", "expanded", "extra-condensed", |
|---|
| 130 | "extra-expanded", "fantasy", "fast", "fill", "fixed", "flat", "footnotes", |
|---|
| 131 | "forwards", "from", "geometricPrecision", "georgian", "graytext", "groove", |
|---|
| 132 | "gujarati", "gurmukhi", "hand", "hangul", "hangul-consonant", "hebrew", |
|---|
| 133 | "help", "hidden", "hide", "higher", "highlight", "highlighttext", |
|---|
| 134 | "hiragana", "hiragana-iroha", "horizontal", "hsl", "hsla", "icon", "ignore", |
|---|
| 135 | "inactiveborder", "inactivecaption", "inactivecaptiontext", "infinite", |
|---|
| 136 | "infobackground", "infotext", "inherit", "initial", "inline", "inline-axis", |
|---|
| 137 | "inline-block", "inline-table", "inset", "inside", "intrinsic", "invert", |
|---|
| 138 | "italic", "justify", "kannada", "katakana", "katakana-iroha", "khmer", |
|---|
| 139 | "landscape", "lao", "large", "larger", "left", "level", "lighter", |
|---|
| 140 | "line-through", "linear", "lines", "list-item", "listbox", "listitem", |
|---|
| 141 | "local", "logical", "loud", "lower", "lower-alpha", "lower-armenian", |
|---|
| 142 | "lower-greek", "lower-hexadecimal", "lower-latin", "lower-norwegian", |
|---|
| 143 | "lower-roman", "lowercase", "ltr", "malayalam", "match", |
|---|
| 144 | "media-controls-background", "media-current-time-display", |
|---|
| 145 | "media-fullscreen-button", "media-mute-button", "media-play-button", |
|---|
| 146 | "media-return-to-realtime-button", "media-rewind-button", |
|---|
| 147 | "media-seek-back-button", "media-seek-forward-button", "media-slider", |
|---|
| 148 | "media-sliderthumb", "media-time-remaining-display", "media-volume-slider", |
|---|
| 149 | "media-volume-slider-container", "media-volume-sliderthumb", "medium", |
|---|
| 150 | "menu", "menulist", "menulist-button", "menulist-text", |
|---|
| 151 | "menulist-textfield", "menutext", "message-box", "middle", "min-intrinsic", |
|---|
| 152 | "mix", "mongolian", "monospace", "move", "multiple", "myanmar", "n-resize", |
|---|
| 153 | "narrower", "navy", "ne-resize", "nesw-resize", "no-close-quote", "no-drop", |
|---|
| 154 | "no-open-quote", "no-repeat", "none", "normal", "not-allowed", "nowrap", |
|---|
| 155 | "ns-resize", "nw-resize", "nwse-resize", "oblique", "octal", "open-quote", |
|---|
| 156 | "optimizeLegibility", "optimizeSpeed", "oriya", "oromo", "outset", |
|---|
| 157 | "outside", "overlay", "overline", "padding", "padding-box", "painted", |
|---|
| 158 | "paused", "persian", "plus-darker", "plus-lighter", "pointer", "portrait", |
|---|
| 159 | "pre", "pre-line", "pre-wrap", "preserve-3d", "progress", "push-button", |
|---|
| 160 | "radio", "read-only", "read-write", "read-write-plaintext-only", "relative", |
|---|
| 161 | "repeat", "repeat-x", "repeat-y", "reset", "reverse", "rgb", "rgba", |
|---|
| 162 | "ridge", "right", "round", "row-resize", "rtl", "run-in", "running", |
|---|
| 163 | "s-resize", "sans-serif", "scroll", "scrollbar", "se-resize", "searchfield", |
|---|
| 164 | "searchfield-cancel-button", "searchfield-decoration", |
|---|
| 165 | "searchfield-results-button", "searchfield-results-decoration", |
|---|
| 166 | "semi-condensed", "semi-expanded", "separate", "serif", "show", "sidama", |
|---|
| 167 | "single", "skip-white-space", "slide", "slider-horizontal", |
|---|
| 168 | "slider-vertical", "sliderthumb-horizontal", "sliderthumb-vertical", "slow", |
|---|
| 169 | "small", "small-caps", "small-caption", "smaller", "solid", "somali", |
|---|
| 170 | "source-atop", "source-in", "source-out", "source-over", "space", "square", |
|---|
| 171 | "square-button", "start", "static", "status-bar", "stretch", "stroke", |
|---|
| 172 | "sub", "subpixel-antialiased", "super", "sw-resize", "table", |
|---|
| 173 | "table-caption", "table-cell", "table-column", "table-column-group", |
|---|
| 174 | "table-footer-group", "table-header-group", "table-row", "table-row-group", |
|---|
| 175 | "telugu", "text", "text-bottom", "text-top", "textarea", "textfield", "thai", |
|---|
| 176 | "thick", "thin", "threeddarkshadow", "threedface", "threedhighlight", |
|---|
| 177 | "threedlightshadow", "threedshadow", "tibetan", "tigre", "tigrinya-er", |
|---|
| 178 | "tigrinya-er-abegede", "tigrinya-et", "tigrinya-et-abegede", "to", "top", |
|---|
| 179 | "transparent", "ultra-condensed", "ultra-expanded", "underline", "up", |
|---|
| 180 | "upper-alpha", "upper-armenian", "upper-greek", "upper-hexadecimal", |
|---|
| 181 | "upper-latin", "upper-norwegian", "upper-roman", "uppercase", "urdu", "url", |
|---|
| 182 | "vertical", "vertical-text", "visible", "visibleFill", "visiblePainted", |
|---|
| 183 | "visibleStroke", "visual", "w-resize", "wait", "wave", "white", "wider", |
|---|
| 184 | "window", "windowframe", "windowtext", "x-large", "x-small", "xor", |
|---|
| 185 | "xx-large", "xx-small", "yellow" |
|---|
| 186 | ]); |
|---|
| 187 | |
|---|
| 188 | function keySet(array) { var keys = {}; for (var i = 0; i < array.length; ++i) keys[array[i]] = true; return keys; } |
|---|
| 189 | function ret(style, tp) {type = tp; return style;} |
|---|
| 190 | |
|---|
| 191 | function tokenBase(stream, state) { |
|---|
| 192 | var ch = stream.next(); |
|---|
| 193 | if (ch == "@") {stream.eatWhile(/[\w\\\-]/); return ret("def", stream.current());} |
|---|
| 194 | else if (ch == "/" && stream.eat("*")) { |
|---|
| 195 | state.tokenize = tokenCComment; |
|---|
| 196 | return tokenCComment(stream, state); |
|---|
| 197 | } |
|---|
| 198 | else if (ch == "<" && stream.eat("!")) { |
|---|
| 199 | state.tokenize = tokenSGMLComment; |
|---|
| 200 | return tokenSGMLComment(stream, state); |
|---|
| 201 | } |
|---|
| 202 | else if (ch == "=") ret(null, "compare"); |
|---|
| 203 | else if ((ch == "~" || ch == "|") && stream.eat("=")) return ret(null, "compare"); |
|---|
| 204 | else if (ch == "\"" || ch == "'") { |
|---|
| 205 | state.tokenize = tokenString(ch); |
|---|
| 206 | return state.tokenize(stream, state); |
|---|
| 207 | } |
|---|
| 208 | else if (ch == "#") { |
|---|
| 209 | stream.eatWhile(/[\w\\\-]/); |
|---|
| 210 | return ret("atom", "hash"); |
|---|
| 211 | } |
|---|
| 212 | else if (ch == "!") { |
|---|
| 213 | stream.match(/^\s*\w*/); |
|---|
| 214 | return ret("keyword", "important"); |
|---|
| 215 | } |
|---|
| 216 | else if (/\d/.test(ch)) { |
|---|
| 217 | stream.eatWhile(/[\w.%]/); |
|---|
| 218 | return ret("number", "unit"); |
|---|
| 219 | } |
|---|
| 220 | else if (ch === "-") { |
|---|
| 221 | if (/\d/.test(stream.peek())) { |
|---|
| 222 | stream.eatWhile(/[\w.%]/); |
|---|
| 223 | return ret("number", "unit"); |
|---|
| 224 | } else if (stream.match(/^[^-]+-/)) { |
|---|
| 225 | return ret("meta", type); |
|---|
| 226 | } |
|---|
| 227 | } |
|---|
| 228 | else if (/[,+>*\/]/.test(ch)) { |
|---|
| 229 | return ret(null, "select-op"); |
|---|
| 230 | } |
|---|
| 231 | else if (ch == "." && stream.match(/^-?[_a-z][_a-z0-9-]*/i)) { |
|---|
| 232 | return ret("qualifier", type); |
|---|
| 233 | } |
|---|
| 234 | else if (ch == ":") { |
|---|
| 235 | return ret("operator", ch); |
|---|
| 236 | } |
|---|
| 237 | else if (/[;{}\[\]\(\)]/.test(ch)) { |
|---|
| 238 | return ret(null, ch); |
|---|
| 239 | } |
|---|
| 240 | else { |
|---|
| 241 | stream.eatWhile(/[\w\\\-]/); |
|---|
| 242 | return ret("property", "variable"); |
|---|
| 243 | } |
|---|
| 244 | } |
|---|
| 245 | |
|---|
| 246 | function tokenCComment(stream, state) { |
|---|
| 247 | var maybeEnd = false, ch; |
|---|
| 248 | while ((ch = stream.next()) != null) { |
|---|
| 249 | if (maybeEnd && ch == "/") { |
|---|
| 250 | state.tokenize = tokenBase; |
|---|
| 251 | break; |
|---|
| 252 | } |
|---|
| 253 | maybeEnd = (ch == "*"); |
|---|
| 254 | } |
|---|
| 255 | return ret("comment", "comment"); |
|---|
| 256 | } |
|---|
| 257 | |
|---|
| 258 | function tokenSGMLComment(stream, state) { |
|---|
| 259 | var dashes = 0, ch; |
|---|
| 260 | while ((ch = stream.next()) != null) { |
|---|
| 261 | if (dashes >= 2 && ch == ">") { |
|---|
| 262 | state.tokenize = tokenBase; |
|---|
| 263 | break; |
|---|
| 264 | } |
|---|
| 265 | dashes = (ch == "-") ? dashes + 1 : 0; |
|---|
| 266 | } |
|---|
| 267 | return ret("comment", "comment"); |
|---|
| 268 | } |
|---|
| 269 | |
|---|
| 270 | function tokenString(quote) { |
|---|
| 271 | return function(stream, state) { |
|---|
| 272 | var escaped = false, ch; |
|---|
| 273 | while ((ch = stream.next()) != null) { |
|---|
| 274 | if (ch == quote && !escaped) |
|---|
| 275 | break; |
|---|
| 276 | escaped = !escaped && ch == "\\"; |
|---|
| 277 | } |
|---|
| 278 | if (!escaped) state.tokenize = tokenBase; |
|---|
| 279 | return ret("string", "string"); |
|---|
| 280 | }; |
|---|
| 281 | } |
|---|
| 282 | |
|---|
| 283 | return { |
|---|
| 284 | startState: function(base) { |
|---|
| 285 | return {tokenize: tokenBase, |
|---|
| 286 | baseIndent: base || 0, |
|---|
| 287 | stack: []}; |
|---|
| 288 | }, |
|---|
| 289 | |
|---|
| 290 | token: function(stream, state) { |
|---|
| 291 | |
|---|
| 292 | // Use these terms when applicable (see http://www.xanthir.com/blog/b4E50) |
|---|
| 293 | // |
|---|
| 294 | // rule** or **ruleset: |
|---|
| 295 | // A selector + braces combo, or an at-rule. |
|---|
| 296 | // |
|---|
| 297 | // declaration block: |
|---|
| 298 | // A sequence of declarations. |
|---|
| 299 | // |
|---|
| 300 | // declaration: |
|---|
| 301 | // A property + colon + value combo. |
|---|
| 302 | // |
|---|
| 303 | // property value: |
|---|
| 304 | // The entire value of a property. |
|---|
| 305 | // |
|---|
| 306 | // component value: |
|---|
| 307 | // A single piece of a property value. Like the 5px in |
|---|
| 308 | // text-shadow: 0 0 5px blue;. Can also refer to things that are |
|---|
| 309 | // multiple terms, like the 1-4 terms that make up the background-size |
|---|
| 310 | // portion of the background shorthand. |
|---|
| 311 | // |
|---|
| 312 | // term: |
|---|
| 313 | // The basic unit of author-facing CSS, like a single number (5), |
|---|
| 314 | // dimension (5px), string ("foo"), or function. Officially defined |
|---|
| 315 | // by the CSS 2.1 grammar (look for the 'term' production) |
|---|
| 316 | // |
|---|
| 317 | // |
|---|
| 318 | // simple selector: |
|---|
| 319 | // A single atomic selector, like a type selector, an attr selector, a |
|---|
| 320 | // class selector, etc. |
|---|
| 321 | // |
|---|
| 322 | // compound selector: |
|---|
| 323 | // One or more simple selectors without a combinator. div.example is |
|---|
| 324 | // compound, div > .example is not. |
|---|
| 325 | // |
|---|
| 326 | // complex selector: |
|---|
| 327 | // One or more compound selectors chained with combinators. |
|---|
| 328 | // |
|---|
| 329 | // combinator: |
|---|
| 330 | // The parts of selectors that express relationships. There are four |
|---|
| 331 | // currently - the space (descendant combinator), the greater-than |
|---|
| 332 | // bracket (child combinator), the plus sign (next sibling combinator), |
|---|
| 333 | // and the tilda (following sibling combinator). |
|---|
| 334 | // |
|---|
| 335 | // sequence of selectors: |
|---|
| 336 | // One or more of the named type of selector chained with commas. |
|---|
| 337 | |
|---|
| 338 | if (stream.eatSpace()) return null; |
|---|
| 339 | var style = state.tokenize(stream, state); |
|---|
| 340 | |
|---|
| 341 | // Changing style returned based on context |
|---|
| 342 | var context = state.stack[state.stack.length-1]; |
|---|
| 343 | if (style == "property") { |
|---|
| 344 | if (context == "propertyValue"){ |
|---|
| 345 | if (valueKeywords[stream.current()]) { |
|---|
| 346 | style = "string-2"; |
|---|
| 347 | } else if (colorKeywords[stream.current()]) { |
|---|
| 348 | style = "keyword"; |
|---|
| 349 | } else { |
|---|
| 350 | style = "variable-2"; |
|---|
| 351 | } |
|---|
| 352 | } else if (context == "rule") { |
|---|
| 353 | if (!propertyKeywords[stream.current()]) { |
|---|
| 354 | style += " error"; |
|---|
| 355 | } |
|---|
| 356 | } else if (!context || context == "@media{") { |
|---|
| 357 | style = "tag"; |
|---|
| 358 | } else if (context == "@media") { |
|---|
| 359 | if (atMediaTypes[stream.current()]) { |
|---|
| 360 | style = "attribute"; // Known attribute |
|---|
| 361 | } else if (/^(only|not)$/i.test(stream.current())) { |
|---|
| 362 | style = "keyword"; |
|---|
| 363 | } else if (stream.current().toLowerCase() == "and") { |
|---|
| 364 | style = "error"; // "and" is only allowed in @mediaType |
|---|
| 365 | } else if (atMediaFeatures[stream.current()]) { |
|---|
| 366 | style = "error"; // Known property, should be in @mediaType( |
|---|
| 367 | } else { |
|---|
| 368 | // Unknown, expecting keyword or attribute, assuming attribute |
|---|
| 369 | style = "attribute error"; |
|---|
| 370 | } |
|---|
| 371 | } else if (context == "@mediaType") { |
|---|
| 372 | if (atMediaTypes[stream.current()]) { |
|---|
| 373 | style = "attribute"; |
|---|
| 374 | } else if (stream.current().toLowerCase() == "and") { |
|---|
| 375 | style = "operator"; |
|---|
| 376 | } else if (/^(only|not)$/i.test(stream.current())) { |
|---|
| 377 | style = "error"; // Only allowed in @media |
|---|
| 378 | } else if (atMediaFeatures[stream.current()]) { |
|---|
| 379 | style = "error"; // Known property, should be in parentheses |
|---|
| 380 | } else { |
|---|
| 381 | // Unknown attribute or property, but expecting property (preceded |
|---|
| 382 | // by "and"). Should be in parentheses |
|---|
| 383 | style = "error"; |
|---|
| 384 | } |
|---|
| 385 | } else if (context == "@mediaType(") { |
|---|
| 386 | if (propertyKeywords[stream.current()]) { |
|---|
| 387 | // do nothing, remains "property" |
|---|
| 388 | } else if (atMediaTypes[stream.current()]) { |
|---|
| 389 | style = "error"; // Known property, should be in parentheses |
|---|
| 390 | } else if (stream.current().toLowerCase() == "and") { |
|---|
| 391 | style = "operator"; |
|---|
| 392 | } else if (/^(only|not)$/i.test(stream.current())) { |
|---|
| 393 | style = "error"; // Only allowed in @media |
|---|
| 394 | } else { |
|---|
| 395 | style += " error"; |
|---|
| 396 | } |
|---|
| 397 | } else { |
|---|
| 398 | style = "error"; |
|---|
| 399 | } |
|---|
| 400 | } else if (style == "atom") { |
|---|
| 401 | if(!context || context == "@media{") { |
|---|
| 402 | style = "builtin"; |
|---|
| 403 | } else if (context == "propertyValue") { |
|---|
| 404 | if (!/^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/.test(stream.current())) { |
|---|
| 405 | style += " error"; |
|---|
| 406 | } |
|---|
| 407 | } else { |
|---|
| 408 | style = "error"; |
|---|
| 409 | } |
|---|
| 410 | } else if (context == "@media" && type == "{") { |
|---|
| 411 | style = "error"; |
|---|
| 412 | } |
|---|
| 413 | |
|---|
| 414 | // Push/pop context stack |
|---|
| 415 | if (type == "{") { |
|---|
| 416 | if (context == "@media" || context == "@mediaType") { |
|---|
| 417 | state.stack.pop(); |
|---|
| 418 | state.stack[state.stack.length-1] = "@media{"; |
|---|
| 419 | } |
|---|
| 420 | else state.stack.push("rule"); |
|---|
| 421 | } |
|---|
| 422 | else if (type == "}") { |
|---|
| 423 | state.stack.pop(); |
|---|
| 424 | if (context == "propertyValue") state.stack.pop(); |
|---|
| 425 | } |
|---|
| 426 | else if (type == "@media") state.stack.push("@media"); |
|---|
| 427 | else if (context == "@media" && /\b(keyword|attribute)\b/.test(style)) |
|---|
| 428 | state.stack.push("@mediaType"); |
|---|
| 429 | else if (context == "@mediaType" && stream.current() == ",") state.stack.pop(); |
|---|
| 430 | else if (context == "@mediaType" && type == "(") state.stack.push("@mediaType("); |
|---|
| 431 | else if (context == "@mediaType(" && type == ")") state.stack.pop(); |
|---|
| 432 | else if (context == "rule" && type == ":") state.stack.push("propertyValue"); |
|---|
| 433 | else if (context == "propertyValue" && type == ";") state.stack.pop(); |
|---|
| 434 | return style; |
|---|
| 435 | }, |
|---|
| 436 | |
|---|
| 437 | indent: function(state, textAfter) { |
|---|
| 438 | var n = state.stack.length; |
|---|
| 439 | if (/^\}/.test(textAfter)) |
|---|
| 440 | n -= state.stack[state.stack.length-1] == "propertyValue" ? 2 : 1; |
|---|
| 441 | return state.baseIndent + n * indentUnit; |
|---|
| 442 | }, |
|---|
| 443 | |
|---|
| 444 | electricChars: "}" |
|---|
| 445 | }; |
|---|
| 446 | }); |
|---|
| 447 | |
|---|
| 448 | CodeMirror.defineMIME("text/css", "css"); |
|---|
