玛氪宕·梦魔(Markdown Memo),使用Markdown的云端备忘录,百度IFE的RIA启航班的不合格的作业,才……才没有什么阴谋呢!
源gitee链接https://gitee.com/arathi/MarkdownMemo?_from=gitee_search
				
			
			
		
			You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
			
				
					158 lines
				
				2.7 KiB
			
		
		
			
		
	
	
					158 lines
				
				2.7 KiB
			| 
											11 years ago
										 | <!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> |