Update docsy (hugo theme) git submodule (#1295)

.github/workflows/main.yml

@@ -115,8 +115,6 @@ jobs:
           extended: true
       - name: "📥 Source checkout"
         uses: actions/checkout@v2
-        with:
-          submodules: 'recursive'
       - name: "⚙️ npm"
         run: |
           npm i
@@ -161,8 +159,6 @@ jobs:
           extended: true
       - name: "📥 Source checkout"
         uses: actions/checkout@v2
-        with:
-          submodules: 'recursive'
       - name: "⚙️ npm"
         run: |
           npm i

README.md

@@ -65,15 +65,15 @@ place after an MSC has been accepted, not as part of a proposal itself.
    Alternatively, use the Docker image at
    https://hub.docker.com/r/klakegg/hugo/. (The "extended edition" is required
    to process the SCSS.)
-2. Run `git submodule update --init --recursive` for good measure.
+2. Run `npm i` to install the dependencies and fetch the docsy git submodule.
-3. Run `npm i` to install the dependencies. Note that this will require NodeJS to be installed.
+   Note that this will require NodeJS to be installed.
-4. Run `npm run get-proposals` to seed proposal data. This is merely for populating the content of the "Spec Change Proposals"
+3. Run `npm run get-proposals` to seed proposal data. This is merely for populating the content of the "Spec Change Proposals"
    page and is not required.
-5. Run `hugo serve` (or `docker run --rm -it -v $(pwd):/src -p 1313:1313
+4. Run `hugo serve` (or `docker run --rm -it -v $(pwd):/src -p 1313:1313
    klakegg/hugo:ext serve`) to run a local webserver which builds whenever a file
    change is detected. If watching doesn't appear to be working for you, try
    adding `--disableFastRender` to the commandline.
-6. Edit the specification 🙂
+5. Edit the specification 🙂
 
 We use a highly customized [Docsy](https://www.docsy.dev/) theme for our generated site, which uses Bootstrap and Font
 Awesome. If you're looking at making design-related changes to the spec site, please coordinate with us in

assets/scss/_variables_project.scss

@@ -36,9 +36,17 @@ $table-border-color: rgba(black, .125);
 $table-row-alternate: $secondary-lightest-background;
 $table-row-default: $secondary-lighter-background;
 
+/* Configure docsy to use the default system fonts instead of Google Fonts.
+ * See https://www.docsy.dev/docs/adding-content/lookandfeel/#fonts */
+$td-enable-google-fonts: false;
+
 /*
- Opt to serve fonts locally by overriding web-font-path to be a non-google fonts URL.
+ * Replace the default font with Inter - we load it from a local copy, which is downloaded from
- This is only possible with our modified docsy theme: https://github.com/matrix-org/docsy
+ * Google Fonts manually via a script:
- */
+ * https://github.com/matrix-org/matrix-spec/tree/main/static/css/fonts
-$web-font-path: "../css/fonts/Inter.css";
+ *
-$google_font_name: "Inter";
+ * The $font-family-sans-serif definition here overrides the default value set by docsy:
+ * https://github.com/matrix-org/docsy/blob/66a4e61d2d34edc7196b9df83a7d09cd4af14b47/assets/scss/_variables.scss#L68
+ * and adds "Inter" to the front. */
+@import url("../css/fonts/Inter.css");
+$font-family-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

assets/scss/custom.scss

@@ -340,6 +340,17 @@ footer {
   }
 
   table {
+    /* Docsy makes all tables "responsive tables", which causes Bootstrap 4 to create
+     * tables with a "display" property of "block".
+     *
+     * However, for "table-layout: fixed" to be effective, an element must have a
+     * "display" property of "table".
+     *
+     * Thus, we override the "display" property here. This may no longer be necessary once
+     * Docsy updates to Bootstrap v5+: https://github.com/google/docsy/issues/470.
+     * For more details, see
+     * https://github.com/matrix-org/matrix-spec/pull/1295/files#r1010759688 */
+    display: table;
     table-layout: fixed;
     width: 100%;
 
@@ -462,10 +473,4 @@ Make padding symmetrical (this selector is used in the default styles to apply p
   background-position: left 1rem center;
   background-repeat: no-repeat;
   padding-left: 100px;
-}
+}
-
-/* Full-width tables */
-.td-content > table {
-  width: 100%;
-  display: table;
-}

changelogs/internal/newsfragments/1295.feature

@@ -0,0 +1 @@
+Update docsy theme to v0.5.0 + matrix.org modifications (https://github.com/matrix-org/docsy/commit/a0032f8db919a6c67ba6cdef2c455f105b6272a2).

package.json

@@ -5,6 +5,9 @@
   "main": "none.js",
   "scripts": {
     "get-proposals": "node ./scripts/proposals.js",
+    "get:submodule": "git submodule update --init --depth 1",
+    "_prepare:docsy": "cd themes/docsy && npm install",
+    "prepare": "npm run get:submodule && npm run _prepare:docsy",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {

themes/docsy

@@ -1 +1 @@
-Subproject commit 5023a2914528e012ecf3ec85a56028c00ee97dd2
+Subproject commit a0032f8db919a6c67ba6cdef2c455f105b6272a2