@takagaki/cortex-decisions-viewer 0.4.41 → 0.4.42

package/dist/render.js

@@ -572,35 +572,47 @@ a:hover { text-decoration: underline; }
 .detail-back { display: inline-block; margin-bottom: 14px; font-size: 14px; }
 .detail-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
 .detail-head > div:first-child { flex: 1 1 auto; min-width: 0; }
+/* 右側の操作は2段に分ける。1段目=つながり（読む導線）・2段目=AIで編集/GitHubで編集（書き換える導線）。
+   3つ横並びだとタイトルの幅を食うため */
+.detail-actions { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
+.detail-actions-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
 .detail-title { font-size: 24px; font-weight: 700; margin: 0 0 10px; line-height: 1.4; }
 .detail-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--muted); font-size: 13px; margin-bottom: 16px; }
-/* GitHubで編集・つながり等の副次アクション。ヘッダーの .gh-btn と同じダーク（GitHubカラー）＋リキッドグラスで揃える */
+/* GitHubへ飛ぶボタンだけ、ヘッダーの .gh-btn と同じダーク（GitHubカラー）＋リキッドグラスで揃える */
 .edit-btn {
   -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%);
   flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
-  padding: 8px 16px; border-radius: 999px;
+  padding: 8px 14px; border-radius: var(--radius);
   border: 1px solid rgba(255,255,255,0.35); background: rgba(28,32,40,0.82); color: #fff;
-  font-size: 13px; font-weight: 600; white-space: nowrap;
+  font-size: 13.5px; font-weight: 600; white-space: nowrap;
   box-shadow: 0 2px 10px rgba(20,30,60,0.25), inset 0 1px 0 rgba(255,255,255,0.25);
 }
 .edit-btn:hover { background: rgba(0,0,0,0.88); text-decoration: none; }
-.edit-btn svg { width: 15px; height: 15px; }
+/* つながり（グラフ探索）はGitHubでもAIでもないので、既定の淡いボタンのまま残す */
+.trace-btn {
+  -webkit-backdrop-filter: blur(10px) saturate(150%); backdrop-filter: blur(10px) saturate(150%);
+  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
+  padding: 8px 14px; border: 1px solid var(--border); border-radius: var(--radius);
+  background: var(--surface); color: var(--text); font-size: 13.5px; font-weight: 600;
+  box-shadow: var(--shadow); white-space: nowrap;
+}
+.trace-btn:hover { border-color: var(--accent); color: var(--accent); text-decoration: none; }
 /* ---- AI導線ボタン（AIで編集・＋AIで登録。claude.ai/code へのディープリンク・AIアクションはオレンジ系で統一） ---- */
 /* AIアクション（AIで編集・＋AIで登録・AIに聞く）はヘッダーの .ask-ai-btn と同じ塗りで統一する */
 .ai-edit-btn {
   -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%);
   flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
-  padding: 8px 16px; border-radius: 999px;
+  padding: 8px 14px; border-radius: var(--radius);
   border: 1px solid rgba(255,255,255,0.55); background: rgba(217,119,87,0.82); color: #fff;
-  font-size: 13px; font-weight: 600; white-space: nowrap;
+  font-size: 13.5px; font-weight: 600; white-space: nowrap;
   box-shadow: 0 2px 10px rgba(190,90,60,0.3), inset 0 1px 0 rgba(255,255,255,0.45);
 }
 .ai-edit-btn:hover { background: rgba(194,94,63,0.92); text-decoration: none; }
 .ai-add-bar { margin-bottom: 16px; }
 .ai-add-btn {
-  display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 999px;
+  display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--radius);
   border: 1px solid rgba(255,255,255,0.55); background: rgba(217,119,87,0.82); color: #fff;
-  font-size: 13px; font-weight: 600; white-space: nowrap;
+  font-size: 13.5px; font-weight: 600; white-space: nowrap;
   -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%);
   box-shadow: 0 2px 10px rgba(190,90,60,0.3), inset 0 1px 0 rgba(255,255,255,0.45);
 }
