fix: popout inherits exact theme via opener window inline styles
- Copies documentElement.style.cssText from main app (has all CSS variables from themes.js setProperty) - This propagates ANY theme (Github, Linear, Spotify, Notion, etc.) dark+light - Fallback: localStorage obsigate-theme + obsigate-theme-mode for direct popout access - Removes the !important hack — replaced by proper cssText inheritance
This commit is contained in:
+17
-11
@@ -4,19 +4,25 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>ObsiGate - Popout</title>
|
<title>ObsiGate - Popout</title>
|
||||||
<style id="theme-force">
|
|
||||||
/* Forced by inline script — bypasses any CSS loading issues */
|
|
||||||
html, body { background: #0f1117 !important; color: #e6edf3 !important; }
|
|
||||||
</style>
|
|
||||||
<script>
|
<script>
|
||||||
|
// Copy theme from opener window (uses themes.js inline styles via setProperty)
|
||||||
(function() {
|
(function() {
|
||||||
var m = location.search.match(/theme=([^&]+)/);
|
if (window.opener && window.opener.document.documentElement.style.cssText) {
|
||||||
var theme = (m && m[1]) || localStorage.getItem('obsigate-theme') || 'dark';
|
// Copy all CSS variable inline styles from main app
|
||||||
document.documentElement.setAttribute('data-theme', theme);
|
document.documentElement.style.cssText = window.opener.document.documentElement.style.cssText;
|
||||||
if (m && m[1]) { localStorage.setItem('obsigate-theme', theme); }
|
}
|
||||||
// Force background/text as backup regardless of CSS variable loading
|
// Fallback: read from localStorage theme key + mode
|
||||||
if (theme === 'light') {
|
var themeKey = localStorage.getItem('obsigate-theme') || 'dark';
|
||||||
document.getElementById('theme-force').textContent = 'html, body { background: #ffffff !important; color: #1a1a1a !important; }';
|
var themeMode = localStorage.getItem('obsigate-theme-mode') || 'dark';
|
||||||
|
document.documentElement.setAttribute('data-theme', themeMode);
|
||||||
|
// Also set inline background/color as absolute fallback
|
||||||
|
if (!window.opener || !window.opener.document.documentElement.style.cssText) {
|
||||||
|
var bg = themeMode === 'light' ? '#ffffff' : '#0f1117';
|
||||||
|
var fg = themeMode === 'light' ? '#1a1a1a' : '#e6edf3';
|
||||||
|
document.documentElement.style.setProperty('--bg-primary', bg, 'important');
|
||||||
|
document.documentElement.style.setProperty('--text-primary', fg, 'important');
|
||||||
|
document.body.style.background = bg;
|
||||||
|
document.body.style.color = fg;
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user