Render frontmatter as styled cards in public share view

Split search query tokens on word boundaries for accurate inverted-index
matching

backend/main.py

@@ -2866,6 +2866,25 @@ async def public_share_view(token: str):
     post = parse_markdown_file(raw)
     html = _render_markdown(post.content, share["vault"], file_path)
     title = post.metadata.get("title", file_path.stem)
+
+    # Build frontmatter section HTML
+    fm_html = ""
+    if post.metadata:
+        fm_items = []
+        skip_keys = {"title", "titre"}
+        for k, v in post.metadata.items():
+            if k in skip_keys:
+                continue
+            if isinstance(v, list):
+                v = ", ".join(str(x) for x in v)
+            elif isinstance(v, bool):
+                v = "✓" if v else "✗"
+            elif v is None:
+                v = "—"
+            fm_items.append(f'<div class="fm-row"><span class="fm-key">{k}</span><span class="fm-val">{v}</span></div>')
+        if fm_items:
+            fm_html = f'<div class="fm-section"><div class="fm-header">Frontmatter</div><div class="fm-body">{"".join(fm_items)}</div></div>'
+
     return HTMLResponse(f"""<!DOCTYPE html><html lang="fr" data-theme="dark"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
 <title>{title} — ObsiGate Share</title>
 <style>
@@ -2890,6 +2909,12 @@ body{{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:
 .content code{{font-size:0.9em;background:var(--bg-card);padding:1px 4px;border-radius:3px}}
 .content pre code{{background:none;padding:0}}
 .content a{{color:var(--accent)}}.content img{{max-width:100%;border-radius:6px}}
+.fm-section{{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:12px 16px;margin-bottom:20px}}
+.fm-header{{font-weight:600;font-size:0.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:8px}}
+.fm-body{{display:grid;grid-template-columns:1fr 2fr;gap:4px 12px;font-size:0.85rem}}
+.fm-row{{display:contents}}
+.fm-key{{color:var(--accent);font-weight:500}}
+.fm-val{{color:var(--text);word-break:break-word}}
 .content blockquote{{border-left:3px solid var(--accent);padding-left:16px;color:var(--text-muted);margin:12px 0}}
 .content table{{border-collapse:collapse;width:100%;margin:12px 0}}
 .content th,.content td{{border:1px solid var(--border);padding:8px 12px;text-align:left}}
@@ -2917,7 +2942,7 @@ body{{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:
     PDF
   </button>
 </div>
-<div class="content" id="content">{html}</div>
+<div class="content" id="content">{fm_html}{html}</div>
 <script>
 function toggleTheme(){{var t=document.documentElement;var isDark=t.dataset.theme==="dark";t.dataset.theme=isDark?"light":"dark";document.getElementById("theme-icon-dark").style.display=isDark?"none":"";document.getElementById("theme-icon-light").style.display=isDark?"":"none";localStorage.setItem("obsigate-share-theme",t.dataset.theme)}}
 (function(){{var s=localStorage.getItem("obsigate-share-theme");if(!s)s="dark";document.documentElement.dataset.theme=s;var isDark=s==="dark";document.getElementById("theme-icon-dark").style.display=isDark?"":"none";document.getElementById("theme-icon-light").style.display=isDark?"none":""}})();