Improved support for columns in HTML.
* Move as much as possible to the CSS in the template. * Ensure that all the HTML-based templates (including epub) contain the CSS for columns. * Columns default to 50% width unless they are given a width attribute. Closes #4028.
This commit is contained in:
parent
5282688126
commit
642d603666
18 changed files with 53 additions and 53 deletions
|
@ -14,8 +14,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -8,8 +8,9 @@
|
|||
<title>$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -7,8 +7,9 @@
|
|||
<title>$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -16,9 +16,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -16,9 +16,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -19,9 +19,9 @@ $endif$
|
|||
<link rel="stylesheet" href="$revealjs-url$/css/reveal.css">
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -17,9 +17,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -18,9 +18,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -18,9 +18,9 @@ $endif$
|
|||
<title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -658,11 +658,8 @@ blockToHtml opts (LineBlock lns) =
|
|||
blockToHtml opts (Div attr@(ident, classes, kvs') bs) = do
|
||||
html5 <- gets stHtml5
|
||||
let kvs = [(k,v) | (k,v) <- kvs', k /= "width"] ++
|
||||
if "column" `elem` classes
|
||||
then let w = fromMaybe "48%" (lookup "width" kvs')
|
||||
in [("style", "width:" ++ w ++ ";min-width:" ++ w ++
|
||||
";vertical-align:top;")]
|
||||
else []
|
||||
[("style", "width:" ++ w ++ ";")
|
||||
| ("width",w) <- kvs', "column" `elem` classes]
|
||||
let speakerNotes = "notes" `elem` classes
|
||||
-- we don't want incremental output inside speaker notes, see #1394
|
||||
let opts' = if speakerNotes then opts{ writerIncremental = False } else opts
|
||||
|
|
|
@ -19,17 +19,17 @@ ok
|
|||
<section id="slide-one" class="slide level1">
|
||||
<h1>Slide one</h1>
|
||||
<div class="columns">
|
||||
<div class="column" style="width:40%;min-width:40%;vertical-align:top;">
|
||||
<div class="column" style="width:40%;">
|
||||
<ul>
|
||||
<li>a</li>
|
||||
<li>b</li>
|
||||
</ul>
|
||||
</div><div class="column" style="width:40%;min-width:40%;vertical-align:top;">
|
||||
</div><div class="column" style="width:40%;">
|
||||
<ul>
|
||||
<li>c</li>
|
||||
<li>d</li>
|
||||
</ul>
|
||||
</div><div class="column" style="width:10%;min-width:10%;vertical-align:top;">
|
||||
</div><div class="column" style="width:10%;">
|
||||
<p>ok</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -7,9 +7,9 @@
|
|||
<title>lhs-test</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<style type="text/css">
|
||||
div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
|
||||
|
|
|
@ -7,9 +7,9 @@
|
|||
<title>lhs-test</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<style type="text/css">
|
||||
div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
|
||||
|
|
|
@ -12,9 +12,9 @@
|
|||
<title>My S5 Document</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<!-- configuration parameters -->
|
||||
<meta name="defaultView" content="slideshow" />
|
||||
|
|
|
@ -12,9 +12,9 @@
|
|||
<title>My S5 Document</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<!-- configuration parameters -->
|
||||
<meta name="defaultView" content="slideshow" />
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
<title>My S5 Document</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<link rel="stylesheet" href="main.css" type="text/css" />
|
||||
STUFF INSERTED
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
<title>Pandoc Test Suite</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
<title>Pandoc Test Suite</title>
|
||||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
span.smallcaps{font-variant: small-caps;}
|
||||
div.line-block{white-space: pre-line;}
|
||||
div.column{display: inline-block; vertical-align: top; width: 50%;}
|
||||
</style>
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
|
||||
|
|
Loading…
Add table
Reference in a new issue