Edit File by line

<!doctype html>

[0] Fix | Delete

[1] Fix | Delete

<title>CodeMirror: SCSS mode</title>

[2] Fix | Delete

[3] Fix | Delete

[4] Fix | Delete

[5] Fix | Delete

[6] Fix | Delete

[7] Fix | Delete

[8] Fix | Delete

[9] Fix | Delete

[10] Fix | Delete

<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

[11] Fix | Delete

[12] Fix | Delete

<ul>

[13] Fix | Delete

[14] Fix | Delete

<li><a href="../../doc/manual.html">Manual</a>

[15] Fix | Delete

[16] Fix | Delete

</ul>

[17] Fix | Delete

<ul>

[18] Fix | Delete

<li><a href="../index.html">Language modes</a>

[19] Fix | Delete

[20] Fix | Delete

</ul>

[21] Fix | Delete

</div>

[22] Fix | Delete

[23] Fix | Delete

[24] Fix | Delete

[25] Fix | Delete

[26] Fix | Delete

/* Some example SCSS */

[27] Fix | Delete

[28] Fix | Delete

@import "compass/css3";

[29] Fix | Delete

$variable: #333;

[30] Fix | Delete

[31] Fix | Delete

$blue: #3bbfce;

[32] Fix | Delete

$margin: 16px;

[33] Fix | Delete

[34] Fix | Delete

.content-navigation {

[35] Fix | Delete

#nested {

[36] Fix | Delete

background-color: black;

[37] Fix | Delete

}

[38] Fix | Delete

border-color: $blue;

[39] Fix | Delete

color:

[40] Fix | Delete

darken($blue, 9%);

[41] Fix | Delete

}

[42] Fix | Delete

[43] Fix | Delete

.border {

[44] Fix | Delete

padding: $margin / 2;

[45] Fix | Delete

margin: $margin / 2;

[46] Fix | Delete

border-color: $blue;

[47] Fix | Delete

}

[48] Fix | Delete

[49] Fix | Delete

@mixin table-base {

[50] Fix | Delete

th {

[51] Fix | Delete

text-align: center;

[52] Fix | Delete

font-weight: bold;

[53] Fix | Delete

}

[54] Fix | Delete

td, th {padding: 2px}

[55] Fix | Delete

}

[56] Fix | Delete

[57] Fix | Delete

table.hl {

[58] Fix | Delete

margin: 2em 0;

[59] Fix | Delete

td.ln {

[60] Fix | Delete

text-align: right;

[61] Fix | Delete

}

[62] Fix | Delete

}

[63] Fix | Delete

[64] Fix | Delete

li {

[65] Fix | Delete

font: {

[66] Fix | Delete

family: serif;

[67] Fix | Delete

weight: bold;

[68] Fix | Delete

size: 1.2em;

[69] Fix | Delete

}

[70] Fix | Delete

}

[71] Fix | Delete

[72] Fix | Delete

@mixin left($dist) {

[73] Fix | Delete

float: left;

[74] Fix | Delete

margin-left: $dist;

[75] Fix | Delete

}

[76] Fix | Delete

[77] Fix | Delete

#data {

[78] Fix | Delete

@include left(10px);

[79] Fix | Delete

@include table-base;

[80] Fix | Delete

}

[81] Fix | Delete

[82] Fix | Delete

.source {

[83] Fix | Delete

@include flow-into(target);

[84] Fix | Delete

border: 10px solid green;

[85] Fix | Delete

margin: 20px;

[86] Fix | Delete

width: 200px; }

[87] Fix | Delete

[88] Fix | Delete

.new-container {

[89] Fix | Delete

@include flow-from(target);

[90] Fix | Delete

border: 10px solid red;

[91] Fix | Delete

margin: 20px;

[92] Fix | Delete

width: 200px; }

[93] Fix | Delete

[94] Fix | Delete

body {

[95] Fix | Delete

margin: 0;

[96] Fix | Delete

padding: 3em 6em;

[97] Fix | Delete

font-family: tahoma, arial, sans-serif;

[98] Fix | Delete

color: #000;

[99] Fix | Delete

}

[100] Fix | Delete

[101] Fix | Delete

@mixin yellow() {

[102] Fix | Delete

background: yellow;

[103] Fix | Delete

}

[104] Fix | Delete

[105] Fix | Delete

.big {

[106] Fix | Delete

font-size: 14px;

[107] Fix | Delete

}

[108] Fix | Delete

[109] Fix | Delete

.nested {

[110] Fix | Delete

@include border-radius(3px);

[111] Fix | Delete

@extend .big;

[112] Fix | Delete

p {

[113] Fix | Delete

background: whitesmoke;

[114] Fix | Delete

a {

[115] Fix | Delete

color: red;

[116] Fix | Delete

}

[117] Fix | Delete

}

[118] Fix | Delete

}

[119] Fix | Delete

[120] Fix | Delete

#navigation a {

[121] Fix | Delete

font-weight: bold;

[122] Fix | Delete

text-decoration: none !important;

[123] Fix | Delete

}

[124] Fix | Delete

[125] Fix | Delete

h1 {

[126] Fix | Delete

font-size: 2.5em;

[127] Fix | Delete

}

[128] Fix | Delete

[129] Fix | Delete

h2 {

[130] Fix | Delete

font-size: 1.7em;

[131] Fix | Delete

}

[132] Fix | Delete

[133] Fix | Delete

h1:before, h2:before {

[134] Fix | Delete

content: "::";

[135] Fix | Delete

}

[136] Fix | Delete

[137] Fix | Delete

code {

[138] Fix | Delete

font-family: courier, monospace;

[139] Fix | Delete

font-size: 80%;

[140] Fix | Delete

color: #418A8A;

[141] Fix | Delete

}

[142] Fix | Delete

</textarea></form>

[143] Fix | Delete

[144] Fix | Delete

var editor = CodeMirror.fromTextArea(document.getElementById("code"), {

[145] Fix | Delete

lineNumbers: true,

[146] Fix | Delete

matchBrackets: true,

[147] Fix | Delete

mode: "text/x-scss"

[148] Fix | Delete

});

[149] Fix | Delete

</script>

[150] Fix | Delete

[151] Fix | Delete

<p>The SCSS mode is a sub-mode of the <a href="index.html">CSS mode</a> (defined in <code>css.js</code>).</p>

[152] Fix | Delete

[153] Fix | Delete

<p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#scss_*">normal</a>, <a href="../../test/index.html#verbose,scss_*">verbose</a>.</p>

[154] Fix | Delete

[155] Fix | Delete

</article>

[156] Fix | Delete

[157] Fix | Delete