Fix cr-sections inside sections (eg. when h2 is used)

_extensions/closeread/_extension.yml

@@ -1,6 +1,6 @@
 title: closeread
 author: Andrew Bray and James Goldie
-version: 1.0.0
+version: 1.0.1
 quarto-required: ">=1.3.0"
 contributes:
   formats:

_extensions/closeread/closeread.js

@@ -28,14 +28,22 @@ document.addEventListener("DOMContentLoaded", () => {
     document.body.classList.add("cr-removeheaderspace")
   }
 
-  // attach layout classes to direct parents of `.cr-section`s
+  // attach layout classes to parents of `.cr-section`s up to main.content
   /* this replicates quarto <= 1.6 functionality:
     https://github.com/quarto-dev/quarto-cli/blob/
       d85467627aae71c96e3d1e9718a3b47289329cde/src/format/html/
-      format-html-bootstrap.ts#L1163C1-L1186C7 */ 
+      format-html-bootstrap.ts#L1163C1-L1186C7 */
+  const ensureInGrid = el => {
+    const parent = el.parentElement
+    parent.classList.add("page-columns", "page-full")
+    if (isDocumentMain(parent)) {
+      return
+    } else {
+      ensureInGrid(parent)
+    }
+  }  
   const crSections = Array.from(document.querySelectorAll(".cr-section"))
-  crSections.map(
-    el => el.parentElement.classList.add("page-columns", "page-full"))
+  crSections.map(ensureInGrid)
 
   const ojsModule = window._ojs?.ojsConnector?.mainModule
   const ojsStickyName = ojsModule?.variable()
@@ -409,3 +417,8 @@ function getBooleanConfig(metaFlag) {
     .querySelector("meta[" + metaFlag + "]")?.getAttribute(metaFlag)
   return option === "true"
 }
+
+function isDocumentMain(el) {
+  return el === null ||
+      (el.tagName == "MAIN" && el.classList.contains("content"))
+}

_extensions/closeread/closeread.scss

@@ -241,7 +241,7 @@
   }
 }
 .sidebar-right {
-  grid-template-columns: 2fr var(cr-narrative-sidebar-width);
+  grid-template-columns: 2fr var(--cr-narrative-sidebar-width);
 
   .narrative-col {
     grid-column: 2;