book.tmpl 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>{{.Title}}</title>
  6. <style>
  7. html, body, div, span, object, h1, h2, h3, h4, h5,
  8. h6, p, blockquote, pre, a, code, em, img, strong,
  9. dl, ol, ul, li, embed, footer, header, menu, nav,
  10. time, audio, video, progress {
  11. margin: 0;
  12. padding: 0;
  13. border: 0;
  14. font: inherit;
  15. vertical-align: baseline;
  16. }
  17. footer, header, menu { display: block; }
  18. audio, canvas, progress, video {
  19. display: inline-block;
  20. vertical-align: baseline;
  21. }
  22. html { font-family: helvetica; font-size: 22px; }
  23. body {
  24. line-height: 1.4;
  25. color: #333;
  26. background-color: #fff;
  27. }
  28. h1 { font-size: 1.75em; }
  29. h2 { font-size: 1.5em; }
  30. h3 { font-size: 1.25em; }
  31. h1, h2, h3, h4, h5, h6 {
  32. font-family: sans-serif, georgia;
  33. margin-top: 20px;
  34. margin-bottom: 12px;
  35. letter-spacing: 2px;
  36. }
  37. h3, h4 { margin-top: 15px; margin-bottom: 10px; }
  38. h5, h6 { margin-top: 10px; }
  39. h1, h2 { font-weight: bolder; }
  40. h3, h4, strong, b { font-weight: bold; }
  41. em { font-style: italic; font-weight: 200; }
  42. blockquote {
  43. font-family: sans-serif, helvetica;
  44. quotes: none;
  45. padding: 10px 20px;
  46. margin: 0 0 20px;
  47. border-left: 5px solid #eee;
  48. font-style: italic;
  49. }
  50. hr {
  51. height: 0;
  52. margin: 20px 0;
  53. border: 0;
  54. border-top: 1px solid #eee;
  55. }
  56. pre { font-family: monospace; }
  57. code {
  58. padding: 2px 4px;
  59. font-size: 0.9em;
  60. padding: 0.05em 4px;
  61. border-radius: 4px;
  62. background: #000;
  63. overflow-x: auto;
  64. color: #f8f8f8;
  65. }
  66. pre code {
  67. display: block;
  68. margin: 10px 0;
  69. padding: 0.5em;
  70. }
  71. ul { list-style: disc; }
  72. ol { list-style: decimal; }
  73. li {
  74. margin-left: 45px;
  75. margin-bottom: 5px;
  76. line-height: 1.25;
  77. }
  78. ul, ol, dl, p { margin-bottom: 10px; }
  79. a, a:visited { color: #337ab7; }
  80. a:hover, a:active {
  81. background-color: transparent;
  82. text-decoration: underline;
  83. outline: 0;
  84. color: inherit;
  85. }
  86. a:hover, a:focus {
  87. text-decoration: underline;
  88. color: #23527c;
  89. }
  90. a:focus {
  91. outline: thin dotted;
  92. text-decoration: underline;
  93. outline-offset: -2px;
  94. }
  95. h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited,
  96. h4 a, h4 a:visited, strong a, strong a:visited {
  97. color: #444;
  98. text-decoration: underline;
  99. }
  100. img {
  101. display: block;
  102. border: none;
  103. max-width: 100%;
  104. height: auto;
  105. vertical-align: middle;
  106. }
  107. header, .content, footer {
  108. max-width: 980px;
  109. margin: 20px auto;
  110. padding: 0 2%;
  111. }
  112. header>a {
  113. color: #000;
  114. text-decoration: none;
  115. }
  116. header h1 { margin-bottom: 15px; }
  117. nav ul { margin-left: 25px; }
  118. nav ul li {
  119. font-size: 1.5em;
  120. line-height: 2;
  121. padding: 0 15px;
  122. }
  123. footer { text-align: center; }
  124. .group:after {
  125. content: "";
  126. display: table;
  127. clear: both;
  128. }
  129. @media only screen and (min-width: 981px) {
  130. html { font-size: 19px; }
  131. }
  132. @media only screen and (min-width: 1200px) {
  133. html { font-size: 16px; }
  134. a, a:hover, a:active, a:visited, h1 a, h2 a, h3 a, h4 a, strong a {
  135. text-decoration: none;
  136. }
  137. header h1 { font-size: 3em; }
  138. }
  139. @media print {
  140. p, ul, ol, li { orphans: 5; widows: 3; }
  141. ul, ol, blockquote, pre, code {
  142. page-break-inside: avoid;
  143. }
  144. h2, h3, h4 { page-break-after: avoid; }
  145. html { font-size: 1em; }
  146. body { background: white; }
  147. .content { background: transparent; }
  148. p a[href^="http"]:after, li a[href^="http"]:after {
  149. content: " (" attr(href) ")";
  150. }
  151. }
  152. </style>
  153. </head>
  154. <body>
  155. <header>
  156. <h1>{{.Title}}</h1>
  157. <nav></nav>
  158. </header>
  159. <div class="content">{{.Content}}</div>
  160. <footer>
  161. <p>{{if .Version}}{{.Version}}{{end}}</p>
  162. <div class="scripts">
  163. <script>
  164. (function() {
  165. var nav = document.querySelector("nav");
  166. if (typeof nav === "undefined") {
  167. return
  168. }
  169. var headers = document.querySelectorAll("h1,h2,h3,h4,h5,h6");
  170. if (headers.length === 0) {
  171. return
  172. }
  173. var depth = 1, list = document.createElement("ul");
  174. var i, l = headers.length;
  175. for (i = 0; i < l; i++) {
  176. var anchorAddress = "navigation-" + i;
  177. var anchor = document.createElement("a");
  178. anchor.setAttribute("name", anchorAddress);
  179. headers[i].parentNode.insertBefore(anchor, headers[i]);
  180. var navName = headers[i].innerText;
  181. var listItem = document.createElement("li");
  182. var listItemLink = document.createElement("a");
  183. listItemLink.appendChild(document.createTextNode(navName));
  184. listItemLink.setAttribute("href", "#"+anchorAddress);
  185. listItem.appendChild(listItemLink);
  186. var tn = headers[i].tagName;
  187. var tnl = tn[tn.length-1];
  188. if (tnl == depth) {
  189. list.appendChild(listItem);
  190. } else if (tnl > depth) {
  191. do {
  192. var nl = document.createElement("ul");
  193. list.appendChild(nl);
  194. list = nl;
  195. depth++;
  196. } while (depth != tnl);
  197. list.appendChild(listItem);
  198. } else if (tnl < depth) {
  199. while (depth > tnl) {
  200. list = list.parentNode;
  201. depth--;
  202. }
  203. list.appendChild(listItem);
  204. }
  205. }
  206. while (depth > 1) {
  207. list = list.parentNode;
  208. depth--;
  209. }
  210. nav.appendChild(list);
  211. })()
  212. </script>
  213. </div>
  214. </footer>
  215. </body>
  216. </html>