fix: popout window — theme, Mermaid, frontmatter parity with main app
- Added Mermaid CDN script + mermaid.initialize() with theme detection - Frontmatter card now collapsed by default (matching main app isOpen=false) - Hidden acCard initially when collapsed - Theme inherits localStorage obsigate-theme (same as main window)
This commit is contained in:
+15
-3
@@ -8,6 +8,7 @@
|
||||
document.documentElement.setAttribute('data-theme', localStorage.getItem('obsigate-theme') || 'dark');
|
||||
</script>
|
||||
<link rel="stylesheet" href="/static/style.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css" id="hljs-theme-dark">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css" id="hljs-theme-light" disabled>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
||||
@@ -873,6 +874,14 @@ const RightSidebarManager = {
|
||||
});
|
||||
}
|
||||
|
||||
// Render Mermaid diagrams
|
||||
setTimeout(() => {
|
||||
if (typeof mermaid !== 'undefined') {
|
||||
mermaid.initialize({ startOnLoad: false, theme: document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'default' });
|
||||
mermaid.run({ querySelector: '.mermaid' }).catch(() => {});
|
||||
}
|
||||
}, 100);
|
||||
|
||||
// Hide loading
|
||||
document.getElementById('loading').style.opacity = '0';
|
||||
setTimeout(() => {
|
||||
@@ -1384,11 +1393,11 @@ const RightSidebarManager = {
|
||||
const booleanFlags = ['publish', 'favoris', 'template', 'task', 'archive', 'draft', 'private']
|
||||
.map(key => ({ key, value: !!frontmatter[key] }));
|
||||
|
||||
// Toggle state
|
||||
let isOpen = true;
|
||||
// Toggle state — collapsed by default
|
||||
let isOpen = false;
|
||||
|
||||
// Build header with chevron
|
||||
const chevron = el("span", "fm-chevron open");
|
||||
const chevron = el("span", "fm-chevron closed");
|
||||
chevron.innerHTML = '<i data-lucide="chevron-down" style="width:14px;height:14px"></i>';
|
||||
|
||||
const fmHeader = el("div", "fm-header");
|
||||
@@ -1532,6 +1541,9 @@ const RightSidebarManager = {
|
||||
if (window.lucide) window.lucide.createIcons();
|
||||
});
|
||||
|
||||
// Hide card initially (collapsed by default)
|
||||
acCard.style.display = "none";
|
||||
|
||||
// Wrap in section
|
||||
const fmSection = el("div", "fm-section");
|
||||
fmSection.appendChild(fmHeader);
|
||||
|
||||
Reference in New Issue
Block a user