4 /* Set height, width, borders, and global font properties here */
5 font-family: monospace;
14 padding: 4px 0; /* Vertical padding around content */
16 .CodeMirror pre.CodeMirror-line,
17 .CodeMirror pre.CodeMirror-line-like {
18 padding: 0 4px; /* Horizontal padding of content */
21 .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
22 background-color: white; /* The little square between H and V scrollbars */
28 border-right: 1px solid #ddd;
29 background-color: #f7f7f7;
32 .CodeMirror-linenumbers {}
33 .CodeMirror-linenumber {
41 .CodeMirror-guttermarker { color: black; }
42 .CodeMirror-guttermarker-subtle { color: #999; }
47 border-left: 1px solid black;
51 /* Shown when moving in bi-directional text */
52 .CodeMirror div.CodeMirror-secondarycursor {
53 border-left: 1px solid silver;
55 .cm-fat-cursor .CodeMirror-cursor {
60 .cm-fat-cursor div.CodeMirror-cursors {
64 background-color: rgba(20, 255, 20, 0.5);
65 -webkit-animation: blink 1.06s steps(1) infinite;
66 -moz-animation: blink 1.06s steps(1) infinite;
67 animation: blink 1.06s steps(1) infinite;
69 .cm-animate-fat-cursor {
72 -webkit-animation: blink 1.06s steps(1) infinite;
73 -moz-animation: blink 1.06s steps(1) infinite;
74 animation: blink 1.06s steps(1) infinite;
75 background-color: #7e7;
77 @-moz-keyframes blink {
79 50% { background-color: transparent; }
82 @-webkit-keyframes blink {
84 50% { background-color: transparent; }
89 50% { background-color: transparent; }
93 /* Can style cursor different in overwrite (non-insert) mode */
94 .CodeMirror-overwrite .CodeMirror-cursor {}
96 .cm-tab { display: inline-block; text-decoration: inherit; }
100 left: 0; right: 0; top: -50px; bottom: 0;
104 border-left: 1px solid #ccc;
111 .cm-s-default .cm-header {color: blue;}
112 .cm-s-default .cm-quote {color: #090;}
113 .cm-negative {color: #d44;}
114 .cm-positive {color: #292;}
115 .cm-header, .cm-strong {font-weight: bold;}
116 .cm-em {font-style: italic;}
117 .cm-link {text-decoration: underline;}
118 .cm-strikethrough {text-decoration: line-through;}
120 .cm-s-default .cm-keyword {color: #708;}
121 .cm-s-default .cm-atom {color: #219;}
122 .cm-s-default .cm-number {color: #164;}
123 .cm-s-default .cm-def {color: #00f;}
124 .cm-s-default .cm-variable,
125 .cm-s-default .cm-punctuation,
126 .cm-s-default .cm-property,
127 .cm-s-default .cm-operator {}
128 .cm-s-default .cm-variable-2 {color: #05a;}
129 .cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: #085;}
130 .cm-s-default .cm-comment {color: #a50;}
131 .cm-s-default .cm-string {color: #a11;}
132 .cm-s-default .cm-string-2 {color: #f50;}
133 .cm-s-default .cm-meta {color: #555;}
134 .cm-s-default .cm-qualifier {color: #555;}
135 .cm-s-default .cm-builtin {color: #30a;}
136 .cm-s-default .cm-bracket {color: #997;}
137 .cm-s-default .cm-tag {color: #170;}
138 .cm-s-default .cm-attribute {color: #00c;}
139 .cm-s-default .cm-hr {color: #999;}
140 .cm-s-default .cm-link {color: #00c;}
142 .cm-s-default .cm-error {color: #f00;}
143 .cm-invalidchar {color: #f00;}
145 .CodeMirror-composing { border-bottom: 2px solid; }
147 /* Default styles for common addons */
149 div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}
150 div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
151 .CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
152 .CodeMirror-activeline-background {background: #e8f2ff;}
156 /* The rest of this file contains styles related to the mechanics of
157 the editor. You probably shouldn't touch them. */
166 overflow: scroll !important; /* Things will break if this is overridden */
167 /* 30px is the magic margin used to hide the element's real scrollbars */
168 /* See overflow: hidden in .CodeMirror */
169 margin-bottom: -30px; margin-right: -30px;
170 padding-bottom: 30px;
172 outline: none; /* Prevent dragging from highlighting the element */
177 border-right: 30px solid transparent;
180 /* The fake, visible scrollbars. Used to force redraw during scrolling
181 before actual scrolling happens, thus preventing shaking and
182 flickering artifacts. */
183 .CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
188 .CodeMirror-vscrollbar {
193 .CodeMirror-hscrollbar {
198 .CodeMirror-scrollbar-filler {
201 .CodeMirror-gutter-filler {
205 .CodeMirror-gutters {
206 position: absolute; left: 0; top: 0;
213 display: inline-block;
215 margin-bottom: -30px;
217 .CodeMirror-gutter-wrapper {
220 background: none !important;
221 border: none !important;
223 .CodeMirror-gutter-background {
228 .CodeMirror-gutter-elt {
233 .CodeMirror-gutter-wrapper ::selection { background-color: transparent }
234 .CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }
238 min-height: 1px; /* prevents collapsing before first draw */
240 .CodeMirror pre.CodeMirror-line,
241 .CodeMirror pre.CodeMirror-line-like {
242 /* Reset some styles that the rest of the page might have set */
243 -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
245 background: transparent;
246 font-family: inherit;
251 line-height: inherit;
256 -webkit-tap-highlight-color: transparent;
257 -webkit-font-variant-ligatures: contextual;
258 font-variant-ligatures: contextual;
260 .CodeMirror-wrap pre.CodeMirror-line,
261 .CodeMirror-wrap pre.CodeMirror-line-like {
262 word-wrap: break-word;
263 white-space: pre-wrap;
267 .CodeMirror-linebackground {
269 left: 0; right: 0; top: 0; bottom: 0;
273 .CodeMirror-linewidget {
276 padding: 0.1px; /* Force widget margins to stay inside of the container */
279 .CodeMirror-widget {}
281 .CodeMirror-rtl pre { direction: rtl; }
287 /* Force content-box sizing for the elements where we expect it */
292 .CodeMirror-linenumber {
293 -moz-box-sizing: content-box;
294 box-sizing: content-box;
297 .CodeMirror-measure {
307 pointer-events: none;
309 .CodeMirror-measure pre { position: static; }
311 div.CodeMirror-cursors {
316 div.CodeMirror-dragcursors {
320 .CodeMirror-focused div.CodeMirror-cursors {
324 .CodeMirror-selected { background: #d9d9d9; }
325 .CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
326 .CodeMirror-crosshair { cursor: crosshair; }
327 .CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
328 .CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
331 background-color: #ffa;
332 background-color: rgba(255, 255, 0, .4);
335 /* Used to force a border model for a node */
336 .cm-force-border { padding-right: .1px; }
339 /* Hide the cursor when printing */
340 .CodeMirror div.CodeMirror-cursors {
345 /* See issue #2901 */
346 .cm-tab-wrap-hack:after { content: ''; }
348 /* Help users use markselection to safely style text background */
349 span.CodeMirror-selectedtext { background: none; }