@@ -1260,10 +1272,13 @@ const CLIENT_JS = `
     var ai = h.fm ? adoptionInfo(h.fm.adoption) : null;
     if (ai) titleWrap.appendChild(el("span", { class: "chip adoption-" + String(h.fm.adoption), text: ai.label }));
     head.appendChild(titleWrap);
-    head.appendChild(el("a", { class: "ai-edit-btn", href: codeUrl(HOME_EDIT_PROMPT), target: "_blank", rel: "noopener", text: "AIで編集" }));
+    var homeEditRow = el("div", { class: "detail-actions-row" }, [
+      el("a", { class: "ai-edit-btn", href: codeUrl(HOME_EDIT_PROMPT), target: "_blank", rel: "noopener", text: "AIで編集" }),
+    ]);
     if (h.editUrl) {
-      head.appendChild(el("a", { class: "edit-btn", href: h.editUrl, target: "_blank", rel: "noopener", html: '${GITHUB_ICON}<span>GitHubで編集</span>' }));
+      homeEditRow.appendChild(el("a", { class: "edit-btn", href: h.editUrl, target: "_blank", rel: "noopener", text: "GitHubで編集" }));
     }
+    head.appendChild(el("div", { class: "detail-actions" }, [ homeEditRow ]));
     app.appendChild(head);
     var homeBody = el("div", { class: "body" });
     app.appendChild(homeBody);
@@ -1833,14 +1848,18 @@ const CLIENT_JS = `
 
     var head = el("div", { class: "detail-head" });
     head.appendChild(el("div", {}, [ el("h1", { class: "detail-title", text: r.title }) ]));
-    var traceBtn2 = el("a", { class: "edit-btn", href: "?tab=graph", text: "🕸 つながり" });
+    var traceBtn2 = el("a", { class: "trace-btn", href: "?tab=graph", text: "🕸 つながり" });
     traceBtn2.addEventListener("click", function (ev) { ev.preventDefault(); openExplorerFor(r); });
-    head.appendChild(traceBtn2);
+    var editRowR = el("div", { class: "detail-actions-row" });
     var aiEditR = aiEditBtn(r, r._section, r.title);
-    if (aiEditR) head.appendChild(aiEditR);
+    if (aiEditR) editRowR.appendChild(aiEditR);
     if (r.editUrl) {
-      head.appendChild(el("a", { class: "edit-btn", href: r.editUrl, target: "_blank", rel: "noopener", html: '${GITHUB_ICON}<span>GitHubで編集</span>' }));
+      editRowR.appendChild(el("a", { class: "edit-btn", href: r.editUrl, target: "_blank", rel: "noopener", text: "GitHubで編集" }));
     }
+    head.appendChild(el("div", { class: "detail-actions" }, [
+      el("div", { class: "detail-actions-row" }, [ traceBtn2 ]),
+      editRowR.children.length ? editRowR : null,
+    ]));
     app.appendChild(head);
 
     app.appendChild(el("div", { class: "detail-meta" }, [
@@ -2486,14 +2505,18 @@ const CLIENT_JS = `
     var head = el("div", { class: "detail-head" });
     var headLeft = el("div", {}, [ el("h1", { class: "detail-title", text: d.title }) ]);
     head.appendChild(headLeft);
-    var traceBtn = el("a", { class: "edit-btn", href: "?tab=graph", text: "🕸 つながり" });
+    var traceBtn = el("a", { class: "trace-btn", href: "?tab=graph", text: "🕸 つながり" });
     traceBtn.addEventListener("click", function (ev) { ev.preventDefault(); openExplorerFor(d); });
-    head.appendChild(traceBtn);
+    var editRowD = el("div", { class: "detail-actions-row" });
     var aiEditD = aiEditBtn(d, "Decisions", d.title);
-    if (aiEditD) head.appendChild(aiEditD);
+    if (aiEditD) editRowD.appendChild(aiEditD);
     if (d.editUrl) {
-      head.appendChild(el("a", { class: "edit-btn", href: d.editUrl, target: "_blank", rel: "noopener", html: '${GITHUB_ICON}<span>GitHubで編集</span>' }));
+      editRowD.appendChild(el("a", { class: "edit-btn", href: d.editUrl, target: "_blank", rel: "noopener", text: "GitHubで編集" }));
     }
+    head.appendChild(el("div", { class: "detail-actions" }, [
+      el("div", { class: "detail-actions-row" }, [ traceBtn ]),
+      editRowD.children.length ? editRowD : null,
+    ]));
     app.appendChild(head);
 
     var meta = el("div", { class: "detail-meta" }, [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takagaki/cortex-decisions-viewer",
-  "version": "0.4.41",
+  "version": "0.4.42",
   "description": "Cortexの意思決定記録（Decisions/*.md）を静的サイトにビルドして閲覧する。各レコードに「Edit on GitHub」リンクを付与する。",
   "license": "UNLICENSED",
   "private": false,