diff options
Diffstat (limited to 'res')
-rw-r--r-- | res/style.css | 171 | ||||
-rw-r--r-- | res/template.html | 72 |
2 files changed, 243 insertions, 0 deletions
diff --git a/res/style.css b/res/style.css new file mode 100644 index 0000000..54ee84e --- /dev/null +++ b/res/style.css | |||
@@ -0,0 +1,171 @@ | |||
1 | /* from here */ | ||
2 | |||
3 | .summary { | ||
4 | position: fixed; | ||
5 | top: 0; | ||
6 | bottom: 0; | ||
7 | left: 0; | ||
8 | border-right: 1px solid #1a1a1a; | ||
9 | /* TODO: ugly */ | ||
10 | background-color: hsl(0, 0%, 80%); | ||
11 | transition: transform .2s; | ||
12 | } | ||
13 | |||
14 | .summary.hidden { | ||
15 | transform: translateX(-100%); | ||
16 | } | ||
17 | |||
18 | .summary::before { | ||
19 | content: "x"; | ||
20 | position: absolute; | ||
21 | right: 1em; | ||
22 | top: 0.5em; | ||
23 | } | ||
24 | |||
25 | .summary > ul { | ||
26 | padding-right: 1em; | ||
27 | } | ||
28 | |||
29 | .summary .generated { | ||
30 | color: #5a5a5a; | ||
31 | } | ||
32 | |||
33 | /* from pandoc */ | ||
34 | html { | ||
35 | line-height: 1.5; | ||
36 | font-family: Georgia, serif; | ||
37 | font-size: 20px; | ||
38 | color: #1a1a1a; | ||
39 | background-color: #fdfdfd; | ||
40 | } | ||
41 | body { | ||
42 | margin: 0 auto; | ||
43 | max-width: 36em; | ||
44 | padding-left: 50px; | ||
45 | padding-right: 50px; | ||
46 | padding-top: 50px; | ||
47 | padding-bottom: 50px; | ||
48 | hyphens: auto; | ||
49 | word-wrap: break-word; | ||
50 | text-rendering: optimizeLegibility; | ||
51 | font-kerning: normal; | ||
52 | } | ||
53 | @media (max-width: 600px) { | ||
54 | body { | ||
55 | font-size: 0.9em; | ||
56 | padding: 1em; | ||
57 | } | ||
58 | } | ||
59 | @media print { | ||
60 | body { | ||
61 | background-color: transparent; | ||
62 | color: black; | ||
63 | font-size: 12pt; | ||
64 | } | ||
65 | p, h2, h3 { | ||
66 | orphans: 3; | ||
67 | widows: 3; | ||
68 | } | ||
69 | h2, h3, h4 { | ||
70 | page-break-after: avoid; | ||
71 | } | ||
72 | } | ||
73 | p { | ||
74 | margin: 1em 0; | ||
75 | } | ||
76 | a { | ||
77 | color: #1a1a1a; | ||
78 | } | ||
79 | a:visited { | ||
80 | color: #1a1a1a; | ||
81 | } | ||
82 | img { | ||
83 | max-width: 100%; | ||
84 | } | ||
85 | h1, h2, h3, h4, h5, h6 { | ||
86 | margin-top: 1.4em; | ||
87 | } | ||
88 | h5, h6 { | ||
89 | font-size: 1em; | ||
90 | font-style: italic; | ||
91 | } | ||
92 | h6 { | ||
93 | font-weight: normal; | ||
94 | } | ||
95 | ol, ul { | ||
96 | padding-left: 1.7em; | ||
97 | margin-top: 1em; | ||
98 | } | ||
99 | li > ol, li > ul { | ||
100 | margin-top: 0; | ||
101 | } | ||
102 | blockquote { | ||
103 | margin: 1em 0 1em 1.7em; | ||
104 | padding-left: 1em; | ||
105 | border-left: 2px solid #e6e6e6; | ||
106 | color: #606060; | ||
107 | } | ||
108 | code { | ||
109 | font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace; | ||
110 | font-size: 85%; | ||
111 | margin: 0; | ||
112 | } | ||
113 | pre { | ||
114 | margin: 1em 0; | ||
115 | overflow: auto; | ||
116 | } | ||
117 | pre code { | ||
118 | padding: 0; | ||
119 | overflow: visible; | ||
120 | } | ||
121 | .sourceCode { | ||
122 | background-color: transparent; | ||
123 | overflow: visible; | ||
124 | } | ||
125 | hr { | ||
126 | background-color: #1a1a1a; | ||
127 | border: none; | ||
128 | height: 1px; | ||
129 | margin: 1em 0; | ||
130 | } | ||
131 | table { | ||
132 | margin: 1em 0; | ||
133 | border-collapse: collapse; | ||
134 | width: 100%; | ||
135 | overflow-x: auto; | ||
136 | display: block; | ||
137 | font-variant-numeric: lining-nums tabular-nums; | ||
138 | } | ||
139 | table caption { | ||
140 | margin-bottom: 0.75em; | ||
141 | } | ||
142 | tbody { | ||
143 | margin-top: 0.5em; | ||
144 | border-top: 1px solid #1a1a1a; | ||
145 | border-bottom: 1px solid #1a1a1a; | ||
146 | } | ||
147 | th { | ||
148 | border-top: 1px solid #1a1a1a; | ||
149 | padding: 0.25em 0.5em 0.25em 0.5em; | ||
150 | } | ||
151 | td { | ||
152 | padding: 0.125em 0.5em 0.25em 0.5em; | ||
153 | } | ||
154 | header { | ||
155 | margin-bottom: 4em; | ||
156 | text-align: center; | ||
157 | } | ||
158 | #TOC li { | ||
159 | list-style: none; | ||
160 | } | ||
161 | #TOC a:not(:hover) { | ||
162 | text-decoration: none; | ||
163 | } | ||
164 | code{white-space: pre-wrap;} | ||
165 | span.smallcaps{font-variant: small-caps;} | ||
166 | span.underline{text-decoration: underline;} | ||
167 | div.column{display: inline-block; vertical-align: top; width: 50%;} | ||
168 | div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;} | ||
169 | ul.task-list{list-style: none;} | ||
170 | q { quotes: "“" "”" "‘" "’"; } | ||
171 | .display.math{display: block; text-align: center; margin: 0.5rem auto;} | ||
diff --git a/res/template.html b/res/template.html new file mode 100644 index 0000000..bacb376 --- /dev/null +++ b/res/template.html | |||
@@ -0,0 +1,72 @@ | |||
1 | <!DOCTYPE html> | ||
2 | <html xmlns="http://www.w3.org/1999/xhtml" lang="$lang$" xml:lang="$lang$"$if(dir)$ dir="$dir$"$endif$> | ||
3 | <head> | ||
4 | <meta charset="utf-8" /> | ||
5 | <meta name="generator" content="pandoc" /> | ||
6 | <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> | ||
7 | $for(author-meta)$ | ||
8 | <meta name="author" content="$author-meta$" /> | ||
9 | $endfor$ | ||
10 | $if(date-meta)$ | ||
11 | <meta name="dcterms.date" content="$date-meta$" /> | ||
12 | $endif$ | ||
13 | $if(keywords)$ | ||
14 | <meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" /> | ||
15 | $endif$ | ||
16 | $if(description-meta)$ | ||
17 | <meta name="description" content="$description-meta$" /> | ||
18 | $endif$ | ||
19 | <title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title> | ||
20 | <style> | ||
21 | $styles.html()$ | ||
22 | </style> | ||
23 | $for(css)$ | ||
24 | <link rel="stylesheet" href="$css$" /> | ||
25 | $endfor$ | ||
26 | $if(math)$ | ||
27 | $math$ | ||
28 | $endif$ | ||
29 | <!--[if lt IE 9]> | ||
30 | <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script> | ||
31 | <![endif]--> | ||
32 | $for(header-includes)$ | ||
33 | $header-includes$ | ||
34 | $endfor$ | ||
35 | </head> | ||
36 | <body> | ||
37 | <nav class="summary"> | ||
38 | $summary$ | ||
39 | </nav> | ||
40 | <main> | ||
41 | $for(include-before)$ | ||
42 | $include-before$ | ||
43 | $endfor$ | ||
44 | $if(title)$ | ||
45 | <header id="title-block-header"> | ||
46 | <h1 class="title">$title$</h1> | ||
47 | $if(subtitle)$ | ||
48 | <p class="subtitle">$subtitle$</p> | ||
49 | $endif$ | ||
50 | $for(author)$ | ||
51 | <p class="author">$author$</p> | ||
52 | $endfor$ | ||
53 | $if(date)$ | ||
54 | <p class="date">$date$</p> | ||
55 | $endif$ | ||
56 | </header> | ||
57 | $endif$ | ||
58 | $if(toc)$ | ||
59 | <nav id="$idprefix$TOC" role="doc-toc"> | ||
60 | $if(toc-title)$ | ||
61 | <h2 id="$idprefix$toc-title">$toc-title$</h2> | ||
62 | $endif$ | ||
63 | $table-of-contents$ | ||
64 | </nav> | ||
65 | $endif$ | ||
66 | $body$ | ||
67 | $for(include-after)$ | ||
68 | $include-after$ | ||
69 | $endfor$ | ||
70 | </main> | ||
71 | </body> | ||
72 | </html> | ||