A theme for pelican which mimics the look of LaTeX documents
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

424 Zeilen
7.1 KiB

  1. @import url("pygment.css");
  2. @font-face {
  3. font-family: 'Latin Modern';
  4. font-style: normal;
  5. font-weight: normal;
  6. font-display: swap;
  7. src: url('../fonts/LM-regular.woff2') format('woff2'),
  8. url('../fonts/LM-regular.woff') format('woff'),
  9. url('../fonts/LM-regular.ttf') format('truetype');
  10. }
  11. @font-face {
  12. font-family: 'Latin Modern';
  13. font-style: italic;
  14. font-weight: normal;
  15. font-display: swap;
  16. src: url('../fonts/LM-italic.woff2') format('woff2'),
  17. url('../fonts/LM-italic.woff') format('woff'),
  18. url('../fonts/LM-italic.ttf') format('truetype');
  19. }
  20. @font-face {
  21. font-family: 'Latin Modern';
  22. font-style: normal;
  23. font-weight: bold;
  24. font-display: swap;
  25. src: url('../fonts/LM-bold.woff2') format('woff2'),
  26. url('../fonts/LM-bold.woff') format('woff'),
  27. url('../fonts/LM-bold.ttf') format('truetype');
  28. }
  29. @font-face {
  30. font-family: 'Latin Modern';
  31. font-style: italic;
  32. font-weight: bold;
  33. font-display: swap;
  34. src: url('../fonts/LM-bold-italic.woff2') format('woff2'),
  35. url('../fonts/LM-bold-italic.woff') format('woff'),
  36. url('../fonts/LM-bold-italic.ttf') format('truetype');
  37. }
  38. :root {
  39. --main-bg-color: hsl(210, 20%, 98%);
  40. --main-text-color: hsl(0, 5%, 10%);
  41. --main-link-color: hsl(0, 100%, 35%);
  42. --table-border-color: hsl(0, 0%, 85%);
  43. --table-head-border-color: hsl(0, 0%, 70%);
  44. }
  45. @media (prefers-color-scheme: dark) {
  46. :root {
  47. --main-bg-color: hsl(0, 5%, 10%);
  48. --main-text-color: hsl(210, 20%, 98%);
  49. --main-link-color: hsl(0, 100%, 65%);
  50. --table-border-color: hsl(0, 0%, 15%);
  51. --table-head-border-color: hsl(0, 0%, 30%);
  52. }
  53. }
  54. *, *::before, *::after {
  55. box-sizing: border-box;
  56. }
  57. body, h1, h2, h3, h4, p, ul[class], ol[class], li, figure, figcaption, dl, dd {
  58. margin: 0;
  59. }
  60. html, body {
  61. height: 98%;
  62. max-width: 1280px;
  63. margin: auto;
  64. }
  65. html {
  66. font-size: 1rem;
  67. scroll-behavior: smooth;
  68. }
  69. body {
  70. display: flex;
  71. flex-flow: column nowrap;
  72. font-family: 'Latin Modern', Georgia, Cambria, 'Times New Roman', Times, serif;
  73. line-height: 1.8;
  74. min-height: 100vh;
  75. overflow-x: hidden;
  76. margin: 0 auto;
  77. padding: 2rem 1.25rem;
  78. color: var(--main-text-color);
  79. background-color: var(--main-bg-color);
  80. text-rendering: optimizeLegibility;
  81. }
  82. p {
  83. text-align: justify;
  84. hyphens: auto;
  85. margin-top: 1rem;
  86. }
  87. a:not([class]) {
  88. text-decoration-skip-ink: auto;
  89. }
  90. a, a:visited {
  91. color: var(--main-link-color);
  92. }
  93. a:focus {
  94. outline-offset: 2px;
  95. outline: 2px solid hsl(220, 90%, 52%);
  96. }
  97. h1 {
  98. font-size: 2.5rem;
  99. line-height: 3.25rem;
  100. margin-bottom: 1.625rem;
  101. }
  102. h2 {
  103. font-size: 1.7rem;
  104. line-height: 2rem;
  105. margin-top: 3rem;
  106. }
  107. h3 {
  108. font-size: 1.4rem;
  109. margin-top: 2.5rem;
  110. }
  111. h4 {
  112. font-size: 1.2rem;
  113. margin-top: 2rem;
  114. }
  115. h5 {
  116. font-size: 1rem;
  117. margin-top: 1.8rem;
  118. }
  119. h6 {
  120. font-size: 1rem;
  121. font-style: italic;
  122. font-weight: normal;
  123. margin-top: 2.5rem;
  124. }
  125. h3, h4, h5, h6 {
  126. line-height: 1.625rem;
  127. }
  128. h1 + h2 {
  129. margin-top: 1.625rem;
  130. }
  131. h2 + h3, h3 + h4, h4 + h5 {
  132. margin-top: 0.8rem;
  133. }
  134. h5 + h6 {
  135. margin-top: -0.8rem;
  136. }
  137. h2, h3, h4, h5, h6 {
  138. margin-bottom: 0.8rem;
  139. }
  140. ul, ol {
  141. padding: 0;
  142. }
  143. #banner, #contentinfo {
  144. width: 100%;
  145. text-align: center;
  146. }
  147. #contentinfo {
  148. flex-shrink: 0;
  149. margin-top: 40px
  150. }
  151. #container {
  152. flex: 1 0 auto;
  153. display: flex;
  154. align-items: stretch;
  155. max-width: 100%;
  156. }
  157. @media only screen and (max-width: 1024px) {
  158. #container {
  159. flex-flow: row wrap;
  160. }
  161. }
  162. #menu {
  163. min-width: 300px;
  164. }
  165. .menuitems {
  166. list-style: none;
  167. }
  168. #content {
  169. flex: 1 1 auto;
  170. }
  171. #post-list li {
  172. list-style: none;
  173. }
  174. .entry-title {
  175. text-align: center;
  176. }
  177. div.post-info {
  178. text-align: center;
  179. }
  180. .author a {
  181. margin: 0.85rem 0;
  182. font-variant-caps: small-caps;
  183. text-align: center;
  184. }
  185. footer.post-info {
  186. display: flex;
  187. flex-flow: row wrap;
  188. justify-content: space-between;
  189. padding: 1rem;
  190. }
  191. /*
  192. * Links
  193. */
  194. .entry-content {
  195. counter-reset: entrylinks 0 figures 0 tables 0 listings 0;
  196. }
  197. .entry-content a {
  198. counter-increment: entrylinks;
  199. text-decoration: none;
  200. color: inherit;
  201. outline: none;
  202. cursor: default;
  203. pointer-events: none;
  204. }
  205. .entry-content a:after {
  206. content: '[' counter(entrylinks) ']';
  207. margin-left: 2px;
  208. color: var(--main-link-color);
  209. cursor: pointer;
  210. pointer-events: auto;
  211. }
  212. /*
  213. * Lists
  214. */
  215. .entry-content ol,
  216. .entry-content ul {
  217. padding-left: 40px;
  218. }
  219. .entry-content li>ol,
  220. .entry-content li>ul {
  221. padding-left: 20px;
  222. }
  223. /*
  224. * Images
  225. */
  226. .entry-content img {
  227. counter-increment: figures;
  228. display: block;
  229. max-width: 80%;
  230. margin: 0 auto 0 auto;
  231. padding: 1rem;
  232. }
  233. .entry-content img~em{
  234. display: block;
  235. margin: 0 auto 0 auto;
  236. text-align: center;
  237. font-style: normal;
  238. }
  239. .entry-content img~em:before {
  240. content: 'Figure ' counter(figures) ': ';
  241. font-weight: bold;
  242. }
  243. /*
  244. * Tables
  245. */
  246. .entry-content table:not([class="highlighttable"]) {
  247. counter-increment: tables;
  248. max-width: 80%;
  249. margin: 0 auto 0 auto;
  250. padding: 1rem;
  251. border-collapse: collapse;
  252. border-spacing: 0;
  253. }
  254. .entry-content table~p > em{
  255. display: block;
  256. margin: 0 auto 0 auto;
  257. text-align: center;
  258. font-style: normal;
  259. }
  260. .entry-content table~p > em:before {
  261. content: 'Table ' counter(tables) ': ';
  262. font-weight: bold;
  263. }
  264. .entry-content th, td {
  265. padding: 0.5rem;
  266. }
  267. .entry-content td {
  268. border-bottom: 1px solid var(--table-border-color);
  269. }
  270. .entry-content th:not([align]), td:not([align]) {
  271. text-align: left;
  272. }
  273. .entry-content th:empty,
  274. .entry-content td:empty {
  275. border-left: 1px solid var(--table-border-color);
  276. width: 0;
  277. padding: 0;
  278. }
  279. .entry-content th:empty~th:empty,
  280. .entry-content td:empty~td:empty {
  281. border-left: 1px double var(--table-border-color);
  282. }
  283. .entry-content thead th {
  284. border-bottom: 2px solid var(--table-head-border-color);
  285. }
  286. .entry-content tfoot th {
  287. border-top: 2px solid var(--table-head-border-color);
  288. }
  289. /*
  290. * Code
  291. */
  292. .entry-content table.highlighttable,
  293. .entry-content div.highlight {
  294. width: 100%;
  295. max-width: 100%;
  296. }
  297. .entry-content div.highlight {
  298. counter-increment: listings;
  299. }
  300. .entry-content table.highlighttable~p > em,
  301. .entry-content div.highlight~p > em {
  302. display: block;
  303. margin: 0 auto 0 auto;
  304. text-align: center;
  305. font-style: normal;
  306. }
  307. .entry-content table.highlighttable~p > em:before,
  308. .entry-content div.highlight~p > em:before {
  309. content: 'Listing ' counter(listings) ': ';
  310. font-weight: bold;
  311. }
  312. .entry-content td.linenos,
  313. .entry-content td.code {
  314. border-bottom: none;
  315. }
  316. .entry-content code, pre {
  317. font-family: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
  318. font-size: 85%;
  319. }
  320. .entry-content pre {
  321. max-width: 100%;
  322. overflow: auto;
  323. border-radius: 4px;
  324. }
  325. .entry-content pre code {
  326. font-size: 95%;
  327. position: relative;
  328. }
  329. .linenos {
  330. width: 3em;
  331. }
  332. /* This is old stuff, inherited from LaTeX.css, probably unused */
  333. /* Nested ordered list for ToC */
  334. .toc ol {
  335. counter-reset: item;
  336. padding-left: 2rem;
  337. }
  338. .toc li {
  339. display: block;
  340. }
  341. .toc li:before {
  342. content: counters(item, '.') ' ';
  343. counter-increment: item;
  344. padding-right: 0.85rem;
  345. }
  346. /* Make footnote text smaller and left align it (looks bad with long URLs) */
  347. .footnotes p {
  348. text-align: left;
  349. line-height: 1.5;
  350. font-size: 85%;
  351. margin-bottom: 0.4rem;
  352. }
  353. .footnotes {
  354. border-top: 1px solid hsl(0, 0%, 39%);
  355. }