Implement multicolumn support for slide formats.
The structure expected is: <div class="columns"> <div class="column" width="40%"> contents... </div> <div class="column" width="60%"> contents... </div> </div> Support has been added for beamer and all HTML slide formats. Closes #1710. Note: later we could add a more elegant way to create this structure in Markdown than to use raw HTML div elements. This would come for free with a "native div syntax" (#168). Or we could devise something specific to slides
This commit is contained in:
parent
23d29ee10c
commit
892a4edeb1
17 changed files with 133 additions and 3 deletions
|
@ -15,6 +15,7 @@ $endif$
|
|||
<style type="text/css">
|
||||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -18,6 +18,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -18,6 +18,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -21,6 +21,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -19,6 +19,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -20,6 +20,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -20,6 +20,7 @@ $endif$
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
$if(quotes)$
|
||||
q { quotes: "“" "”" "‘" "’"; }
|
||||
$endif$
|
||||
|
|
|
@ -640,8 +640,14 @@ blockToHtml opts (LineBlock lns) =
|
|||
let lf = preEscapedString "\n"
|
||||
htmlLines <- mconcat . intersperse lf <$> mapM (inlineListToHtml opts) lns
|
||||
return $ H.div ! A.class_ "line-block" $ htmlLines
|
||||
blockToHtml opts (Div attr@(ident, classes, kvs) bs) = do
|
||||
blockToHtml opts (Div attr@(ident, classes, kvs') bs) = do
|
||||
html5 <- gets stHtml5
|
||||
let kvs = kvs' ++
|
||||
if "column" `elem` classes
|
||||
then let w = fromMaybe "48%" (lookup "width" kvs')
|
||||
in [("style", "width:" ++ w ++ ";min-width:" ++ w ++
|
||||
";vertical-align:top;")]
|
||||
else []
|
||||
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
|
||||
|
|
|
@ -452,7 +452,25 @@ blockToLaTeX (Div (identifier,classes,kvs) bs) = do
|
|||
_ -> linkAnchor'
|
||||
let align dir txt = inCmd "begin" dir $$ txt $$ inCmd "end" dir
|
||||
lang <- toLang $ lookup "lang" kvs
|
||||
let wrapDir = case lookup "dir" kvs of
|
||||
let wrapColumns = if "columns" `elem` classes
|
||||
then \contents ->
|
||||
inCmd "begin" "columns" <> brackets "T"
|
||||
$$ contents
|
||||
$$ inCmd "end" "columns"
|
||||
else id
|
||||
wrapColumn = if "column" `elem` classes
|
||||
then \contents ->
|
||||
let fromPct xs =
|
||||
case reverse xs of
|
||||
'%':ds -> '0':'.': reverse ds
|
||||
_ -> xs
|
||||
w = maybe "0.48" fromPct (lookup "width" kvs)
|
||||
in inCmd "begin" "column" <>
|
||||
braces (text w <> "\\textwidth")
|
||||
$$ contents
|
||||
$$ inCmd "end" "column"
|
||||
else id
|
||||
wrapDir = case lookup "dir" kvs of
|
||||
Just "rtl" -> align "RTL"
|
||||
Just "ltr" -> align "LTR"
|
||||
_ -> id
|
||||
|
@ -468,7 +486,8 @@ blockToLaTeX (Div (identifier,classes,kvs) bs) = do
|
|||
wrapNotes txt = if beamer && "notes" `elem` classes
|
||||
then "\\note" <> braces txt -- speaker notes
|
||||
else linkAnchor $$ txt
|
||||
fmap (wrapDir . wrapLang . wrapNotes) $ blockListToLaTeX bs
|
||||
fmap (wrapColumns . wrapColumn . wrapDir . wrapLang . wrapNotes)
|
||||
$ blockListToLaTeX bs
|
||||
blockToLaTeX (Plain lst) =
|
||||
inlineListToLaTeX $ dropWhile isLineBreakOrSpace lst
|
||||
-- title beginning with fig: indicates that the image is a figure
|
||||
|
|
91
test/command/1710.md
Normal file
91
test/command/1710.md
Normal file
|
@ -0,0 +1,91 @@
|
|||
```
|
||||
% pandoc -t revealjs
|
||||
# Slide one
|
||||
|
||||
<div class="columns">
|
||||
<div class="column" width="40%">
|
||||
- a
|
||||
- b
|
||||
</div>
|
||||
<div class="column" width="40%">
|
||||
- c
|
||||
- d
|
||||
</div>
|
||||
<div class="column" width="10%">
|
||||
ok
|
||||
</div>
|
||||
</div>
|
||||
^D
|
||||
<section id="slide-one" class="slide level1">
|
||||
<h1>Slide one</h1>
|
||||
<div class="columns">
|
||||
<div class="column" width="40%" style="width:40%;min-width:40%;vertical-align:top;">
|
||||
<ul>
|
||||
<li>a</li>
|
||||
<li>b</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="column" width="40%" style="width:40%;min-width:40%;vertical-align:top;">
|
||||
<ul>
|
||||
<li>c</li>
|
||||
<li>d</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="column" width="10%" style="width:10%;min-width:10%;vertical-align:top;">
|
||||
<p>ok</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
```
|
||||
|
||||
```
|
||||
% pandoc -t beamer
|
||||
# Slide one
|
||||
|
||||
<div class="columns">
|
||||
<div class="column" width="40%">
|
||||
- a
|
||||
- b
|
||||
</div>
|
||||
<div class="column" width="40%">
|
||||
- c
|
||||
- d
|
||||
</div>
|
||||
<div class="column" width="10%">
|
||||
ok
|
||||
</div>
|
||||
</div>
|
||||
^D
|
||||
\begin{frame}{%
|
||||
\protect\hypertarget{slide-one}{%
|
||||
Slide one}}
|
||||
|
||||
\begin{columns}[T]
|
||||
\begin{column}{0.40\textwidth}
|
||||
\begin{itemize}
|
||||
\tightlist
|
||||
\item
|
||||
a
|
||||
\item
|
||||
b
|
||||
\end{itemize}
|
||||
\end{column}
|
||||
|
||||
\begin{column}{0.40\textwidth}
|
||||
\begin{itemize}
|
||||
\tightlist
|
||||
\item
|
||||
c
|
||||
\item
|
||||
d
|
||||
\end{itemize}
|
||||
\end{column}
|
||||
|
||||
\begin{column}{0.10\textwidth}
|
||||
ok
|
||||
\end{column}
|
||||
\end{columns}
|
||||
|
||||
\end{frame}
|
||||
```
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
<style type="text/css">
|
||||
div.sourceCode { overflow-x: auto; }
|
||||
|
|
|
@ -9,6 +9,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
<style type="text/css">
|
||||
div.sourceCode { overflow-x: auto; }
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
<!-- configuration parameters -->
|
||||
<meta name="defaultView" content="slideshow" />
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
<!-- configuration parameters -->
|
||||
<meta name="defaultView" content="slideshow" />
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
<link rel="stylesheet" href="main.css" type="text/css" />
|
||||
STUFF INSERTED
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
code{white-space: pre-wrap;}
|
||||
.smallcaps{font-variant: small-caps;}
|
||||
.line-block{white-space: pre-line;}
|
||||
.column{display: inline-block;}
|
||||
</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