thewca · dmint789 · Jun 18, 2024 · May 3, 2024 · May 7, 2024 · May 9, 2024
@@ -2,11 +2,11 @@ name: Website deployment
 
 on:
   release:
-      types: [published]
+    types: [published]
   workflow_dispatch:
 
 jobs:
-  build:
+  deploy:
     runs-on: ubuntu-latest
 
     steps:

@@ -0,0 +1,18 @@
+FROM ubuntu:latest
+
+WORKDIR /home/app/wca-documents
+
+# Install the required dependencies
+RUN apt update && apt -y install sudo
+COPY ./bin/install_dependencies.sh .
+RUN ./install_dependencies.sh
+RUN rm ./install_dependencies.sh
+
+# All of this makes it so we can build PDFs without having them owned by root
+ARG USER_ID
+ARG GROUP_ID
+RUN groupadd --non-unique --gid $GROUP_ID user
+RUN useradd --non-unique --uid $USER_ID --gid $GROUP_ID user
+USER user
+
+CMD [ "bash", "bin/build.sh" ]
diff --git a/README.md b/README.md
@@ -10,12 +10,17 @@ Example: `documents/policies/external/Competition Requirements.md` gets converte
 
 ## Scripts
 
+Run these scripts from the root directory of the repository:
+
 | Script | Description |
 | ------ | ----------- |
-| `bin/install_dependencies.sh` | Installs dependencies necessary to generate PDFs. Run this once. |
-| `bin/build.sh` | Builds PDF files into `build` directory. |
+| `bin/install_dependencies.sh` | Installs dependencies necessary to generate PDFs*. Run this once. |
+| `bin/build.sh` | Builds PDF files into the `build` directory. `documents` or `edudoc` can be passed as the first argument to only build documents from the specified directory. |
+| `bin/docker_build.sh` | Builds PDF files using Docker. Use the `--rebuild` flag if you need to rebuild the image. The same directory argument as in `build.sh` is also supported. |
 | `bin/deploy.sh` | WCA deployment script used by GitHub. You don't need to use this. |
 
+\* This only supports Debian-based distributions. If you are not using a Debian-based distribution, install these dependencies manually: [pandoc](https://www.pandoc.org), [weasyprint](https://doc.courtbouillon.org/weasyprint/stable), Liberation Sans font, a font with full Unicode support (e.g. Google Noto).
+
 ## Writing and translating documents
 
 [This document](https://github.com/thewca/wca-documents/blob/master/documents-guide.md) explains everything necessary to create a new document or translate an Educational Resources document.

diff --git a/assets/documents-style.css b/assets/documents-style.css
@@ -0,0 +1,33 @@
+a {
+  color: black;
+}
+
+/* Fancy numeration of nested numeric lists. (Based on https://stackoverflow.com/a/26245056) */
+
+ol[type="1"] {
+  counter-reset: item;
+}
+
+ol[type="1"] li {
+  position: relative;
+  display: block;
+  margin-bottom: 0.2rem;
+  counter-increment: item;
+}
+
+/* List item counter */
+ol[type="1"] > li:before {
+  position: absolute;
+  right: 100%;
+  margin-right: 0.5rem;
+  content: counters(item, ".") ".";
+}
+
+/* Nested list item (e.g. 1.2.3) */
+li ol[type="1"] > li {
+  margin-left: 1rem;
+}
+
+li ol[type="1"] > li:before {
+  content: counters(item, ".");
+}
diff --git a/assets/edudoc-header.html b/assets/edudoc-header.html
@@ -1,14 +1,3 @@
-<!DOCTYPE html>
-<html>
-    <head>
-        <meta charset="utf-8"/>
-    </head>
-    <body style="margin: 0; padding: 0; font-family: arial; font-size: 18px;">
-    <div style="border-bottom: 1px solid black; text-align:center; width:100%; height:100%;">
-        <div style="float: left; text-align: left;">DOCUMENT_TITLE</div>
-        <div style="display: inline-block; margin: 0 auto;"><img src="WCA_LOGO_PATH" height="50" alt="WCA logo"/></div>
-        <div style="float: right; text-align: right;">Version: DATE</div>
-    </div>
-    <div style="padding-bottom: 10px;"></div>
-    </body>
-</html>
+<div id="header_title">{document_title}</div>
+<img id="header_logo" src="{wca_logo_path}" alt="WCA logo" />
+<div id="header_date">Last update: {date}</div>
diff --git a/assets/edudoc-style.css b/assets/edudoc-style.css
@@ -1,61 +1,80 @@
-/* If this is updated, update the styling of the body in edudoc-header.html too */
-body {
-  margin: 0;
-  padding: 0;
-  font-family: arial;
-  font-size: 18px;
+:root {
+  font-size: 11pt;
+}
+
+/* This is used by weasyprint */
+@page {
+  margin: 13mm 15mm;
+  padding: 2mm 0 0;
+  border-top: black solid 1px;
+
+  @top-left {
+    content: element(headerTitle);
+  }
+
+  @top-center {
+    content: element(headerLogo);
+  }
+
+  @top-right {
+    content: element(headerDate);
+  }
+
+  @bottom-center {
+    content: counter(page);
+  }
+}
+
+@media print {
+  #header_title,
+  #header_logo,
+  #header_date {
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
+
+  #header_title {
+    position: running(headerTitle);
+    padding-top: 18px;
+    font-size: 0.9em;
+  }
+
+  #header_logo {
+    position: running(headerLogo);
+    height: 40px;
+    width: 40px;
+    margin-top: 4px;
+  }
+
+  #header_date {
+    position: running(headerDate);
+    padding-top: 18px;
+  }
 }
 
 h1 {
   text-align: center;
 }
 
-h2 {
-  text-decoration: underline black;
-}
-
-img {
-  max-width: 800px;
-}
-
 img.logo {
   float: left;
   padding: 20px;
 }
 
 li {
-  padding: 5px 0 5px 0;
-}
-
-table {
-  page-break-inside: avoid;
-  margin-left: auto;
-  margin-right: auto;
-  border-collapse: collapse;
-}
-
-tr {
-  page-break-inside: avoid;
-  page-break-after: auto;
-}
-
-th {
-  font-weight: bold;
-}
-
-th,
-td {
-  font-size: 18px;
-  padding: 5px 10px;
-  border: 1px solid black;
+  margin: 0.6rem initial;
 }
 
 .box {
   border-style: solid;
   font-weight: bold;
   text-align: center;
-  margin: 20px;
-  padding: 5px;
+  margin: 1rem;
+  padding: 0.2rem 0.5rem;
+  border-width: 2px;
+  page-break-inside: avoid;
 }
 
 .attention {
@@ -74,36 +93,6 @@ td {
   background: #ffc0c0;
 }
 
-.centered {
-  margin-left: auto;
-  margin-right: auto;
-  display: block;
-}
-
-.version {
-  color: gray;
-}
-
-.page-break-before {
-  page-break-before: always;
-}
-
-.page-break-after {
-  page-break-after: always;
-}
-
-.text-right {
-  text-align: right;
-}
-
-.text-left {
-  text-align: left;
-}
-
-.text-center {
-  text-align: center;
-}
-
-.indent {
-  text-indent: 3em;
+table.table-with-images img {
+  max-width: 120px;
 }