f4185fc · typeable/pandoc

git.iko.soy/typeable/pandoc

Use CSS in favor of for display math (#6372)

Some CSS to ensure that display math is displayed centered and on a new line is now included in the default HTML-based templates; this may be overridden if the user wants a different behavior.

commitf4185fcef0aa5c00e37a1bf8bbc8b8c6459fffe7 authorLila <lila91142@gmail.com> dateTue 19 May 2020, 07:45 (6 years ago) parent57fa394

9 files changed+23−17

compare with master

unifiedsplit

data/templates/styles.html+3 src/Text/Pandoc/Writers/HTML.hs+10−13 test/command/5655.md+2−2 test/lhs-test.html+1 test/lhs-test.html+lhs+1 test/s5-basic.html+1 test/s5-inserts.html+1 test/writer.html4+2−1 test/writer.html5+2−1

data/templates/styles.html+3

@@ -10,3 +10,6 @@ $endif$

1010$if(highlighting-css)$

1111$highlighting-css$

1212$endif$

13+$if(displaymath-css)$

14+.display.math{display: block; text-align: center; margin: 0.5rem auto;}

15+$endif$

src/Text/Pandoc/Writers/HTML.hs+10−13

@@ -318,6 +318,10 @@ pandocToHtml opts (Pandoc meta blocks) = do

318318 defField "mathjaxurl"

319319 (T.takeWhile (/='?') u)

320320 _ -> defField "mathjax" False) $

321+ (case writerHTMLMathMethod opts of

322+ PlainMath -> defField "displaymath-css" True

323+ WebTeX _ -> defField "displaymath-css" True

324+ _ -> id) $

321325 defField "quotes" (stQuotes st) $

322326 -- for backwards compatibility we populate toc

323327 -- with the contents of the toc, rather than a

@@ -1108,14 +1112,11 @@ inlineToHtml opts inline = do

11081112 let s = case t of

11091113 InlineMath -> "\\textstyle "

11101114 DisplayMath -> "\\displaystyle "

1111− let m = imtag ! A.style "vertical-align:middle"

1112− ! A.src (toValue $ url <> T.pack (urlEncode (T.unpack $ s <> str)))

1113− ! A.alt (toValue str)

1114− ! A.title (toValue str)

1115− let brtag = if html5 then H5.br else H.br

1116− return $ case t of

1117− InlineMath -> m

1118− DisplayMath -> brtag >> m >> brtag

1115+ return $ imtag ! A.style "vertical-align:middle"

1116+ ! A.src (toValue $ url <> T.pack (urlEncode (T.unpack $ s <> str)))

1117+ ! A.alt (toValue str)

1118+ ! A.title (toValue str)

1119+ ! A.class_ mathClass

11191120 GladTeX ->

11201121 return $

11211122 customParent (textTag "eq") !

@@ -1142,11 +1143,7 @@ inlineToHtml opts inline = do

11421143 DisplayMath -> str

11431144 PlainMath -> do

11441145 x <- lift (texMathToInlines t str) >>= inlineListToHtml opts

1145− let m = H.span ! A.class_ mathClass $ x

1146− let brtag = if html5 then H5.br else H.br

1147− return $ case t of

1148− InlineMath -> m

1149− DisplayMath -> brtag >> m >> brtag

1146+ return $ H.span ! A.class_ mathClass $ x

11501147 (RawInline f str) -> do

11511148 ishtml <- isRawHtml f

11521149 if ishtml

test/command/5655.md+2−2

@@ -2,13 +2,13 @@

22% pandoc --webtex

33$T_n={n+1 \choose 2}$

44^D

5−<img style="vertical-align:middle" src="https://latex.codecogs.com/png.latex?%5Ctextstyle%20T_n%3D%7Bn%2B1%20%5Cchoose%202%7D" alt="T_n={n+1 \choose 2}" title="T_n={n+1 \choose 2}" />

5+<img style="vertical-align:middle" src="https://latex.codecogs.com/png.latex?%5Ctextstyle%20T_n%3D%7Bn%2B1%20%5Cchoose%202%7D" alt="T_n={n+1 \choose 2}" title="T_n={n+1 \choose 2}" class="math inline" />

66````

88````

99% pandoc --webtex

1010$$T_n={n+1 \choose 2}$$

1111^D

12− <img style="vertical-align:middle" src="https://latex.codecogs.com/png.latex?%5Cdisplaystyle%20T_n%3D%7Bn%2B1%20%5Cchoose%202%7D" alt="T_n={n+1 \choose 2}" title="T_n={n+1 \choose 2}" />

12+<img style="vertical-align:middle" src="https://latex.codecogs.com/png.latex?%5Cdisplaystyle%20T_n%3D%7Bn%2B1%20%5Cchoose%202%7D" alt="T_n={n+1 \choose 2}" title="T_n={n+1 \choose 2}" class="math display" />

1313````

1414

test/lhs-test.html+1

@@ -74,6 +74,7 @@

7474 code span.va { color: #19177c; } /* Variable */

7575 code span.vs { color: #4070a0; } /* VerbatimString */

7676 code span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */

77+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

7778 </style>

7879 <!--[if lt IE 9]>

7980 <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>

test/lhs-test.html+lhs+1

@@ -74,6 +74,7 @@

7474 code span.va { color: #19177c; } /* Variable */

7575 code span.vs { color: #4070a0; } /* VerbatimString */

7676 code span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */

77+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

7778 </style>

7879 <!--[if lt IE 9]>

7980 <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>

test/s5-basic.html+1

@@ -17,6 +17,7 @@

1717 div.column{display: inline-block; vertical-align: top; width: 50%;}

1818 div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}

1919 ul.task-list{list-style: none;}

20+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

2021 </style>

2122

2223 <meta name="defaultView" content="slideshow" />

test/s5-inserts.html+1

@@ -15,6 +15,7 @@

1515 div.column{display: inline-block; vertical-align: top; width: 50%;}

1616 div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}

1717 ul.task-list{list-style: none;}

18+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

1819 </style>

1920 <link rel="stylesheet" href="main.css" type="text/css" />

2021 STUFF INSERTED

test/writer.html4+2−1

@@ -15,6 +15,7 @@

1515 div.column{display: inline-block; vertical-align: top; width: 50%;}

1616 div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}

1717 ul.task-list{list-style: none;}

18+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

1819 </style>

1920</head>

2021<body>

@@ -432,7 +433,7 @@ Blah

432433<li>α ∧ ω</li>

433434<li>223</li>

434435<li>p-Tree</li>

435−<li>Here’s some display math: $$\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}$$ </li>

436+<li>Here’s some display math: $$\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}$$</li>

436437<li>Here’s one that has a line break in it: α + ω × x2.</li>

437438</ul>

438439These shouldn’t be math:

test/writer.html5+2−1

@@ -15,6 +15,7 @@

1515 div.column{display: inline-block; vertical-align: top; width: 50%;}

1616 div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}

1717 ul.task-list{list-style: none;}

18+ .display.math{display: block; text-align: center; margin: 0.5rem auto;}

1819 </style>

1920 <!--[if lt IE 9]>

2021 <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>

@@ -435,7 +436,7 @@ Blah

435436<li>α ∧ ω</li>

436437<li>223</li>

437438<li>p-Tree</li>

438−<li>Here’s some display math: $$\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}$$ </li>

439+<li>Here’s some display math: $$\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}$$</li>

439440<li>Here’s one that has a line break in it: α + ω × x2.</li>

440441</ul>

441442These shouldn’t be math: