forked from cben/mathdown
-
Notifications
You must be signed in to change notification settings - Fork 0
/
mathdown.css
131 lines (118 loc) · 5.47 KB
/
mathdown.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
#header {
font-size: 200%;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
/* Vertically center, if we're lucky to fit. */
line-height: 3ex;
height: 3ex;
}
#logo {
font-size: 50%; /* Fit 2-line math within single-line header */
color: black; text-decoration: none; /* Don't look like a link */
display: inline-block; width: 4em; white-space: nowrap;
}
.warning { color: #ff7f50; /* coral */ }
.call_to_action {
font-weight: bold;
font-size: inherit; font-family: inherit; /* avoid parts of browser <button> styling */
text-decoration: none;
/*color: black; background-color: springgreen;
padding: 0 0.5em; border-radius: 0.5ex; border-style: outset;*/
}
/* Horizontally center http://stackoverflow.com/a/10352525/239657 */
#status_container {
position: fixed; top: 1ex; left: 0; right: 0;
text-align: center;
visibility: hidden; /* allow clicking through */
}
#status {
display: inline-block;
padding: 0 0.5em; border-radius: 1ex;
color: black; background-color: yellow;
font-size: 150%; font-style: italic;
/* Without a class, hide the status.
Make sure stuff underneath is clickable (see http://stackoverflow.com/a/21335440/239657). */
opacity: 0; visibility: hidden;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease; /* fast fade out */
}
#status.info {
/* Explanation for http://cubic-bezier.com/#0,.3,.85,0 curve:
quickly appear a tiny bit (10% at 5% time), then fade in slowly (50% at 80% time). */
opacity: 0.8; visibility: visible;
-webkit-transition: all 2s cubic-bezier(0,.3,.85,0);
transition: all 2s cubic-bezier(0,.3,.85,0); /* slow appear */
}
@media print { #header { display: none; } }
#content { clear: both; }
@media screen { .CodeMirror { border: 1px solid silver; } }
@media print { .CodeMirror { border: 1px none; } }
/* Expand editor to fit most of the page. */
html, body, form, textarea, .firepad, .CodeMirror {
height: 100%; width: 100%;
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
/* TODO: downsizing body is ugly but works better than downsizing form. */
body { height: 80%; width: 95%; }
/* These would make the editor exactly fill the available space,
but also cause CM to auto-resize and never scroll
(instead whole page scrolls), which makes CM slower.
body { display: table; }
form { display: table-row; } */
/* Font choices based on Math.SE: http://graphicdesign.stackexchange.com/a/12961 */
/* "lining_numerals_charter" replaces only the digits 0-9, comes from fonts/ subdir.
See https://github.com/cben/mathdown/issues/95 */
.CodeMirror {
font-family: "lining_numerals_charter", "Georgia", "Bitstream Charter", "David", "David CLM", "Times New Roman", "Times", serif;
}
/* markdown mode styles `...` and indented code blocks as "comment". */
.cm-comment, .cm-leadingspace, .cm-formatting-list, .cm-formatting-quote, .cm-formatting-task {
/* Prefer Courier and similar serif monospaced fonts.
Prefer Nimbus Mono L to Courier New -> Liberation Mono substitution
on linux (it's metrically compatible but sans-serif). */
font-family: "Courier 10 Pitch", "Nimbus Mono L", "Courier New", "Courier", "FreeMono", monospace;
}
/* Match h1..h6 default sizes in WebKit, Mozilla & IE as of 2013. */
pre.cm-header-1 { font-size: 2.00em; }
pre.cm-header-2 { font-size: 1.50em; }
pre.cm-header-3 { font-size: 1.17em; }
pre.cm-header-4 { font-size: 1.00em; }
pre.cm-header-5 { font-size: 0.83em; }
pre.cm-header-6 { font-size: 0.67em; }
/* Arbitrary margins for headers (non-negligible but not too big). */
pre.cm-header { padding-top: 0.5em; padding-bottom: 0.5em; }
/* De-emphasize markup characters. Whitewash colors by *0.4 factor. TODO: opacity? */
.cm-s-default .cm-formatting-header { color: #66F; }
.cm-s-default .cm-formatting-em { color: #666; }
.cm-s-default .cm-formatting-strong { color: #666; }
.cm-s-default .cm-formatting-code { color: #c96; }
.cm-s-default .cm-formatting-list { font-weight: bold; }
/* Want to disable/de-emphasize coloring of list lines, leaving only bullet colored.
But can't, as long as color is important for lining up continuation lines.
.cm-s-default .cm-variable-2 { color: #003366; }
.cm-s-default .cm-variable-2.cm-formatting-list { color: #05a; }
.cm-s-default .cm-variable-3 { color: #005233; }
.cm-s-default .cm-variable-3.cm-formatting-list { color: #085; }
.cm-s-default .cm-keyword { color: #470052; }
.cm-s-default .cm-keyword.cm-formatting-list { color: #708; }
*/
/* Poor man's checkbox. */
.cm-formatting-task { border: 1px inset; }
/* exclude math from monospace style to avoid mathjax vertically
squishing formulas, especially display. */
.cm-comment.inline_math, .cm-comment.display_math { font-family: serif; }
.display_math { width:100%; }
/* We set (in "renderLine" event) negative text-indent on indented lines,
which if inherited by any nested inline-block breaks their positioning
(math overlaps text, tabs become almost invisible). Thanks to
https://github.com/mathjax/MathJax/issues/473 for easy fix. */
.CodeMirror pre > * { text-indent: 0; }
/* Vertically center gutter markers - looks better on our variable-height
padded headings. */
.CodeMirror-gutter-wrapper { height: 100%; }
.CodeMirror-gutter-elt { height: 100%; display: table; }
.CodeMirror-foldgutter-open,
.CodeMirror-foldgutter-folded {
height: 100%; display: table-cell; vertical-align: middle;
/* Small triagles are not covered by default fonts on WinXP and Android. */
font-family: "Lucida Sans Unicode", "Droid Sans Fallback", "Arial";
}