Tests that (S)CSS syntax highlighter properly detects the tokens.

a[href='/']: cm-css-tag,*,cm-css-tag,*,cm-css-string,*
#content > a:hover: cm-css-builtin,*,cm-css-tag,cm-css-operator,cm-css-tag
@import url(style.css);: cm-css-def,*,cm-css-tag,*,cm-css-string,*
@import url("style.css") projection, tv;: cm-css-def,*,cm-css-tag,*,cm-css-string,*,cm-css-tag,*,cm-css-tag,*
@import "/css/fireball_unicode.css"; html {}: cm-css-def,*,cm-css-string,*,cm-css-tag,*
@media screen { body { color: red; } }: cm-css-def,*,cm-css-attribute,*,cm-css-tag,*,cm-css-property,cm-css-operator,*,cm-css-keyword,*
@font-face { font-family: "MyHelvetica"; }: cm-css-def,*,cm-css-property,cm-css-operator,*,cm-css-string,*
p { color: color; red: red; color: #000; color: #FFF; color: #123AbC; color: #faebfe; color:papayawhip; }: cm-css-tag,*,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,cm-css-keyword,cm-css-operator,*,cm-css-keyword,*,cm-css-property,cm-css-operator,*,cm-css-atom,*,cm-css-property,cm-css-operator,*,cm-css-atom,*,cm-css-property,cm-css-operator,*,cm-css-atom,*,cm-css-property,cm-css-operator,*,cm-css-atom,*,cm-css-property,cm-css-operator,cm-css-keyword,*
p { margin: -10px !important; }: cm-css-tag,*,cm-css-property,cm-css-operator,*,cm-css-number,*,cm-css-keyword,*
$margin-left: $offsetBefore + 12px + $offsetAfter;: cm-css-variable-2,cm-css-operator,*,cm-css-variable-2,*,cm-css-number,*,cm-css-variable-2,*
$type: monster;
p {
@if $type == ocean {
color: blue;
} @else if $type == matador {
color: red;
} @else if $type == monster {
color: green;
} @else {
color: black;
}
}: cm-css-variable-2,cm-css-operator,*,cm-css-variable-2,*,,cm-css-tag,*,,cm-css-def,*,cm-css-variable-2,*,cm-css-tag,*,,cm-css-property,cm-css-operator,*,cm-css-keyword,*,,*,cm-css-def,*,cm-css-tag,*,cm-css-variable-2,*,cm-css-tag,*,,cm-css-property,cm-css-operator,*,cm-css-keyword,*,,*,cm-css-def,*,cm-css-tag,*,cm-css-variable-2,*,cm-css-tag,*,,cm-css-property,cm-css-operator,*,cm-css-keyword,*,,*,cm-css-def,*,,cm-css-property,cm-css-operator,*,cm-css-keyword,*,,*,,*
@for $i from 1 through 3 { .item-#{$i} { width: 2em * $i; } }: cm-css-def,*,cm-css-variable-2,*,cm-css-tag,*,cm-css-number,*,cm-css-tag,*,cm-css-number,*,cm-css-qualifier,cm-css-operator,cm-css-variable-2,cm-css-operator,*,cm-css-property,cm-css-operator,*,cm-css-number,*,cm-css-variable-2,*
@mixin adjust-location($x, $y) {
@if unitless($x) {
@warn "Assuming #{$x} to be in pixels";
$x: 1px * $x;
}
position: relative; left: $x; top: $y;
}: cm-css-def,*,cm-css-tag,*,cm-css-variable-2,*,cm-css-variable-2,*,,cm-css-def,*,cm-css-tag,*,cm-css-variable-2,*,,cm-css-def,*,cm-css-string,*,,cm-css-variable-2,cm-css-operator,*,cm-css-number,*,cm-css-variable-2,*,,*,,cm-css-property,cm-css-operator,*,cm-css-string-2,*,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,,*
#navbar {
$navbar-width: 800px;
$items: 5;
$navbar-color: #ce4dd6;
width: $navbar-width;
border-bottom: 2px solid $navbar-color;
li {
@extend .notice !optional;
float: left;
width: $navbar-width/$items - 10px;
background-color: lighten($navbar-color, 20%);
&:hover {
background-color: lighten($navbar-color, 10%);
}
}
}: cm-css-builtin,*,,cm-css-variable-2,cm-css-operator,*,cm-css-number,*,,cm-css-variable-2,cm-css-operator,*,cm-css-number,*,,cm-css-variable-2,cm-css-operator,*,cm-css-atom,*,,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,,cm-css-property,cm-css-operator,*,cm-css-number,*,cm-css-string-2,*,cm-css-variable-2,*,,cm-css-tag,*,,cm-css-def,*,cm-css-qualifier,*,cm-css-keyword,*,,cm-css-property,cm-css-operator,*,cm-css-string-2,*,,cm-css-property,cm-css-operator,*,cm-css-variable-2,cm-css-operator,cm-css-variable-2,*,cm-css-number,*,,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,cm-css-variable-2,*,cm-css-number,*,,cm-css-tag,cm-css-operator,cm-css-tag,*,,cm-css-property,cm-css-operator,*,cm-css-variable-2,*,cm-css-variable-2,*,cm-css-number,*,,*,,*,,*