Files
Geoffrey Booth 776e7e5328 Docs improvements (#5042)
* Move analytics initialization into docs.coffee

* Bump Bootstrap and CodeMirror versions

* Update output

* Merge CodeMirror styles

* Update CodeMirror styles

* Better flexbox layout for docs, including flex auto-sized sidebar and main column

* Minor styling fixes for Edge

* Fix scrollspy for new layout

* Update output

* Clicking on the CoffeeScript logo in the navbar should scroll to top; fix main column width on mobile

* Update output
2018-04-27 10:07:01 -07:00

166 lines
3.3 KiB
CSS
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
/* Adapted from https://github.com/FarhadG/code-mirror-themes/blob/master/themes/twilight.css and https://github.com/codemirror/CodeMirror/blob/master/theme/twilight.css */
/* CodeMirror general styling */
.CodeMirror,
.placeholder-code {
/* https://codemirror.net/demo/resize.html */
height: auto;
background: transparent;
font-family: 'Roboto Mono';
font-weight: 400;
line-height: 1.25;
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;
}
@media (min-width: 768px) {
.CodeMirror,
.placeholder-code {
font-size: 87.5%; /* Matching Bootstraps font size for code, which calculates to 14.4px */
}
}
.CodeMirror-lines {
padding: 0.5em 0;
}
.placeholder-code {
padding: 0.5em 4px;
margin-bottom: 1.37em;
white-space: pre-wrap;
}
.CodeMirror pre,
pre.placeholder-code {
line-height: 1.4em;
}
.CodeMirror-code:focus {
outline: none;
}
div.CodeMirror-cursor {
border-left: 3px solid #f8f8f8;
}
.CodeMirror-activeline-background {
background: #ffffff08;
}
.CodeMirror-selected {
background: #ddf0ff33;
}
/* Syntax highlighting */
.cm-keyword,
.placeholder-code .keyword {
color: #cda869;
}
.cm-atom {
color: #dad085;
}
.cm-number,
.cm-meta,
.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-def {
color: #f8f8f8;
}
span.cm-variable-2,
span.cm-tag {
color: #f8f8f8;
}
span.cm-variable-3,
span.cm-def,
span.cm-type {
color: #f8f8f8;
}
.cm-operator,
.placeholder-code .punctuation,
.placeholder-code .symbol,
.placeholder-code .bullet,
.placeholder-code .addition,
.placeholder-code .operator {
color: #cda869;
}
.cm-comment,
.placeholder-code .comment {
font-style: italic;
color: #5f5a60;
}
.cm-string,
.cm-string-2,
.placeholder-code .string {
color: #8f9d6a;
}
.cm-property,
.placeholder-code .attribute {
color: #dad085;
}
.cm-builtin {
color: #cda869;
}
.cm-tag {
color: #997643;
}
.cm-attribute {
color: #d6bb6d;
}
.cm-header {
color: #FF6400;
}
.cm-hr {
color: #AEAEAE;
}
.cm-link {
color: #ad9361;
font-style: italic;
text-decoration: none;
}
.cm-error {
border-bottom: 1px solid rgba(142, 22, 22, 0.67);
}
/* Uneditable code blocks are inverted, so use darker versions of the above */
.uneditable-code-block code {
padding: 0;
}
.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;
}