diff options
-rw-r--r-- | MANUAL.txt | 27 | ||||
-rw-r--r-- | data/templates/styles.html | 49 | ||||
-rw-r--r-- | test/lhs-test.html | 45 | ||||
-rw-r--r-- | test/lhs-test.html+lhs | 45 | ||||
-rw-r--r-- | test/writer.html4 | 45 | ||||
-rw-r--r-- | test/writer.html5 | 45 |
6 files changed, 213 insertions, 43 deletions
diff --git a/MANUAL.txt b/MANUAL.txt index 7ac314b62..74754e640 100644 --- a/MANUAL.txt +++ b/MANUAL.txt @@ -2190,7 +2190,7 @@ ODT or pptx. ### Variables for HTML `document-css` -: Enables inclusion of most of the CSS in the `styles.html` +: 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 @@ -2214,6 +2214,9 @@ ODT or pptx. `monofont` : sets the CSS `font-family` property on `code` elements. +`monobackgroundcolor` +: sets the CSS `background-color` property on `code` elements. + `linestretch` : sets the CSS `line-height` property on the `html` element, which is preferred to be unitless. @@ -2224,6 +2227,28 @@ ODT or pptx. `margin-left`, `margin-right`, `margin-top`, `margin-bottom` : sets the corresponding CSS `padding` properties on the `body` element. +To override or extend some [CSS] for just one document, include for example: + + --- + header-includes: | + <style> + blockquote { + font-style: italic; + } + tr.even { + background-color: #f0f0f0; + } + td, th { + padding: 0.5em 2em 0.5em 0.5em; + } + tbody { + border-bottom: none; + } + </style> + --- + +[CSS]: https://developer.mozilla.org/en-US/docs/Learn/CSS + ### Variables for HTML math `classoption` diff --git a/data/templates/styles.html b/data/templates/styles.html index 3d7ebb55d..f70797f70 100644 --- a/data/templates/styles.html +++ b/data/templates/styles.html @@ -2,7 +2,7 @@ $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$; + font-size: $if(fontsize)$$fontsize$$else$18px$endif$; color: $if(fontcolor)$$fontcolor$$else$#1a1a1a$endif$; background-color: $if(backgroundcolor)$$backgroundcolor$$else$#fdfdfd$endif$; } @@ -38,7 +38,7 @@ body { } } p { - margin-top: 1.7em; + margin: 1.7em 0; } a { color: $if(linkcolor)$$linkcolor$$else$#1a1a1a$endif$; @@ -52,6 +52,13 @@ img { h1, h2, h3, h4, h5, h6 { margin-top: 1.7em; } +h5, h6 { + font-size: $if(fontsize)$$fontsize$$else$18px$endif$; + font-style: italic; +} +h6 { + font-weight: normal; +} ol, ul { padding-left: 1.7em; margin-top: 1.7em; @@ -63,46 +70,68 @@ blockquote { margin: 1.7em 0 1.7em 1.7em; padding-left: 1em; border-left: 2px solid #e6e6e6; - font-style: italic; + color: #606060; } code { font-family: $if(monofont)$$monofont$$else$Menlo, Monaco, 'Lucida Console', Consolas, monospace$endif$; - background-color: #f0f0f0; + background-color: $if(monobackgroundcolor)$$monobackgroundcolor$$else$#f0f0f0$endif$; font-size: 85%; margin: 0; padding: .2em .4em; } pre { + margin: 1.7em 0; line-height: 1.5em; padding: 1em; - background-color: #f0f0f0; + background-color: $if(monobackgroundcolor)$$monobackgroundcolor$$else$#f0f0f0$endif$; overflow: auto; } pre code { padding: 0; overflow: visible; } +.sourceCode { + background-color: transparent; + overflow: visible; +} hr { background-color: #1a1a1a; border: none; height: 1px; - margin-top: 1.7em; + margin: 1.7em 0; } table { + margin: 1.7em 0; border-collapse: collapse; width: 100%; overflow-x: auto; display: block; + font-variant-numeric: lining-nums tabular-nums; +} +table caption { + margin-bottom: 0.75em; +} +tbody { + border-top: 1px solid $if(fontcolor)$$fontcolor$$else$#1a1a1a$endif$; + border-bottom: 1px solid $if(fontcolor)$$fontcolor$$else$#1a1a1a$endif$; } -th, td { - border-bottom: 1px solid lightgray; - padding: 1em 3em 1em 0; +th { + border-top: 1px solid $if(fontcolor)$$fontcolor$$else$#1a1a1a$endif$; + padding: 0.25em 0.5em 0.25em 0.5em; + line-height: 1; +} +td { + padding: 0.125em 0.5em 0.25em 0.5em; + line-height: 1; } header { margin-bottom: 6em; text-align: center; } -nav a:not(:hover) { +#TOC li { + list-style: none; +} +#TOC a:not(:hover) { text-decoration: none; } $endif$ diff --git a/test/lhs-test.html b/test/lhs-test.html index e5f76051e..78bdb7238 100644 --- a/test/lhs-test.html +++ b/test/lhs-test.html @@ -9,7 +9,7 @@ html { line-height: 1.7; font-family: Georgia, serif; - font-size: 20px; + font-size: 18px; color: #1a1a1a; background-color: #fdfdfd; } @@ -45,7 +45,7 @@ } } p { - margin-top: 1.7em; + margin: 1.7em 0; } a { color: #1a1a1a; @@ -59,6 +59,13 @@ h1, h2, h3, h4, h5, h6 { margin-top: 1.7em; } + h5, h6 { + font-size: 18px; + font-style: italic; + } + h6 { + font-weight: normal; + } ol, ul { padding-left: 1.7em; margin-top: 1.7em; @@ -70,7 +77,7 @@ margin: 1.7em 0 1.7em 1.7em; padding-left: 1em; border-left: 2px solid #e6e6e6; - font-style: italic; + color: #606060; } code { font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; @@ -80,6 +87,7 @@ padding: .2em .4em; } pre { + margin: 1.7em 0; line-height: 1.5em; padding: 1em; background-color: #f0f0f0; @@ -89,27 +97,48 @@ padding: 0; overflow: visible; } + .sourceCode { + background-color: transparent; + overflow: visible; + } hr { background-color: #1a1a1a; border: none; height: 1px; - margin-top: 1.7em; + margin: 1.7em 0; } table { + margin: 1.7em 0; border-collapse: collapse; width: 100%; overflow-x: auto; display: block; + font-variant-numeric: lining-nums tabular-nums; + } + table caption { + margin-bottom: 0.75em; + } + tbody { + border-top: 1px solid #1a1a1a; + border-bottom: 1px solid #1a1a1a; } - th, td { - border-bottom: 1px solid lightgray; - padding: 1em 3em 1em 0; + th { + border-top: 1px solid #1a1a1a; + padding: 0.25em 0.5em 0.25em 0.5em; + line-height: 1; + } + td { + padding: 0.125em 0.5em 0.25em 0.5em; + line-height: 1; } header { margin-bottom: 6em; text-align: center; } - nav a:not(:hover) { + #TOC li { + list-style: none; + } + #TOC a:not(:hover) { text-decoration: none; } code{white-space: pre-wrap;} diff --git a/test/lhs-test.html+lhs b/test/lhs-test.html+lhs index fce29a114..90cb1fc0d 100644 --- a/test/lhs-test.html+lhs +++ b/test/lhs-test.html+lhs @@ -9,7 +9,7 @@ html { line-height: 1.7; font-family: Georgia, serif; - font-size: 20px; + font-size: 18px; color: #1a1a1a; background-color: #fdfdfd; } @@ -45,7 +45,7 @@ } } p { - margin-top: 1.7em; + margin: 1.7em 0; } a { color: #1a1a1a; @@ -59,6 +59,13 @@ h1, h2, h3, h4, h5, h6 { margin-top: 1.7em; } + h5, h6 { + font-size: 18px; + font-style: italic; + } + h6 { + font-weight: normal; + } ol, ul { padding-left: 1.7em; margin-top: 1.7em; @@ -70,7 +77,7 @@ margin: 1.7em 0 1.7em 1.7em; padding-left: 1em; border-left: 2px solid #e6e6e6; - font-style: italic; + color: #606060; } code { font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; @@ -80,6 +87,7 @@ padding: .2em .4em; } pre { + margin: 1.7em 0; line-height: 1.5em; padding: 1em; background-color: #f0f0f0; @@ -89,27 +97,48 @@ padding: 0; overflow: visible; } + .sourceCode { + background-color: transparent; + overflow: visible; + } hr { background-color: #1a1a1a; border: none; height: 1px; - margin-top: 1.7em; + margin: 1.7em 0; } table { + margin: 1.7em 0; border-collapse: collapse; width: 100%; overflow-x: auto; display: block; + font-variant-numeric: lining-nums tabular-nums; + } + table caption { + margin-bottom: 0.75em; + } + tbody { + border-top: 1px solid #1a1a1a; + border-bottom: 1px solid #1a1a1a; } - th, td { - border-bottom: 1px solid lightgray; - padding: 1em 3em 1em 0; + th { + border-top: 1px solid #1a1a1a; + padding: 0.25em 0.5em 0.25em 0.5em; + line-height: 1; + } + td { + padding: 0.125em 0.5em 0.25em 0.5em; + line-height: 1; } header { margin-bottom: 6em; text-align: center; } - nav a:not(:hover) { + #TOC li { + list-style: none; + } + #TOC a:not(:hover) { text-decoration: none; } code{white-space: pre-wrap;} diff --git a/test/writer.html4 b/test/writer.html4 index 735fad48a..f1f6e9c98 100644 --- a/test/writer.html4 +++ b/test/writer.html4 @@ -12,7 +12,7 @@ html { line-height: 1.7; font-family: Georgia, serif; - font-size: 20px; + font-size: 18px; color: #1a1a1a; background-color: #fdfdfd; } @@ -48,7 +48,7 @@ } } p { - margin-top: 1.7em; + margin: 1.7em 0; } a { color: #1a1a1a; @@ -62,6 +62,13 @@ h1, h2, h3, h4, h5, h6 { margin-top: 1.7em; } + h5, h6 { + font-size: 18px; + font-style: italic; + } + h6 { + font-weight: normal; + } ol, ul { padding-left: 1.7em; margin-top: 1.7em; @@ -73,7 +80,7 @@ margin: 1.7em 0 1.7em 1.7em; padding-left: 1em; border-left: 2px solid #e6e6e6; - font-style: italic; + color: #606060; } code { font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; @@ -83,6 +90,7 @@ padding: .2em .4em; } pre { + margin: 1.7em 0; line-height: 1.5em; padding: 1em; background-color: #f0f0f0; @@ -92,27 +100,48 @@ padding: 0; overflow: visible; } + .sourceCode { + background-color: transparent; + overflow: visible; + } hr { background-color: #1a1a1a; border: none; height: 1px; - margin-top: 1.7em; + margin: 1.7em 0; } table { + margin: 1.7em 0; border-collapse: collapse; width: 100%; overflow-x: auto; display: block; + font-variant-numeric: lining-nums tabular-nums; + } + table caption { + margin-bottom: 0.75em; + } + tbody { + border-top: 1px solid #1a1a1a; + border-bottom: 1px solid #1a1a1a; } - th, td { - border-bottom: 1px solid lightgray; - padding: 1em 3em 1em 0; + th { + border-top: 1px solid #1a1a1a; + padding: 0.25em 0.5em 0.25em 0.5em; + line-height: 1; + } + td { + padding: 0.125em 0.5em 0.25em 0.5em; + line-height: 1; } header { margin-bottom: 6em; text-align: center; } - nav a:not(:hover) { + #TOC li { + list-style: none; + } + #TOC a:not(:hover) { text-decoration: none; } code{white-space: pre-wrap;} diff --git a/test/writer.html5 b/test/writer.html5 index 76ede4cca..cb33a106d 100644 --- a/test/writer.html5 +++ b/test/writer.html5 @@ -12,7 +12,7 @@ html { line-height: 1.7; font-family: Georgia, serif; - font-size: 20px; + font-size: 18px; color: #1a1a1a; background-color: #fdfdfd; } @@ -48,7 +48,7 @@ } } p { - margin-top: 1.7em; + margin: 1.7em 0; } a { color: #1a1a1a; @@ -62,6 +62,13 @@ h1, h2, h3, h4, h5, h6 { margin-top: 1.7em; } + h5, h6 { + font-size: 18px; + font-style: italic; + } + h6 { + font-weight: normal; + } ol, ul { padding-left: 1.7em; margin-top: 1.7em; @@ -73,7 +80,7 @@ margin: 1.7em 0 1.7em 1.7em; padding-left: 1em; border-left: 2px solid #e6e6e6; - font-style: italic; + color: #606060; } code { font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; @@ -83,6 +90,7 @@ padding: .2em .4em; } pre { + margin: 1.7em 0; line-height: 1.5em; padding: 1em; background-color: #f0f0f0; @@ -92,27 +100,48 @@ padding: 0; overflow: visible; } + .sourceCode { + background-color: transparent; + overflow: visible; + } hr { background-color: #1a1a1a; border: none; height: 1px; - margin-top: 1.7em; + margin: 1.7em 0; } table { + margin: 1.7em 0; border-collapse: collapse; width: 100%; overflow-x: auto; display: block; + font-variant-numeric: lining-nums tabular-nums; + } + table caption { + margin-bottom: 0.75em; + } + tbody { + border-top: 1px solid #1a1a1a; + border-bottom: 1px solid #1a1a1a; } - th, td { - border-bottom: 1px solid lightgray; - padding: 1em 3em 1em 0; + th { + border-top: 1px solid #1a1a1a; + padding: 0.25em 0.5em 0.25em 0.5em; + line-height: 1; + } + td { + padding: 0.125em 0.5em 0.25em 0.5em; + line-height: 1; } header { margin-bottom: 6em; text-align: center; } - nav a:not(:hover) { + #TOC li { + list-style: none; + } + #TOC a:not(:hover) { text-decoration: none; } code{white-space: pre-wrap;} |