diff options
| -rw-r--r-- | MANUAL.txt | 37 | ||||
| -rw-r--r-- | data/templates/styles.html | 108 | ||||
| -rw-r--r-- | src/Text/Pandoc/Writers/HTML.hs | 2 | ||||
| -rw-r--r-- | test/lhs-test.html | 106 | ||||
| -rw-r--r-- | test/lhs-test.html+lhs | 106 | ||||
| -rw-r--r-- | test/writer.html4 | 106 | ||||
| -rw-r--r-- | test/writer.html5 | 106 |
7 files changed, 571 insertions, 0 deletions
diff --git a/MANUAL.txt b/MANUAL.txt index 65a1cb048..7646958cb 100644 --- a/MANUAL.txt +++ b/MANUAL.txt @@ -2142,6 +2142,43 @@ ODT or pptx. [Unicode Bidirectional Algorithm]: https://www.w3.org/International/articles/inline-bidi-markup/uba-basics [Language subtag lookup]: https://r12a.github.io/app-subtags/ +### Variables for HTML + +`document-css` +: Enables inclusion of most of the CSS in the `styles.html` + [partial](#partials) (have a look with + `pandoc --print-default-data-file=templates/styles.html`). + Unless you use [`--css`](#option--css), this variable + is set to `true` by default. You can disable it with + e.g. `pandoc -M document-css=false`. + +`mainfont` +: sets the CSS `font-family` property on the `html` element. + +`fontsize` +: sets the base CSS `font-size`, which you'd usually set + to e.g. `20px`, but it also accepts `pt` + (12pt = 16px in most browsers). + +`fontcolor` +: sets the CSS `color` property on the `html` element. + +`linkcolor` +: sets the CSS `color` property on all links. + +`monofont` +: sets the CSS `font-family` property on `code` elements. + +`linestretch` +: sets the CSS `line-height` property on the `html` element, + which is preferred to be unitless. + +`backgroundcolor` +: sets the CSS `background-color` property on the `html` element. + +`margin-left`, `margin-right`, `margin-top`, `margin-bottom` +: sets the corresponding CSS `padding` properties on the `body` element. + ### Variables for HTML math `classoption` diff --git a/data/templates/styles.html b/data/templates/styles.html index ea92c39ec..b179d4871 100644 --- a/data/templates/styles.html +++ b/data/templates/styles.html @@ -1,3 +1,111 @@ +$if(document-css)$ +html { + line-height: $if(linestretch)$$linestretch$$else$1.7$endif$; + font-family: $if(mainfont)$$mainfont$$else$Georgia, serif$endif$; + font-size: $if(fontsize)$$fontsize$$else$20px$endif$; + color: $if(fontcolor)$$fontcolor$$else$#1a1a1a$endif$; + background-color: $if(backgroundcolor)$$backgroundcolor$$else$#fdfdfd$endif$; +} +body { + margin: 0 auto; + max-width: 40em; + padding-left: $if(margin-left)$$margin-left$$else$50px$endif$; + padding-right: $if(margin-right)$$margin-right$$else$50px$endif$; + padding-top: $if(margin-top)$$margin-top$$else$50px$endif$; + padding-bottom: $if(margin-bottom)$$margin-bottom$$else$50px$endif$; + hyphens: auto; + word-wrap: break-word; + text-rendering: optimizeLegibility; + font-kerning: normal; +} +@media (max-width: 600px) { + body { + font-size: 0.9em; + padding: 1em; + } +} +@media print { + body { + background-color: transparent; + color: black; + } + p, h2, h3 { + orphans: 3; + widows: 3; + } + h2, h3, h4 { + page-break-after: avoid; + } +} +p { + margin-top: 1.7em; +} +a { + color: $if(linkcolor)$$linkcolor$$else$#1a1a1a$endif$; +} +a:visited { + color: $if(linkcolor)$$linkcolor$$else$#1a1a1a$endif$; +} +img { + max-width: 100%; +} +h1, h2, h3, h4, h5, h6 { + margin-top: 1.7em; +} +ol, ul { + padding-left: 1.7em; + margin-top: 1.7em; +} +li > ol, li > ul { + margin-top: 0; +} +blockquote { + margin: 1.7em 0 1.7em 1.7em; + padding-left: 1em; + border-left: 2px solid #e6e6e6; + font-style: italic; +} +code { + font-family: $if(monofont)$$monofont$$else$Menlo, Monaco, 'Lucida Console', Consolas, monospace$endif$; + background-color: #f0f0f0; + font-size: 85%; + margin: 0; + padding: .2em .4em; +} +pre { + line-height: 1.5em; + padding: 1em; + background-color: #f0f0f0; + overflow: auto; +} +pre code { + padding: 0; + overflow: visible; +} +hr { + background-color: #1a1a1a; + border: none; + height: 1px; + margin-top: 1.7em; +} +table { + border-collapse: collapse; + width: 100%; + overflow-x: auto; + display: block; +} +th, td { + border-bottom: 1px solid lightgray; + padding: 1em 3em 1em 0; +} +header { + margin-bottom: 6em; + text-align: center; +} +nav a:not(:hover) { + text-decoration: none; +} +$endif$ code{white-space: pre-wrap;} span.smallcaps{font-variant: small-caps;} span.underline{text-decoration: underline;} diff --git a/src/Text/Pandoc/Writers/HTML.hs b/src/Text/Pandoc/Writers/HTML.hs index 8162da66a..b40765145 100644 --- a/src/Text/Pandoc/Writers/HTML.hs +++ b/src/Text/Pandoc/Writers/HTML.hs @@ -310,6 +310,7 @@ pandocToHtml opts (Pandoc meta blocks) = do "/*]]>*/\n") | otherwise -> mempty Nothing -> mempty + let mCss :: Maybe [Text] = lookupContext "css" $ metadata let context = (if stHighlighting st then case writerHighlightStyle opts of Just sty -> defField "highlighting-css" @@ -328,6 +329,7 @@ pandocToHtml opts (Pandoc meta blocks) = do PlainMath -> defField "displaymath-css" True WebTeX _ -> defField "displaymath-css" True _ -> id) $ + defField "document-css" (isNothing mCss && slideVariant == NoSlides) $ defField "quotes" (stQuotes st) $ -- for backwards compatibility we populate toc -- with the contents of the toc, rather than a diff --git a/test/lhs-test.html b/test/lhs-test.html index e2db34ee4..e5f76051e 100644 --- a/test/lhs-test.html +++ b/test/lhs-test.html @@ -6,6 +6,112 @@ <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <title>lhs-test</title> <style> + html { + line-height: 1.7; + font-family: Georgia, serif; + font-size: 20px; + color: #1a1a1a; + background-color: #fdfdfd; + } + body { + margin: 0 auto; + max-width: 40em; + padding-left: 50px; + padding-right: 50px; + padding-top: 50px; + padding-bottom: 50px; + hyphens: auto; + word-wrap: break-word; + text-rendering: optimizeLegibility; + font-kerning: normal; + } + @media (max-width: 600px) { + body { + font-size: 0.9em; + padding: 1em; + } + } + @media print { + body { + background-color: transparent; + color: black; + } + p, h2, h3 { + orphans: 3; + widows: 3; + } + h2, h3, h4 { + page-break-after: avoid; + } + } + p { + margin-top: 1.7em; + } + a { + color: #1a1a1a; + } + a:visited { + color: #1a1a1a; + } + img { + max-width: 100%; + } + h1, h2, h3, h4, h5, h6 { + margin-top: 1.7em; + } + ol, ul { + padding-left: 1.7em; + margin-top: 1.7em; + } + li > ol, li > ul { + margin-top: 0; + } + blockquote { + margin: 1.7em 0 1.7em 1.7em; + padding-left: 1em; + border-left: 2px solid #e6e6e6; + font-style: italic; + } + code { + font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; + background-color: #f0f0f0; + font-size: 85%; + margin: 0; + padding: .2em .4em; + } + pre { + line-height: 1.5em; + padding: 1em; + background-color: #f0f0f0; + overflow: auto; + } + pre code { + padding: 0; + overflow: visible; + } + hr { + background-color: #1a1a1a; + border: none; + height: 1px; + margin-top: 1.7em; + } + table { + border-collapse: collapse; + width: 100%; + overflow-x: auto; + display: block; + } + th, td { + border-bottom: 1px solid lightgray; + padding: 1em 3em 1em 0; + } + header { + margin-bottom: 6em; + text-align: center; + } + nav a:not(:hover) { + text-decoration: none; + } code{white-space: pre-wrap;} span.smallcaps{font-variant: small-caps;} span.underline{text-decoration: underline;} diff --git a/test/lhs-test.html+lhs b/test/lhs-test.html+lhs index 980fd83b8..fce29a114 100644 --- a/test/lhs-test.html+lhs +++ b/test/lhs-test.html+lhs @@ -6,6 +6,112 @@ <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <title>lhs-test</title> <style> + html { + line-height: 1.7; + font-family: Georgia, serif; + font-size: 20px; + color: #1a1a1a; + background-color: #fdfdfd; + } + body { + margin: 0 auto; + max-width: 40em; + padding-left: 50px; + padding-right: 50px; + padding-top: 50px; + padding-bottom: 50px; + hyphens: auto; + word-wrap: break-word; + text-rendering: optimizeLegibility; + font-kerning: normal; + } + @media (max-width: 600px) { + body { + font-size: 0.9em; + padding: 1em; + } + } + @media print { + body { + background-color: transparent; + color: black; + } + p, h2, h3 { + orphans: 3; + widows: 3; + } + h2, h3, h4 { + page-break-after: avoid; + } + } + p { + margin-top: 1.7em; + } + a { + color: #1a1a1a; + } + a:visited { + color: #1a1a1a; + } + img { + max-width: 100%; + } + h1, h2, h3, h4, h5, h6 { + margin-top: 1.7em; + } + ol, ul { + padding-left: 1.7em; + margin-top: 1.7em; + } + li > ol, li > ul { + margin-top: 0; + } + blockquote { + margin: 1.7em 0 1.7em 1.7em; + padding-left: 1em; + border-left: 2px solid #e6e6e6; + font-style: italic; + } + code { + font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; + background-color: #f0f0f0; + font-size: 85%; + margin: 0; + padding: .2em .4em; + } + pre { + line-height: 1.5em; + padding: 1em; + background-color: #f0f0f0; + overflow: auto; + } + pre code { + padding: 0; + overflow: visible; + } + hr { + background-color: #1a1a1a; + border: none; + height: 1px; + margin-top: 1.7em; + } + table { + border-collapse: collapse; + width: 100%; + overflow-x: auto; + display: block; + } + th, td { + border-bottom: 1px solid lightgray; + padding: 1em 3em 1em 0; + } + header { + margin-bottom: 6em; + text-align: center; + } + nav a:not(:hover) { + text-decoration: none; + } code{white-space: pre-wrap;} span.smallcaps{font-variant: small-caps;} span.underline{text-decoration: underline;} diff --git a/test/writer.html4 b/test/writer.html4 index 56b78dfb1..735fad48a 100644 --- a/test/writer.html4 +++ b/test/writer.html4 @@ -9,6 +9,112 @@ <meta name="date" content="2006-07-17" /> <title>Pandoc Test Suite</title> <style type="text/css"> + html { + line-height: 1.7; + font-family: Georgia, serif; + font-size: 20px; + color: #1a1a1a; + background-color: #fdfdfd; + } + body { + margin: 0 auto; + max-width: 40em; + padding-left: 50px; + padding-right: 50px; + padding-top: 50px; + padding-bottom: 50px; + hyphens: auto; + word-wrap: break-word; + text-rendering: optimizeLegibility; + font-kerning: normal; + } + @media (max-width: 600px) { + body { + font-size: 0.9em; + padding: 1em; + } + } + @media print { + body { + background-color: transparent; + color: black; + } + p, h2, h3 { + orphans: 3; + widows: 3; + } + h2, h3, h4 { + page-break-after: avoid; + } + } + p { + margin-top: 1.7em; + } + a { + color: #1a1a1a; + } + a:visited { + color: #1a1a1a; + } + img { + max-width: 100%; + } + h1, h2, h3, h4, h5, h6 { + margin-top: 1.7em; + } + ol, ul { + padding-left: 1.7em; + margin-top: 1.7em; + } + li > ol, li > ul { + margin-top: 0; + } + blockquote { + margin: 1.7em 0 1.7em 1.7em; + padding-left: 1em; + border-left: 2px solid #e6e6e6; + font-style: italic; + } + code { + font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; + background-color: #f0f0f0; + font-size: 85%; + margin: 0; + padding: .2em .4em; + } + pre { + line-height: 1.5em; + padding: 1em; + background-color: #f0f0f0; + overflow: auto; + } + pre code { + padding: 0; + overflow: visible; + } + hr { + background-color: #1a1a1a; + border: none; + height: 1px; + margin-top: 1.7em; + } + table { + border-collapse: collapse; + width: 100%; + overflow-x: auto; + display: block; + } + th, td { + border-bottom: 1px solid lightgray; + padding: 1em 3em 1em 0; + } + header { + margin-bottom: 6em; + text-align: center; + } + nav a:not(:hover) { + text-decoration: none; + } code{white-space: pre-wrap;} span.smallcaps{font-variant: small-caps;} span.underline{text-decoration: underline;} diff --git a/test/writer.html5 b/test/writer.html5 index 0f0db799e..76ede4cca 100644 --- a/test/writer.html5 +++ b/test/writer.html5 @@ -9,6 +9,112 @@ <meta name="dcterms.date" content="2006-07-17" /> <title>Pandoc Test Suite</title> <style> + html { + line-height: 1.7; + font-family: Georgia, serif; + font-size: 20px; + color: #1a1a1a; + background-color: #fdfdfd; + } + body { + margin: 0 auto; + max-width: 40em; + padding-left: 50px; + padding-right: 50px; + padding-top: 50px; + padding-bottom: 50px; + hyphens: auto; + word-wrap: break-word; + text-rendering: optimizeLegibility; + font-kerning: normal; + } + @media (max-width: 600px) { + body { + font-size: 0.9em; + padding: 1em; + } + } + @media print { + body { + background-color: transparent; + color: black; + } + p, h2, h3 { + orphans: 3; + widows: 3; + } + h2, h3, h4 { + page-break-after: avoid; + } + } + p { + margin-top: 1.7em; + } + a { + color: #1a1a1a; + } + a:visited { + color: #1a1a1a; + } + img { + max-width: 100%; + } + h1, h2, h3, h4, h5, h6 { + margin-top: 1.7em; + } + ol, ul { + padding-left: 1.7em; + margin-top: 1.7em; + } + li > ol, li > ul { + margin-top: 0; + } + blockquote { + margin: 1.7em 0 1.7em 1.7em; + padding-left: 1em; + border-left: 2px solid #e6e6e6; + font-style: italic; + } + code { + font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; + background-color: #f0f0f0; + font-size: 85%; + margin: 0; + padding: .2em .4em; + } + pre { + line-height: 1.5em; + padding: 1em; + background-color: #f0f0f0; + overflow: auto; + } + pre code { + padding: 0; + overflow: visible; + } + hr { + background-color: #1a1a1a; + border: none; + height: 1px; + margin-top: 1.7em; + } + table { + border-collapse: collapse; + width: 100%; + overflow-x: auto; + display: block; + } + th, td { + border-bottom: 1px solid lightgray; + padding: 1em 3em 1em 0; + } + header { + margin-bottom: 6em; + text-align: center; + } + nav a:not(:hover) { + text-decoration: none; + } code{white-space: pre-wrap;} span.smallcaps{font-variant: small-caps;} span.underline{text-decoration: underline;} |