Replace Wintersmith with Metalsmith

Wintersmith is no longer maintained given that the most recent version
is from six years ago, and all vulnerabilities that NPM reports
originate from Wintersmith's dependencies. Metalsmith, and its plugins,
on the other hand have recently had releases and don't have known
vulnerabilities. In fact, the number of reported vulnerabilities by NPM
even goes down to zero with this patch applied.

This commit therefore replaces Wintersmith with Metalsmith by providing
a transparent drop-in replacement, in a way that requires the least
amount of changes to the code and the generated output.

Note that this patch does update our versions of jQuery, Bootstrap and
the Highlight.js theme because the previous versions were very outdated
and didn't work correctly with Metalsmith. Moreover, those old versions
contained vulnerabilities that are hereby fixed.

Fixes #18198.

docs/contents/api/index.md

@@ -1,6 +1,7 @@
 ---
 title: API
-template: layout.jade
+layout: layout.njk
+slug: api
 ---
 
 # API

docs/contents/css/a11y-light.css

@@ -0,0 +1,100 @@
+/*!
+  Theme: a11y-light
+  Author: @ericwbailey
+  Maintainer: @ericwbailey
+
+  Based on the Tomorrow Night Eighties theme: https://github.com/isagalaev/highlight.js/blob/master/src/styles/tomorrow-night-eighties.css
+
+  Original source: https://github.com/highlightjs/highlight.js/blob/main/src/styles/a11y-light.css
+*/
+
+.hljs {
+  background: #fefefe;
+  color: #545454;
+}
+
+/* Comment */
+.hljs-comment,
+.hljs-quote {
+  color: #696969;
+}
+
+/* Red */
+.hljs-variable,
+.hljs-template-variable,
+.hljs-tag,
+.hljs-name,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-regexp,
+.hljs-deletion {
+  color: #d91e18;
+}
+
+/* Orange */
+.hljs-number,
+.hljs-built_in,
+.hljs-literal,
+.hljs-type,
+.hljs-params,
+.hljs-meta,
+.hljs-link {
+  color: #aa5d00;
+}
+
+/* Yellow */
+.hljs-attribute {
+  color: #aa5d00;
+}
+
+/* Green */
+.hljs-string,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-addition {
+  color: #008000;
+}
+
+/* Blue */
+.hljs-title,
+.hljs-section {
+  color: #007faa;
+}
+
+/* Purple */
+.hljs-keyword,
+.hljs-selector-tag {
+  color: #7928a1;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}
+
+@media screen and (-ms-high-contrast: active) {
+  .hljs-addition,
+  .hljs-attribute,
+  .hljs-built_in,
+  .hljs-bullet,
+  .hljs-comment,
+  .hljs-link,
+  .hljs-literal,
+  .hljs-meta,
+  .hljs-number,
+  .hljs-params,
+  .hljs-string,
+  .hljs-symbol,
+  .hljs-type,
+  .hljs-quote {
+        color: highlight;
+    }
+
+    .hljs-keyword,
+    .hljs-selector-tag {
+        font-weight: bold;
+    }
+}

docs/contents/css/main.css

@@ -1,119 +1,34 @@
-body {
-}
-.starter-template {
-  padding: 0 15px;
-}
-.navbar-brand {
-  padding: 4px 15px;
-}
-.navbar-brand img {
-  height: 42px;
-}
-.navbar {
-  border-color: #e5e7e8;
-}
-.navbar-default .navbar-nav > .active > a,
-.navbar-default .navbar-nav > .active > a:hover,
-.navbar-default .navbar-nav > .active > a:focus  {
-  background-color: #fff;
-  border: 1px solid #e5e7e8;
-  border-width: 0 1px;
-  position: relative;
-  top: 1px;
-}
-
-footer {
-  padding-top: 40px;
-  padding-bottom: 40px;
-  margin-top: 100px;
-  color: #777;
-  text-align: center;
-  border-top: 1px solid #E5E5E5;
-}
+header {
+  background-color: #f8f8f8;
+  border-bottom: 1px solid #e5e7e8;
 
-/* code styling */
+  .navbar-brand {
+    padding: 0;
 
-code {
-  font-family: 'Anonymous Pro', monospace;
-  font-size: 0.85em;
-  color: #000;
+    img {
+      height: 42px;
+    }
+  }
 }
 
-pre code {
-  display: block;
-  line-height: 1.1;
-}
-
-p code {
-  padding: 0.1em 0.3em 0.2em;
-  border-radius: 0.3em;
-  position: relative;
-  top: -0.15em;
-  background: #444;
-  color: #fff;
-  white-space: nowrap;
-}
+main {
+  margin: 50px 0;
 
-/* syntax hl stuff */
-
-code.lang-markdown {
-  color: #424242;
-}
-
-code.lang-markdown .header,
-code.lang-markdown .strong {
-  font-weight: bold;
-}
-
-code.lang-markdown .emphasis {
-  font-style: italic;
-}
+  .description {
+    font-size: 20px;
+  }
 
-code.lang-markdown .horizontal_rule,
-code.lang-markdown .link_label,
-code.lang-markdown .code,
-code.lang-markdown .header,
-code.lang-markdown .link_url {
-  color: #555;
+  pre {
+    background-color: #f5f5f5;
+    border: 1px solid #cccccc;
+    border-radius: 4px;
+    padding: 10px;
+  }
 }
 
-code.lang-markdown .blockquote,
-code.lang-markdown .bullet {
-  color: #bbb;
-}
-
-/* Tomorrow Theme */
-/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
-/* Original theme - https://github.com/chriskempson/tomorrow-theme */
-/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
-.tomorrow-comment, pre .comment, pre .title {
-  color: #8e908c;
-}
-
-.tomorrow-red, pre .variable, pre .attribute, pre .tag, pre .regexp, pre .ruby .constant, pre .xml .tag .title, pre .xml .pi, pre .xml .doctype, pre .html .doctype, pre .css .id, pre .css .class, pre .css .pseudo {
-  color: #c82829;
-}
-
-.tomorrow-orange, pre .number, pre .preprocessor, pre .built_in, pre .literal, pre .params, pre .constant {
-  color: #f5871f;
-}
-
-.tomorrow-yellow, pre .class, pre .ruby .class .title, pre .css .rules .attribute {
-  color: #eab700;
-}
-
-.tomorrow-green, pre .string, pre .value, pre .inheritance, pre .header, pre .ruby .symbol, pre .xml .cdata {
-  color: #718c00;
-}
-
-.tomorrow-aqua, pre .css .hexcolor {
-  color: #3e999f;
-}
-
-.tomorrow-blue, pre .function, pre .python .decorator, pre .python .title, pre .ruby .function .title, pre .ruby .title .keyword, pre .perl .sub, pre .javascript .title, pre .coffeescript .title {
-  color: #4271ae;
-}
-
-.tomorrow-purple, pre .keyword, pre .javascript .function {
-  color: #8959a8;
+footer {
+  border-top: 1px solid #e5e5e5;
+  color: #777777;
+  padding: 40px 0;
+  text-align: center;
 }

docs/contents/examples/index.md

@@ -1,6 +1,7 @@
 ---
 title: Examples
-template: layout.jade
+layout: layout.njk
+slug: examples
 ---
 
 ## Hello World Walkthrough
@@ -83,17 +84,17 @@ var scaledViewport = page.getViewport({ scale: scale, });
 The example demonstrates how promises can be used to handle errors during loading.
 It also demonstrates how to wait until a page is loaded and rendered.
 
-<script async src="//jsfiddle.net/pdfjs/9engc9mw/embed/html,css,result/"></script>
+<script async src="https://jsfiddle.net/pdfjs/9engc9mw/embed/html,css,result/"></script>
 
 ### Hello World using base64 encoded PDF
 
 The PDF.js can accept any decoded base64 data as an array.
 
-<script async src="//jsfiddle.net/pdfjs/cq0asLqz/embed/html,css,result/"></script>
+<script async src="https://jsfiddle.net/pdfjs/cq0asLqz/embed/html,css,result/"></script>
 
 ### Previous/Next example
 
 The same canvas cannot be used to perform to draw two pages at the same time --
 the example demonstrates how to wait on previous operation to be complete.
 
-<script async src="//jsfiddle.net/pdfjs/wagvs9Lf/embed/html,css,result/"></script>
+<script async src="https://jsfiddle.net/pdfjs/wagvs9Lf/embed/html,css,result/"></script>

docs/contents/getting_started/index.md

@@ -1,6 +1,7 @@
 ---
 title: Getting Started
-template: layout.jade
+layout: layout.njk
+slug: getting_started
 ---
 
 # Getting Started
@@ -76,7 +77,7 @@ Note that we only mention the most relevant files and folders.
 
 ### Prebuilt
 
-```
+```plaintext
 ├── build/
 │   ├── pdf.mjs                            - display layer
 │   ├── pdf.mjs.map                        - display layer's source map
@@ -96,7 +97,7 @@ Note that we only mention the most relevant files and folders.
 
 ### Source
 
-```
+```plaintext
 ├── docs/                                  - website source code
 ├── examples/                              - simple usage examples
 ├── extensions/                            - browser extension source code

docs/contents/index.md

@@ -1,14 +1,13 @@
 ---
-title: PDF.js
-template: layout.jade
+title: Home
+layout: layout.njk
+slug: home
 ---
 
-
 <h1 class="text-center">PDF.js</h1>
-<p class="text-center" style="font-size: 20px">A general-purpose, web standards-based platform for parsing and rendering PDFs.
-</p>
+<p class="text-center description">A general-purpose, web standards-based platform for parsing and rendering PDFs.</p>
 <p class="text-center">
-  <a type="button" class="btn btn-lg btn-default" href="getting_started/#download">Download</a>
-  <a type="button" class="btn btn-lg btn-default" href="https://github.com/mozilla/pdf.js#online-demo">Demo</a>
-  <a type="button" class="btn btn-lg btn-default" href="https://github.com/mozilla/pdf.js">GitHub Project</a>
+  <a type="button" class="btn btn-outline-dark" href="/getting_started/#download">Download</a>
+  <a type="button" class="btn btn-outline-dark" href="https://github.com/mozilla/pdf.js#online-demo">Demo</a>
+  <a type="button" class="btn btn-outline-dark" href="https://github.com/mozilla/pdf.js">GitHub Project</a>
 </p>