cheese-cake/templates/element/javascript/dark_mode_bottom.php

<?php
/**
 * @var \App\View\AppView $this
 */

?>
<script>
    document.addEventListener('DOMContentLoaded', function (e) {
        const toggleDarkLink = document.getElementById('toggle-dark-mode');
        const toggleLightLink = document.getElementById('toggle-light-mode');
        const toggleAutoLink = document.getElementById('toggle-auto-mode');
        if (toggleDarkLink) {
            toggleDarkLink.addEventListener('click', function (e) {
                e.preventDefault();
                localStorage.theme = 'dark';
                document.documentElement.classList.add('dark');
                document.documentElement.classList.remove('auto');
            });
        }
        if (toggleLightLink) {
            toggleLightLink.addEventListener('click', function (e) {
                e.preventDefault();
                localStorage.theme = 'light';
                document.documentElement.classList.remove('auto');
                document.documentElement.classList.remove('dark');
            });
        }
        if (toggleAutoLink) {
            toggleAutoLink.addEventListener('click', function (e) {
                e.preventDefault();
                localStorage.theme = 'auto';
                document.documentElement.classList.add('auto');
                document.documentElement.classList.remove('dark');
            });
        }
    })
</script>