// Get the dark mode toggle button by its ID
const darkModeToggle = document.getElementById('darkModeToggle');
// Add a click event listener to toggle dark mode on the body
darkModeToggle.addEventListener('click', () => {
// Toggle the 'dark-mode' class on the body
document.body.classList.toggle('dark-mode');
});Dark Mode Toggle
Related Posts
More content you might like
CSS Variables and Custom Properties: Dynamic Theming and Beyond
Here, the --container-width adjusts based on the screen size, making your design more flexible.
While CSS variables can’t be used directly within media query expressions, you can use variables to change the style properties that are affected by media queries.
Managing Modals with Livewire and JavaScript
Create a Livewire component, or use an existing one where you want to manage modals.
Add methods to dispatch custom browser events when buttons are clicked:
Detect Dark Mode Preference
No preview available for this content.
Discussion 0
Please sign in to join the discussion.
No comments yet. Be the first to share your thoughts!