first commit

resources/stylesheets/pdf.scss

@@ -0,0 +1,73 @@
+:root {
+  --width: 21cm;
+  --margin: 1.20cm;
+  --height: 29.7cm;
+  --offset: calc(var(--margin) * 2);
+}
+
+@page {
+  size: A4;
+  margin: 1.20cm;
+}
+
+hr:has(+ div.md-source-file), .md-source-file {
+  display: none !important;
+}
+
+summary::after {
+  display: none;
+}
+
+.front-cover {
+  margin: var(--margin);
+  height: calc(var(--height) - var(--offset));
+  page-break-after: always;
+  border: 1px solid #fff;
+  position: relative;
+
+  img {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    image-rendering: optimizeQuality;
+  }
+
+  > section {
+    color: #fff;
+    padding: 0.635cm;
+    max-width: 10.25cm;
+    word-wrap: break-word;
+    margin-top: calc(var(--height) / 2 - var(--offset) - 2cm);
+    font-size: 13pt;
+
+    > .title {
+      font-size: 26pt;
+      font-weight: 500;
+      line-height: 1.1;
+      color: #fff;
+    }
+  }
+}
+
+h1, h2, h3 {
+  string-set: chapter content();
+}
+
+body {
+  print-color-adjust: exact;
+  text-rendering: geometricPrecision;
+}
+
+.md-main .md-main__inner {
+  margin: 0;
+}
+
+.md-content .md-content__inner {
+  margin: 0;
+  padding: 0;
+
+  &::before {
+    height: 0;
+  }
+}

resources/templates/covers/back.html.j2

@@ -0,0 +1,43 @@
+<style data-teleport="head">
+  .back-cover {
+    page: last;
+    height: 100%;
+  }
+
+  .back-cover img {
+    top: 0;
+    left: 0;
+    position: absolute;
+  }
+
+  .back-cover section {
+    .title {
+      color: #fff;
+      position: absolute;
+      top: 50%;
+      left: 0;
+      vertical-align: middle;
+      font-size: 24pt;
+      text-align: center;
+      width: 100%;
+    }
+  }
+
+  @page last {
+    margin: 0;
+    background: var(--md-primary-fg-color);
+
+    @top-center {
+      content: none;
+    }
+
+    @bottom-center {
+      content: none;
+    }
+  }
+</style>
+<div class="back-cover">
+  <section>
+    <div class="title">{{ config.site_name }}</div>
+  </section>
+</div>

resources/templates/covers/front.html.j2

@@ -0,0 +1,91 @@
+<style data-teleport="head">
+  .front-cover {
+    margin: var(--margin);
+    height: calc(var(--height) - var(--offset));
+    page-break-after: always;
+    border: 1px solid #fff;
+    position: relative;
+
+    img {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      image-rendering: optimizeQuality;
+    }
+
+    .logo {
+      position: absolute;
+      top: calc(2cm);
+      fill: white;
+      left: 50%;
+      transform: translateX(-50%);
+
+      > div {
+        width: 3cm;
+        text-align: center;
+        height: 3cm;
+      }
+    }
+
+    section {
+      color: #fff;
+      padding: 0.635cm;
+      max-width: 10.25cm;
+      word-wrap: break-word;
+      margin-top: calc(var(--height) / 2 - var(--offset) - 2cm);
+      font-size: 13pt;
+
+      > .title {
+        font-size: 32pt;
+        font-weight: 500;
+        line-height: 1.1;
+        margin-top: 1em;
+        color: #fff;
+        string-set: title content(text);
+      }
+
+      > .version {
+        line-height: 1;
+        font-size: 10pt;
+        font-family: monospace;
+      }
+    }
+  }
+
+  @page {
+    @top-center {
+      font-size: 9pt;
+      color: #7f7f7f;
+      content: '{{ config.site_name }}' ' — ' string(title);
+    }
+  }
+
+  @page :first {
+    margin: 0;
+    background: var(--md-primary-fg-color);
+
+    @top-center {
+      content: none;
+    }
+
+    @bottom-center {
+      content: none;
+    }
+  }
+</style>
+<div class="front-cover">
+  <img src="/assets/images/background.png">
+  <div class="logo">
+    <div>
+      <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+        <path d="m23 19-3-3v2h-4v2h4v2l3-3m-10 0c0-.3 0-.7.1-1H6v-2h7.8c.5-.8 1.1-1.5 1.9-2H6v-2h12v1.1c.3-.1.7-.1 1-.1s.7 0 1 .1V8l-6-6H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h7.8c-.5-.9-.8-1.9-.8-3m0-15.5L18.5 9H13V3.5Z"></path>
+      </svg>
+    </div>
+  </div>
+  <section>
+    <div class="brand">{{ config.site_name }}</div>
+    <div class="version">{{ version }}</div>
+    <div class="title">{{ page.title }}</div>
+  </section>
+</div>