-
Notifications
You must be signed in to change notification settings - Fork 46
/
Copy pathmathdown.css
155 lines (141 loc) · 6.49 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
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
#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; } */
/* David is the best-matching serif Hebrew style.
But its italic is problematic: slants to the left, which inherently
does't mix well with right-slanted latin; the Culmus version also
"takes over" punctuation to be left-slanted, and even English letters
to remain upright :-(
KLUDGE: hide the native italic from the browser, to force "faux oblique"
that will slant to the right! https://stackoverflow.com/a/25583439/239657
Also, constrain to Hebrew block to avoid taking over other scripts.
*/
@font-face {
font-family: 'DavidWithoutItalic';
font-style: normal;
font-weight: normal;
unicode-range: U+0590-05FF, U+FB1D-FB4F; /* Hebrew, Hebrew subset of Alphabetic Presentation Forms */
src: local('David CLM Medium'), local('David'), local('David Regular');
}
@font-face {
font-family: 'DavidWithoutItalic';
font-style: normal;
font-weight: bold;
unicode-range: U+0590-05FF, U+FB1D-FB4F; /* Hebrew, Hebrew subset of Alphabetic Presentation Forms */
src: local('David CLM Bold'), local('David Bold');
}
/* 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", "DavidWithoutItalic", "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";
}