1/* BASICS */
2
3.CodeMirror {
4  /* Set height, width, borders, and global font properties here */
5  font-family: monospace;
6  height: 300px;
7  color: black;
8}
9
10/* PADDING */
11
12.CodeMirror-lines {
13  padding: 4px 0; /* Vertical padding around content */
14}
15.CodeMirror pre {
16  padding: 0 4px; /* Horizontal padding of content */
17}
18
19.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
20  background-color: white; /* The little square between H and V scrollbars */
21}
22
23/* GUTTER */
24
25.CodeMirror-gutters {
26  border-right: 1px solid #ddd;
27  background-color: #f7f7f7;
28  white-space: nowrap;
29}
30.CodeMirror-linenumbers {}
31.CodeMirror-linenumber {
32  padding: 0 3px 0 5px;
33  min-width: 20px;
34  text-align: right;
35  color: #999;
36  white-space: nowrap;
37}
38
39.CodeMirror-guttermarker { color: black; }
40.CodeMirror-guttermarker-subtle { color: #999; }
41
42/* CURSOR */
43
44.CodeMirror-cursor {
45  border-left: 1px solid black;
46  border-right: none;
47  width: 0;
48}
49/* Shown when moving in bi-directional text */
50.CodeMirror div.CodeMirror-secondarycursor {
51  border-left: 1px solid silver;
52}
53.cm-fat-cursor .CodeMirror-cursor {
54  width: auto;
55  border: 0 !important;
56  background: #7e7;
57}
58.cm-fat-cursor div.CodeMirror-cursors {
59  z-index: 1;
60}
61
62.cm-animate-fat-cursor {
63  width: auto;
64  border: 0;
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;
68  background-color: #7e7;
69}
70@-moz-keyframes blink {
71  0% {}
72  50% { background-color: transparent; }
73  100% {}
74}
75@-webkit-keyframes blink {
76  0% {}
77  50% { background-color: transparent; }
78  100% {}
79}
80@keyframes blink {
81  0% {}
82  50% { background-color: transparent; }
83  100% {}
84}
85
86/* Can style cursor different in overwrite (non-insert) mode */
87.CodeMirror-overwrite .CodeMirror-cursor {}
88
89.cm-tab { display: inline-block; text-decoration: inherit; }
90
91.CodeMirror-rulers {
92  position: absolute;
93  left: 0; right: 0; top: -50px; bottom: -20px;
94  overflow: hidden;
95}
96.CodeMirror-ruler {
97  border-left: 1px solid #ccc;
98  top: 0; bottom: 0;
99  position: absolute;
100}
101
102/* DEFAULT THEME */
103
104.cm-s-default .cm-header {color: blue;}
105.cm-s-default .cm-quote {color: #090;}
106.cm-negative {color: #d44;}
107.cm-positive {color: #292;}
108.cm-header, .cm-strong {font-weight: bold;}
109.cm-em {font-style: italic;}
110.cm-link {text-decoration: underline;}
111.cm-strikethrough {text-decoration: line-through;}
112
113.cm-s-default .cm-keyword {color: #708;}
114.cm-s-default .cm-atom {color: #219;}
115.cm-s-default .cm-number {color: #164;}
116.cm-s-default .cm-def {color: #00f;}
117.cm-s-default .cm-variable,
118.cm-s-default .cm-punctuation,
119.cm-s-default .cm-property,
120.cm-s-default .cm-operator {}
121.cm-s-default .cm-variable-2 {color: #05a;}
122.cm-s-default .cm-variable-3 {color: #085;}
123.cm-s-default .cm-comment {color: #a50;}
124.cm-s-default .cm-string {color: #a11;}
125.cm-s-default .cm-string-2 {color: #f50;}
126.cm-s-default .cm-meta {color: #555;}
127.cm-s-default .cm-qualifier {color: #555;}
128.cm-s-default .cm-builtin {color: #30a;}
129.cm-s-default .cm-bracket {color: #997;}
130.cm-s-default .cm-tag {color: #170;}
131.cm-s-default .cm-attribute {color: #00c;}
132.cm-s-default .cm-hr {color: #999;}
133.cm-s-default .cm-link {color: #00c;}
134
135.cm-s-default .cm-error {color: #f00;}
136.cm-invalidchar {color: #f00;}
137
138.CodeMirror-composing { border-bottom: 2px solid; }
139
140/* Default styles for common addons */
141
142div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
143div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
144.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
145.CodeMirror-activeline-background {background: #e8f2ff;}
146
147/* STOP */
148
149/* The rest of this file contains styles related to the mechanics of
150   the editor. You probably shouldn't touch them. */
151
152.CodeMirror {
153  position: relative;
154  overflow: hidden;
155  background: white;
156}
157
158.CodeMirror-scroll {
159  overflow: scroll !important; /* Things will break if this is overridden */
160  /* 30px is the magic margin used to hide the element's real scrollbars */
161  /* See overflow: hidden in .CodeMirror */
162  margin-bottom: -30px; margin-right: -30px;
163  padding-bottom: 30px;
164  height: 100%;
165  outline: none; /* Prevent dragging from highlighting the element */
166  position: relative;
167}
168.CodeMirror-sizer {
169  position: relative;
170  border-right: 30px solid transparent;
171}
172
173/* The fake, visible scrollbars. Used to force redraw during scrolling
174   before actual scrolling happens, thus preventing shaking and
175   flickering artifacts. */
176.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
177  position: absolute;
178  z-index: 6;
179  display: none;
180}
181.CodeMirror-vscrollbar {
182  right: 0; top: 0;
183  overflow-x: hidden;
184  overflow-y: scroll;
185}
186.CodeMirror-hscrollbar {
187  bottom: 0; left: 0;
188  overflow-y: hidden;
189  overflow-x: scroll;
190}
191.CodeMirror-scrollbar-filler {
192  right: 0; bottom: 0;
193}
194.CodeMirror-gutter-filler {
195  left: 0; bottom: 0;
196}
197
198.CodeMirror-gutters {
199  position: absolute; left: 0; top: 0;
200  min-height: 100%;
201  z-index: 3;
202}
203.CodeMirror-gutter {
204  white-space: normal;
205  height: 100%;
206  display: inline-block;
207  vertical-align: top;
208  margin-bottom: -30px;
209  /* Hack to make IE7 behave */
210  *zoom:1;
211  *display:inline;
212}
213.CodeMirror-gutter-wrapper {
214  position: absolute;
215  z-index: 4;
216  background: none !important;
217  border: none !important;
218}
219.CodeMirror-gutter-background {
220  position: absolute;
221  top: 0; bottom: 0;
222  z-index: 4;
223}
224.CodeMirror-gutter-elt {
225  position: absolute;
226  cursor: default;
227  z-index: 4;
228}
229.CodeMirror-gutter-wrapper {
230  -webkit-user-select: none;
231  -moz-user-select: none;
232  user-select: none;
233}
234
235.CodeMirror-lines {
236  cursor: text;
237  min-height: 1px; /* prevents collapsing before first draw */
238}
239.CodeMirror pre {
240  /* Reset some styles that the rest of the page might have set */
241  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
242  border-width: 0;
243  background: transparent;
244  font-family: inherit;
245  font-size: inherit;
246  margin: 0;
247  white-space: pre;
248  word-wrap: normal;
249  line-height: inherit;
250  color: inherit;
251  z-index: 2;
252  position: relative;
253  overflow: visible;
254  -webkit-tap-highlight-color: transparent;
255  -webkit-font-variant-ligatures: none;
256  font-variant-ligatures: none;
257}
258.CodeMirror-wrap pre {
259  word-wrap: break-word;
260  white-space: pre-wrap;
261  word-break: normal;
262}
263
264.CodeMirror-linebackground {
265  position: absolute;
266  left: 0; right: 0; top: 0; bottom: 0;
267  z-index: 0;
268}
269
270.CodeMirror-linewidget {
271  position: relative;
272  z-index: 2;
273  overflow: auto;
274}
275
276.CodeMirror-widget {}
277
278.CodeMirror-code {
279  outline: none;
280}
281
282/* Force content-box sizing for the elements where we expect it */
283.CodeMirror-scroll,
284.CodeMirror-sizer,
285.CodeMirror-gutter,
286.CodeMirror-gutters,
287.CodeMirror-linenumber {
288  -moz-box-sizing: content-box;
289  box-sizing: content-box;
290}
291
292.CodeMirror-measure {
293  position: absolute;
294  width: 100%;
295  height: 0;
296  overflow: hidden;
297  visibility: hidden;
298}
299
300.CodeMirror-cursor {
301  position: absolute;
302  pointer-events: none;
303}
304.CodeMirror-measure pre { position: static; }
305
306div.CodeMirror-cursors {
307  visibility: hidden;
308  position: relative;
309  z-index: 3;
310}
311div.CodeMirror-dragcursors {
312  visibility: visible;
313}
314
315.CodeMirror-focused div.CodeMirror-cursors {
316  visibility: visible;
317}
318
319.CodeMirror-selected { background: #d9d9d9; }
320.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
321.CodeMirror-crosshair { cursor: crosshair; }
322.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
323.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
324
325.cm-searching {
326  background: #ffa;
327  background: rgba(255, 255, 0, .4);
328}
329
330/* IE7 hack to prevent it from returning funny offsetTops on the spans */
331.CodeMirror span { *vertical-align: text-bottom; }
332
333/* Used to force a border model for a node */
334.cm-force-border { padding-right: .1px; }
335
336@media print {
337  /* Hide the cursor when printing */
338  .CodeMirror div.CodeMirror-cursors {
339    visibility: hidden;
340  }
341}
342
343/* See issue #2901 */
344.cm-tab-wrap-hack:after { content: ''; }
345
346/* Help users use markselection to safely style text background */
347span.CodeMirror-selectedtext { background: none; }
348