Question formatting

web/dist/markdown.js

@@ -38,7 +38,16 @@ function blocks(lines, opts) {
                 i++;
             }
             i++;
-            out.push(f[2].toLowerCase() === "mermaid" ? diagram(body.join("\n")) : copyable(h("pre", { class: "md-code" }, h("code", {}, body.join("\n")))));
+            const lang = f[2].toLowerCase();
+            if (lang === "mermaid") {
+                out.push(diagram(body.join("\n")));
+                continue;
+            }
+            if (lang === "diff" || lang === "patch") {
+                out.push(copyable(h("pre", { class: "md-code diff" }, h("code", {}, ...body.map(diffLine)))));
+                continue;
+            }
+            out.push(copyable(h("pre", { class: "md-code" }, h("code", {}, body.join("\n")))));
             continue;
         }
         if (detailsClose.test(line)) {
@@ -115,6 +124,10 @@ function blocks(lines, opts) {
     }
     return out;
 }
+function diffLine(l) {
+    const cls = l.startsWith("@@") ? "hunk" : l.startsWith("+++") || l.startsWith("---") ? "meta" : l.startsWith("+") ? "add" : l.startsWith("-") ? "del" : "ctx";
+    return h("span", { class: `line ${cls}` }, l + "\n");
+}
 function startsBlock(lines, i) {
     const line = lines[i];
     return (fence.test(line) ||
@@ -189,17 +202,18 @@ function item(body, opts) {
     const li = h("li");
     const m = opts.choice && choiceMarker.exec(body[0]);
     const picker = m ? opts.choice(m[2]) : null;
+    const detail = h("div", { class: "choice-detail" });
     if (picker) {
         li.className = "choice";
         li.append(picker);
+        if (body.slice(1).some((l) => l.trim() !== "")) {
+            picker.append(detail);
+        }
     }
-    const target = picker ?? li;
+    const target = picker ? detail : li;
     const first = picker ? [] : [body[0]];
     const rest = body.slice(1);
     if (rest.every((l) => !startsBlockLine(l)) && !rest.includes("")) {
-        if (picker && rest.length > 0) {
-            target.append(h("br"));
-        }
         target.append(...joinLines([...first, ...rest].map((l) => l.trim()), opts));
         return li;
     }
@@ -209,9 +223,6 @@ function item(body, opts) {
         head.push(body[k].trim());
         k++;
     }
-    if (picker && head.length > 0) {
-        target.append(h("br"));
-    }
     target.append(...joinLines(head, opts), ...blocks(body.slice(k), opts));
     return li;
 }