fix: popout theme inheritance via URL query param
CI / lint (push) Successful in 24s
CI / security (push) Successful in 14s
CI / test (push) Successful in 28s
CI / build (push) Successful in 18s
CI / e2e (push) Failing after 10s

- Pass current theme as ?theme=dark|light in popout URL
- viewer.js, app.js, palette.js all pass theme to popout
- popout.html reads theme from URL param first (fallback: localStorage, then dark)
- Also syncs theme back to localStorage when set via query param
This commit is contained in:
2026-07-24 14:56:29 -04:00
parent f3bfd01f93
commit a1355977d9
4 changed files with 12 additions and 4 deletions
+2 -1
View File
@@ -3308,7 +3308,8 @@
const openNewWindowBtn = el("button", { class: "btn-action", title: "Ouvrir dans une nouvelle fenetre" }, [icon("external-link", 14), document.createTextNode("pop-out")]);
openNewWindowBtn.addEventListener("click", () => {
const popoutUrl = `/popout/${encodeURIComponent(data.vault)}/${encodeURIComponent(data.path)}`;
const theme = document.documentElement.getAttribute('data-theme') || 'dark';
const popoutUrl = `/popout/${encodeURIComponent(data.vault)}/${encodeURIComponent(data.path)}?theme=${theme}`;
window.open(popoutUrl, `popout_${data.vault}_${data.path.replace(/[^a-zA-Z0-9]/g, "_")}`, "width=1000,height=700,menubar=no,toolbar=no,location=no,status=no,resizable=yes,scrollbars=no");
});
+1 -1
View File
@@ -40,7 +40,7 @@ function getCMDS() {
_cmdsCache = [
{ id:'home', label:t('palette.cmd_back_home'), desc:t('palette.cmd_back_home_desc'), cat:'Navigation', act:()=>{close();triggerGoHome();} },
{ id:'edit-current', label:'✏️ '+t('editor.edit'), desc:t('editor.edit_current_desc'), cat:'Fichiers', act:()=>{close();const f=getCurrentFile();if(f)openEditor(f.vault,f.path);else showToast(t('toast.no_open_file'),'error');} },
{ id:'popout', label:'🪟 Pop-out', desc:t('palette.popout_desc'), cat:'Fichiers', act:()=>{close();const f=getCurrentFile();if(f)window.open(`/popout/${encodeURIComponent(f.vault)}/${encodeURIComponent(f.path)}`,'popout','width=1000,height=700');else showToast(t('toast.no_open_file'),'error');} },
{ id:'popout', label:'🪟 Pop-out', desc:t('palette.popout_desc'), cat:'Fichiers', act:()=>{close();const f=getCurrentFile();if(f)window.open(`/popout/${encodeURIComponent(f.vault)}/${encodeURIComponent(f.path)}?theme=${document.documentElement.getAttribute('data-theme')||'dark'}`,'popout','width=1000,height=700');else showToast(t('toast.no_open_file'),'error');} },
{ id:'create-file', label:t('palette.cmd_create_file'), desc:t('palette.cmd_create_file_desc'), cat:'Fichiers', act:()=>startBrowse('create-file') },
{ id:'delete-file', label:'🗑️ '+t('file.delete'), desc:t('palette.delete_file_desc'), cat:'Fichiers', act:()=>startBrowse('delete-file') },
{ id:'delete-cur', label:'🗑️ '+t('palette.delete_current'), desc:t('palette.delete_current_desc'), cat:'Fichiers', act:async()=>{close();await delCurFile();} },
+2 -1
View File
@@ -571,7 +571,8 @@ export function renderFile(data) {
const openNewWindowBtn = el("button", { class: "btn-action", title: t("forge.popout") }, [icon("external-link", 14), document.createTextNode(t("forge.popout_label"))]);
openNewWindowBtn.addEventListener("click", () => {
const popoutUrl = `/popout/${encodeURIComponent(data.vault)}/${encodeURIComponent(data.path)}`;
const theme = document.documentElement.getAttribute('data-theme') || 'dark';
const popoutUrl = `/popout/${encodeURIComponent(data.vault)}/${encodeURIComponent(data.path)}?theme=${theme}`;
window.open(popoutUrl, `popout_${data.vault}_${data.path.replace(/[^a-zA-Z0-9]/g, "_")}`, "width=1000,height=700,menubar=no,toolbar=no,location=no,status=no,resizable=yes,scrollbars=no");
});
+7 -1
View File
@@ -5,7 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ObsiGate - Popout</title>
<script>
document.documentElement.setAttribute('data-theme', localStorage.getItem('obsigate-theme') || 'dark');
// Inherit theme from opener or localStorage — query param has priority
(function() {
var m = location.search.match(/theme=([^&]+)/);
var theme = (m && m[1]) || localStorage.getItem('obsigate-theme') || 'dark';
document.documentElement.setAttribute('data-theme', theme);
if (m && m[1]) { localStorage.setItem('obsigate-theme', theme); }
})();
</script>
<link rel="stylesheet" href="/static/style.css">
<script src="https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js"></script>