MokoConsulting/MokoCassiopeia
1
1
Fork 0
Code Issues 2 Pull Requests Actions Packages Releases 1 Activity

Enable dark theme selection in component.php and offline.php matching index.php approach

Browse Source 
Co-authored-by: jmiller-moko <230051081+jmiller-moko@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2026-02-27 02:38:17 +00:00
parent 75f3296ccc
commit 9ab91e4d90
2 changed files with 33 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/templates/component.php
View File

@@ -193,6 +193,9 @@ if ($this->params->get('faKitCode')) {
$params_leftIcon = htmlspecialchars($this->params->get('drawerLeftIcon', 'fa-solid fa-chevron-left'), ENT_COMPAT, 'UTF-8');
$params_rightIcon = htmlspecialchars($this->params->get('drawerRightIcon', 'fa-solid fa-chevron-right'), ENT_COMPAT, 'UTF-8');
// Theme params
$params_theme_enabled = $this->params->get('theme_enabled', 1);
$wa->useStyle('template.user'); // css/user.css
?>
<!DOCTYPE html>
@@ -202,6 +205,21 @@ $wa->useStyle('template.user'); // css/user.css
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<jdoc:include type="styles" />
<jdoc:include type="scripts" />
<?php if ($params_theme_enabled) : ?>
<script>
// Early theme application to avoid FOUC
(function () {
try {
var stored = localStorage.getItem('theme');
var prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
var theme = stored ? stored : (prefersDark ? 'dark' : 'light');
document.documentElement.setAttribute('data-bs-theme', theme);
document.documentElement.setAttribute('data-aria-theme', theme);
} catch (e) {}
})();
</script>
<?php endif; ?>
</head>
<body class="<?php echo $this->direction === 'rtl' ? 'rtl' : ''; ?>">
<jdoc:include type="message" />