template.mustache 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta http-equiv="Content-Style-Type" content="text/css" />
  6. <meta name="generator" content="pandoc" />$for(author-meta)$
  7. <meta name="author" content="$author-meta$" />
  8. $endfor$
  9. $if(date-meta)$
  10. <meta name="date" content="$date-meta$" />
  11. $endif$
  12. $if(keywords)$
  13. <meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" />
  14. $endif$
  15. <title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
  16. <style type="text/css">
  17. @font-face {
  18. font-family: raleway;
  19. src: url(data:application/x-font-truetype;base64,{{raleway}});
  20. }
  21. body { font-family: "Fira Sans", sans-serif; }
  22. code{white-space: pre;}
  23. .main {
  24. width: 80%;
  25. text-align: justify;
  26. margin-left: auto;
  27. margin-right: auto;
  28. font-size: 18px;
  29. line-height: 150%;
  30. }
  31. h1 {
  32. font-family: raleway;
  33. font-weight: normal;
  34. color: #822;
  35. }
  36. h2 {
  37. font-family: raleway;
  38. font-weight: normal;
  39. color: #822;
  40. }
  41. h3 {
  42. font-family: raleway;
  43. font-weight: normal;
  44. color: #822;
  45. }
  46. .footer {
  47. text-align: center;
  48. }
  49. blockquote {
  50. background-color: #f5f5f5;
  51. padding-left: 30px;
  52. padding-right: 30px;
  53. padding-top: 5px;
  54. padding-bottom: 5px;
  55. border-left: 2px solid black;
  56. }
  57. p { margin-left: 20pt; margin-right: 20pt; }
  58. a { text-decoration: none; color: #822; }
  59. a[href="#backgrounds"]::after {
  60. content: "Background";
  61. }
  62. a[href="#traits"]::before {
  63. content: url(data:image/svg+xml;base64,{{trait-icon}});
  64. }
  65. a[href="#traits"]::after {
  66. content: "Trait";
  67. }
  68. a[href="#relationships"]::before {
  69. content: url(data:image/svg+xml;base64,{{relationship-icon}});
  70. }
  71. a[href="#relationships"]::after {
  72. content: "Relationship";
  73. }
  74. a[href="#objects"]::before {
  75. content: url(data:image/svg+xml;base64,{{object-icon}});
  76. }
  77. a[href="#objects"]::after {
  78. content: "Object";
  79. }
  80. a[href="#stats"]::before {
  81. content: url(data:image/svg+xml;base64,{{stat-icon}});
  82. }
  83. a[href="#stats"]::after {
  84. content: "Stat";
  85. }
  86. </style>
  87. </head>
  88. <body>
  89. <div class="main" >
  90. <div class="header">
  91. <h1 id="if-the-sky-were-crooked">$if(title)$ $title$ $endif$</h1>
  92. </div>
  93. $body$
  94. <div class="footer">
  95. $for(author)$ $author$ $endfor$<br/>
  96. $if(date)$ $date$ $endif$
  97. </div>
  98. </div>
  99. </body>
  100. </html>