diff options
Diffstat (limited to 'public/vendor/plugins/codemirror/mode/css/scss.html')
-rw-r--r-- | public/vendor/plugins/codemirror/mode/css/scss.html | 157 |
1 files changed, 157 insertions, 0 deletions
diff --git a/public/vendor/plugins/codemirror/mode/css/scss.html b/public/vendor/plugins/codemirror/mode/css/scss.html new file mode 100644 index 0000000000..f8e4d37368 --- /dev/null +++ b/public/vendor/plugins/codemirror/mode/css/scss.html @@ -0,0 +1,157 @@ +<!doctype html> + +<title>CodeMirror: SCSS mode</title> +<meta charset="utf-8"/> +<link rel=stylesheet href="../../doc/docs.css"> + +<link rel="stylesheet" href="../../lib/codemirror.css"> +<script src="../../lib/codemirror.js"></script> +<script src="css.js"></script> +<style>.CodeMirror {background: #f8f8f8;}</style> +<div id=nav> + <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a> + + <ul> + <li><a href="../../index.html">Home</a> + <li><a href="../../doc/manual.html">Manual</a> + <li><a href="https://github.com/codemirror/codemirror">Code</a> + </ul> + <ul> + <li><a href="../index.html">Language modes</a> + <li><a class=active href="#">SCSS</a> + </ul> +</div> + +<article> +<h2>SCSS mode</h2> +<form><textarea id="code" name="code"> +/* Some example SCSS */ + +@import "compass/css3"; +$variable: #333; + +$blue: #3bbfce; +$margin: 16px; + +.content-navigation { + #nested { + background-color: black; + } + border-color: $blue; + color: + darken($blue, 9%); +} + +.border { + padding: $margin / 2; + margin: $margin / 2; + border-color: $blue; +} + +@mixin table-base { + th { + text-align: center; + font-weight: bold; + } + td, th {padding: 2px} +} + +table.hl { + margin: 2em 0; + td.ln { + text-align: right; + } +} + +li { + font: { + family: serif; + weight: bold; + size: 1.2em; + } +} + +@mixin left($dist) { + float: left; + margin-left: $dist; +} + +#data { + @include left(10px); + @include table-base; +} + +.source { + @include flow-into(target); + border: 10px solid green; + margin: 20px; + width: 200px; } + +.new-container { + @include flow-from(target); + border: 10px solid red; + margin: 20px; + width: 200px; } + +body { + margin: 0; + padding: 3em 6em; + font-family: tahoma, arial, sans-serif; + color: #000; +} + +@mixin yellow() { + background: yellow; +} + +.big { + font-size: 14px; +} + +.nested { + @include border-radius(3px); + @extend .big; + p { + background: whitesmoke; + a { + color: red; + } + } +} + +#navigation a { + font-weight: bold; + text-decoration: none !important; +} + +h1 { + font-size: 2.5em; +} + +h2 { + font-size: 1.7em; +} + +h1:before, h2:before { + content: "::"; +} + +code { + font-family: courier, monospace; + font-size: 80%; + color: #418A8A; +} +</textarea></form> + <script> + var editor = CodeMirror.fromTextArea(document.getElementById("code"), { + lineNumbers: true, + matchBrackets: true, + mode: "text/x-scss" + }); + </script> + + <p>The SCSS mode is a sub-mode of the <a href="index.html">CSS mode</a> (defined in <code>css.js</code>).</p> + + <p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#scss_*">normal</a>, <a href="../../test/index.html#verbose,scss_*">verbose</a>.</p> + + </article> |