diff --git a/index.php b/index.php index 6df044e..90d68ae 100644 --- a/index.php +++ b/index.php @@ -1,5 +1,22 @@ + '#ffffff', + 'dark' => '#171717', + 'nord' => '#2e3440', + 'dracula' => '#282a36', + 'catppuccin' => '#1e1e2e', + ); + $blowditTheme = (isset($_COOKIE['blowdit-theme']) && isset($blowditThemeBg[$_COOKIE['blowdit-theme']])) + ? $_COOKIE['blowdit-theme'] + : 'light'; + $blowditBg = $blowditThemeBg[$blowditTheme]; + $blowditScheme = ($blowditTheme === 'light') ? 'light' : 'dark'; +?> - + @@ -140,8 +157,10 @@ function apply(theme) { root.setAttribute('data-theme', theme); try { localStorage.setItem(STORAGE_KEY, theme); } catch (e) {} - // Keep the inline html background/color-scheme in sync (set early - // in head.php to prevent a white flash between page loads). + // Persist to a cookie so PHP pre-colours the next page server-side + // (prevents the white flash between navigations). + document.cookie = 'blowdit-theme=' + theme + '; path=/; max-age=31536000; SameSite=Lax'; + // Keep the inline html background/color-scheme in sync. var bg = window.BLOWDIT_THEME_BG || {}; if (bg[theme]) { root.style.backgroundColor = bg[theme]; } root.style.colorScheme = (theme === 'light') ? 'light' : 'dark'; diff --git a/php/head.php b/php/head.php index 27e5c79..bef9bb2 100644 --- a/php/head.php +++ b/php/head.php @@ -24,6 +24,8 @@ root.setAttribute('data-theme', stored); root.style.colorScheme = (stored === 'light') ? 'light' : 'dark'; root.style.backgroundColor = bg[stored]; + // Persist to a cookie so PHP can pre-colour the next page server-side. + document.cookie = 'blowdit-theme=' + stored + '; path=/; max-age=31536000; SameSite=Lax'; } catch (e) {} })();