git.iko.soy/typeable/pandoc
on master help sign in
Merge pull request #143 from adunning/patch-1
2d4df82John MacFarlane
default.dzslides+107−37
@@ -1,14 +1,21 @@
1<!DOCTYPE html>
1<!DOCTYPE html>
2−<head>
2+<head$if(lang)$ lang="$lang$"$endif$$if(dir)$ dir="$dir$"$endif$>
3−<meta charset="utf-8">
3+ <meta charset="utf-8">
4+ <meta name="generator" content="pandoc">
4$for(author-meta)$
5$for(author-meta)$
5− <meta name="author" content="$author-meta$" />
6+ <meta name="author" content="$author-meta$">
6$endfor$
7$endfor$
7$if(date-meta)$
8$if(date-meta)$
8− <meta name="dcterms.date" content="$date-meta$" />
9+ <meta name="dcterms.date" content="$date-meta$">
10+$endif$
11+$if(keywords)$
12+ <meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$">
9$endif$
13$endif$
10 <title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
14 <title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
11 <style type="text/css">code{white-space: pre;}</style>
15 <style type="text/css">code{white-space: pre;}</style>
16+$if(quotes)$
17+ <style type="text/css">q { quotes: "“" "”" "‘" "’"; }</style>
18+$endif$
12$if(highlighting-css)$
19$if(highlighting-css)$
13 <style type="text/css">
20 <style type="text/css">
14$highlighting-css$
21$highlighting-css$
@@ -16,40 +23,87 @@ $highlighting-css$
16$endif$
23$endif$
17$if(css)$
24$if(css)$
18$for(css)$
25$for(css)$
19− <link rel="stylesheet" href="$css$" $if(html5)$$else$type="text/css" $endif$/>
26+ <link rel="stylesheet" href="$css$">
20$endfor$
27$endfor$
21$else$
28$else$
29+<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet'>
30+
22<style>
31<style>
23− html { background-color: black; }
32+ html, .view body { background-color: black; counter-reset: slideidx; }
24− body { background-color: white; border-radius: 12px}
33+ body, .view section { background-color: white; border-radius: 12px }
25 /* A section is a slide. It's size is 800x600, and this will never change */
34 /* A section is a slide. It's size is 800x600, and this will never change */
26− section {
35+ section, .view head > title {
36+ /* The font from Google */
27− font-family: Arial, serif;
37+ font-family: 'Oswald', arial, serif;
28− font-size: 20pt;
38+ font-size: 30px;
29− }
39+ }
30− address, blockquote, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, ol, p, pre, table, ul, dl { padding: 10px 20px 10px 20px; }
40+
41+ .view section:after {
42+ counter-increment: slideidx;
43+ content: counter(slideidx, decimal-leading-zero);
44+ position: absolute; bottom: -80px; right: 100px;
45+ color: white;
46+ }
47+
48+ .view head > title {
49+ color: white;
50+ text-align: center;
51+ margin: 1em 0 1em 0;
52+ }
53+
31− h1, h2, h3 {
54+ h1, h2 {
55+ margin-top: 200px;
32 text-align: center;
56 text-align: center;
33− margin: 10pt 10pt 20pt 10pt;
57+ font-size: 80px;
34− }
58+ }
35− ul, ol {
59+ h3 {
36− margin: 10px 10px 10px 50px;
60+ margin: 100px 0 50px 100px;
37− }
61+ }
62+
63+ ul {
38− section.titleslide h1 { margin-top: 200px; }
64+ margin: 50px 200px;
39− h1.title { margin-top: 150px; }
65+ }
40− h1 { font-size: 180%; }
66+ li > ul {
67+ margin: 15px 50px;
68+ }
69+
70+ p {
71+ margin: 75px;
41− h2 { font-size: 120%; }
72+ font-size: 50px;
42− h3 { font-size: 100%; }
73+ }
43− q { quotes: "“" "”" "‘" "’"; }
74+
75+ blockquote {
76+ height: 100%;
77+ background-color: black;
78+ color: white;
79+ font-size: 60px;
80+ padding: 50px;
81+ }
44− blockquote { font-style: italic }
82+ blockquote:before {
83+ content: open-quote;
84+ }
85+ blockquote:after {
86+ content: close-quote;
87+ }
88+
45− /* Figures are displayed full-page, with the caption on
89+ /* Figures are displayed full-page, with the caption
46− top of the image/video */
90+ on top of the image/video */
47 figure {
91 figure {
48 background-color: black;
92 background-color: black;
93+ width: 100%;
94+ height: 100%;
95+ }
96+ figure > * {
97+ position: absolute;
98+ }
99+ figure > img, figure > video {
100+ width: 100%; height: 100%;
49 }
101 }
50 figcaption {
102 figcaption {
51 margin: 70px;
103 margin: 70px;
104+ font-size: 50px;
52 }
105 }
106+
53 footer {
107 footer {
54 position: absolute;
108 position: absolute;
55 bottom: 0;
109 bottom: 0;
@@ -66,10 +120,20 @@ $else$
66 https://developer.mozilla.org/en/CSS/CSS_transitions
120 https://developer.mozilla.org/en/CSS/CSS_transitions
67 How to use CSS3 Transitions: */
121 How to use CSS3 Transitions: */
68 section {
122 section {
69− -moz-transition: left 400ms linear 0s;
123+ -moz-transition: left 400ms linear 0s;
70− -webkit-transition: left 400ms linear 0s;
124+ -webkit-transition: left 400ms linear 0s;
71− -ms-transition: left 400ms linear 0s;
125+ -ms-transition: left 400ms linear 0s;
72− transition: left 400ms linear 0s;
126+ transition: left 400ms linear 0s;
127+ }
128+ .view section {
129+ -moz-transition: none;
130+ -webkit-transition: none;
131+ -ms-transition: none;
132+ transition: none;
133+ }
134+
135+ .view section[aria-selected] {
136+ border: 5px red solid;
73 }
137 }
74
138
75 /* Before */
139 /* Before */
@@ -85,10 +149,17 @@ $else$
85 .incremental > * { opacity: 1; }
149 .incremental > * { opacity: 1; }
86
150
87 /* The current item */
151 /* The current item */
88− .incremental > *[aria-selected] { color: red; opacity: 1; }
152+ .incremental > *[aria-selected] { opacity: 1; }
89
153
90 /* The items to-be-selected */
154 /* The items to-be-selected */
91− .incremental > *[aria-selected] ~ * { opacity: 0.2; }
155+ .incremental > *[aria-selected] ~ * { opacity: 0; }
156+
157+ /* The progressbar, at the bottom of the slides, show the global
158+ progress of the presentation. */
159+ #progress-bar {
160+ height: 2px;
161+ background: #AAA;
162+ }
92</style>
163</style>
93$endif$
164$endif$
94$if(math)$
165$if(math)$
@@ -105,10 +176,9 @@ $if(title)$
105$if(subtitle)$
176$if(subtitle)$
106 <h1 class="subtitle">$subtitle$</h1>
177 <h1 class="subtitle">$subtitle$</h1>
107$endif$
178$endif$
108−$for(author)$
179+ <footer>
109− <h2 class="author">$author$</h2>
180+ $if(author)$<span class="author">$for(author)$$author$$sep$, $endfor$</span>$endif$ · $if(date)$<span class="date">$date$</span>$endif$
110−$endfor$
181+ </footer>
111− <h3 class="date">$date$</h3>
112</section>
182</section>
113$endif$
183$endif$
114$for(include-before)$
184$for(include-before)$