html,about - don't process column classes inside about divs

Author: cscheid

src/format/html/format-html-bootstrap.ts

@@ -1461,6 +1461,13 @@ const figCapInCalloutMarginProcessor: MarginNodeProcessor = {
 
 const kPreviewFigColumnForwarding = [".grid"];
 
+const isInsideAbout = (el: Element) =>
+  !!findParent(
+    el,
+    (parent) =>
+      Array.from(parent.classList).some((x) => x.startsWith("quarto-about-")),
+  );
+
 const processFigureOutputs = (doc: Document) => {
   // For any non-margin figures, we want to actually place the figure itself
   // into the column, and leave the caption as is, if possible
@@ -1497,13 +1504,19 @@ const processFigureOutputs = (doc: Document) => {
 
     // If there is a single figure, then forward the column class onto that
     const figures = columnEl.querySelectorAll("figure img.figure-img");
-    if (figures && figures.length === 1) {
+
+    if (
+      figures && figures.length === 1 && !isInsideAbout(figures[0] as Element)
+    ) {
       moveColumnClasses(columnEl, figures[0] as Element);
     } else {
       const layoutFigures = columnEl.querySelectorAll(
         ".quarto-layout-panel > figure.figure .quarto-layout-row",
       );
-      if (layoutFigures && layoutFigures.length === 1) {
+      if (
+        layoutFigures && layoutFigures.length === 1 &&
+        !isInsideAbout(layoutFigures[0] as Element)
+      ) {
         moveColumnClasses(columnEl, layoutFigures[0] as Element);
       }
     }