Inline 3D viewers in articles use content width (model-viewer-inline); standalone model pages stay full-bleed

docs/embed-3d-model.md

@@ -2,8 +2,9 @@
 
 The share can render `.step` / `.stp` / `.stl` models interactively (three.js + occt-import-js,
 hosted locally). The viewer fills the available screen width (full-bleed, ~`100vw`) with a
-height based on the viewport (`min(70vh, 900px)`), so models use the maximum available space
+height based on the viewport (`min(70vh, 900px)`), so standalone model pages use the maximum
-instead of the readable content width. The caption below the model always shows
+available space instead of the readable content width. **Inline viewers embedded in text
+articles** (Options B and C) are limited to the content width (`model-viewer-inline`). The caption below the model always shows
 `<file name> · <size> · <triangle count>` (e.g. `Wrench.stl · 711 KB · 14.6k triangles`).
 
 There are three ways to embed a model, depending on how you store the file.

scripts/3d_model_viewer.js

@@ -363,6 +363,7 @@
         if (!m) return;
         var href = a.getAttribute("href");
         var el = makeViewer(name);
+        el.classList.add("model-viewer-inline");
         a.replaceWith(el);
         initViewer(el, href, m[0]);
     });
@@ -384,6 +385,7 @@
         var mm = t.match(MODEL_RE);
         if (!mm) return;
         var el = makeViewer(t);
+        el.classList.add("model-viewer-inline");
         a.replaceWith(el);
         initViewer(el, "api/notes/" + art.id + "/download", mm[0]);
     });

theme/blog_share_theme.css

@@ -821,6 +821,11 @@ html.theme-light #content code {
     overflow: hidden;
 }
 
+.model-viewer.model-viewer-inline {
+    width: 100%;
+    margin-left: 0;
+}
+
 .model-viewer-data {
     position: absolute;
     top: 8px;