mirror of
https://github.com/jashkenas/coffeescript.git
synced 2026-05-03 03:00:14 -04:00
63d3b699d7
* Get rid of offcanvas slide-in; fix sidebar * We need to transpile docs.coffee, since Safari 9 throws an error on it and that’s too new a browser not to support; but this should also speed things up * Fix some tabs * Fix scrollbar * Use Highlight.js to format placeholder code (during compilation, not rendering) before CodeMirror loads; match Highlight.js styles to CodeMirror styles as best we can * Improve hash management * Initialize CodeMirror on demand, on mouseover a particular code example, rather than all examples on startup * Replace highlight.js with Prism for placeholder syntax highlighting * Scratch Prism, use CodeMirror itself to do Node-based syntax highlighting, so that on CodeMirror initialization there’s no flash from mismatched highlighting * Update packages; there’s a new version of Jison! (doesn’t change much) * Fix mobile issues: use SVG play button icon, to avoid iOS blue square play button; make the code editor text 16px size explicit, to avoid unwanted mobile zoom; make the ‘code play’ buttons work even if the code examples are in placeholder (non-editable) mode, in case a user hasn’t moused over/tapped them * Update docs output * Whoops, CodeMirror is only a devDependency
101 lines
2.2 KiB
CSS
101 lines
2.2 KiB
CSS
/* Adapted from https://github.com/FarhadG/code-mirror-themes/blob/master/themes/twilight.css */
|
|
|
|
.CodeMirror,
|
|
.placeholder-code {
|
|
letter-spacing: 0.3px;
|
|
color: #f8f8f8;
|
|
/* Prevent mobile Safari from zooming in on our code editors; the code is 16px naturally, but somehow being explicit about it prevents the zooming */
|
|
font-size: 16px;
|
|
}
|
|
.CodeMirror-lines {
|
|
padding: 0.5em 0;
|
|
}
|
|
.placeholder-code {
|
|
padding: 0.5em 4px;
|
|
margin-bottom: 1.3rem;
|
|
white-space: pre-wrap;
|
|
}
|
|
div.CodeMirror-cursor {
|
|
border-left: 3px solid #f8f8f8;
|
|
}
|
|
.CodeMirror-activeline-background {
|
|
background: #ffffff08;
|
|
}
|
|
.CodeMirror-selected {
|
|
background: #ddf0ff33;
|
|
}
|
|
.cm-comment,
|
|
.placeholder-code .comment {
|
|
font-style: italic;
|
|
color: #5f5a60;
|
|
}
|
|
.cm-keyword,
|
|
.placeholder-code .keyword {
|
|
color: #cda869;
|
|
}
|
|
.cm-string,
|
|
.placeholder-code .string {
|
|
color: #8f9d6a;
|
|
}
|
|
.cm-property,
|
|
.placeholder-code .attribute {
|
|
color: #dad085;
|
|
}
|
|
.cm-atom {
|
|
color: #dad085;
|
|
}
|
|
.cm-number,
|
|
.placeholder-code .number,
|
|
.placeholder-code .built_in,
|
|
.placeholder-code .builtin-name,
|
|
.placeholder-code .literal,
|
|
.placeholder-code .type,
|
|
/*.placeholder-code .params,*/
|
|
.placeholder-code .meta,
|
|
.placeholder-code .link {
|
|
color: #dad085;
|
|
}
|
|
.cm-operator,
|
|
.placeholder-code .punctuation,
|
|
.placeholder-code .symbol,
|
|
.placeholder-code .bullet,
|
|
.placeholder-code .addition,
|
|
.placeholder-code .operator {
|
|
color: #cda869;
|
|
}
|
|
|
|
/* Uneditable code blocks are inverted, so use darker versions of the above */
|
|
|
|
.uneditable-code-block .comment {
|
|
font-style: italic;
|
|
color: #837B85;
|
|
}
|
|
.uneditable-code-block .class,
|
|
.uneditable-code-block .function,
|
|
.uneditable-code-block .keyword,
|
|
.uneditable-code-block .reserved,
|
|
.uneditable-code-block .title {
|
|
color: #534328;
|
|
}
|
|
.uneditable-code-block .string
|
|
.uneditable-code-block .value
|
|
.uneditable-code-block .inheritance
|
|
.uneditable-code-block .header {
|
|
color: #3A4029;
|
|
}
|
|
.uneditable-code-block .variable,
|
|
.uneditable-code-block .literal,
|
|
.uneditable-code-block .tag,
|
|
.uneditable-code-block .regexp,
|
|
.uneditable-code-block .subst,
|
|
.uneditable-code-block .property {
|
|
color: #474429;
|
|
}
|
|
.uneditable-code-block .number,
|
|
.uneditable-code-block .preprocessor,
|
|
.uneditable-code-block .built_in,
|
|
.uneditable-code-block .params,
|
|
.uneditable-code-block .constant {
|
|
color: #474429;
|
|
}
|