@majeanson/lac 3.4.1 → 3.4.3

package/dist/index.mjs

@@ -21014,10 +21014,10 @@ function generateUserGuide(features, projectName) {
 	const draftCount = pages.filter((p) => p.feature.status === "draft").length;
 	const skippedCount = features.length - guideFeatures.length;
 	function navItem(p) {
-		return `<div class="nav-item" data-id="${esc(p.id)}" onclick="showPage('${esc(p.id)}')">
+		return `<a class="nav-item" data-id="${esc(p.id)}" href="#${esc(p.id)}">
       <div class="nav-item-dot ${esc(p.feature.status)}"></div>
       <span class="nav-item-name">${esc(p.feature.title)}</span>
-    </div>`;
+    </a>`;
 	}
 	const navGroupsHtml = domainOrder.map((domain) => {
 		const domainPages = pages.filter((p) => p.domain === domain);
@@ -21034,13 +21034,13 @@ function generateUserGuide(features, projectName) {
       </div>
     </div>`;
 	}).join("\n    ");
-	const tocCardsHtml = pages.map((p) => `<div class="toc-card" onclick="showPage('${esc(p.id)}')">
+	const tocCardsHtml = pages.map((p) => `<a class="toc-card" href="#${esc(p.id)}">
       <div class="toc-pip" style="background:${p.color}"></div>
       <div>
         <div class="toc-card-title">${esc(p.feature.title)}</div>
         <div class="toc-card-sub">${esc(p.domain.replace(/-/g, " "))} · <span style="color:var(--status-${esc(p.feature.status)})">${esc(p.feature.status)}</span></div>
       </div>
-    </div>`).join("\n        ");
+    </a>`).join("\n        ");
 	const statCardsHtml = [
 		{
 			num: pages.length,
@@ -21095,6 +21095,10 @@ function generateUserGuide(features, projectName) {
         ${f.featureKey ? `<span class="feature-key-label">${esc(f.featureKey)}</span>` : ""}
         ${tags}
       </div>
+      ${f.featureKey ? `<div class="cross-links">
+        <a class="cross-link" href="./lac-wiki.html#${esc(f.featureKey)}">🗂️ Wiki</a>
+        <a class="cross-link" href="./lac-raw.html#${esc(f.featureKey)}">🔩 Raw</a>
+      </div>` : ""}
       <div class="guide-block">
         <div class="guide-block-label">How to use</div>
         <div class="guide-text">${guideHtml}</div>
@@ -21209,6 +21213,7 @@ body {
 .nav-item {
   display: flex; align-items: center; gap: 8px; padding: 5px 14px 5px 24px;
   cursor: pointer; border-left: 2px solid transparent; transition: background 0.1s;
+  text-decoration: none;
 }
 .nav-item:hover { background: var(--bg-hover); }
 .nav-item.active { background: var(--bg-active); border-left-color: var(--accent); }
@@ -21239,7 +21244,7 @@ body {
 .stat-lbl     { font-size: 11px; color: var(--text-soft); margin-top: 4px; }
 .section-title { font-family: var(--mono); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-soft); margin-bottom: 12px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
 .toc-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
-.toc-card  { padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; cursor: pointer; transition: border-color 0.15s, background 0.15s; display: flex; align-items: flex-start; gap: 10px; }
+.toc-card  { padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; cursor: pointer; transition: border-color 0.15s, background 0.15s; display: flex; align-items: flex-start; gap: 10px; text-decoration: none; }
 .toc-card:hover { background: var(--bg-hover); border-color: var(--text-soft); }
 .toc-pip   { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 4px; }
 .toc-card-title { font-size: 13px; font-weight: 600; color: var(--text); line-height: 1.3; }
@@ -21250,7 +21255,10 @@ body {
 .feature-page.hidden, .home-page.hidden { display: none; }
 .feature-domain-eyebrow { font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; margin-bottom: 10px; }
 .feature-title { font-size: 28px; font-weight: 800; color: var(--text); letter-spacing: -0.015em; line-height: 1.2; margin-bottom: 12px; }
-.feature-meta  { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
+.feature-meta  { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
+.cross-links   { display: flex; gap: 8px; margin-bottom: 24px; }
+.cross-link    { font-family: var(--mono); font-size: 11px; color: var(--text-soft); text-decoration: none; padding: 3px 10px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-card); }
+.cross-link:hover { color: var(--accent); border-color: var(--accent); }
 .status-badge  { display: inline-block; padding: 2px 10px; border-radius: 999px; font-family: var(--mono); font-size: 10px; border: 1px solid; }
 .status-badge.frozen     { color: var(--status-frozen);     border-color: rgba(91,130,204,0.4);  background: var(--status-frozen-bg); }
 .status-badge.active     { color: var(--status-active);     border-color: rgba(74,173,114,0.4);  background: var(--status-active-bg); }