daenamnu/nextcloud
1
0
Fork 0
mirror of https://github.com/nextcloud/all-in-one.git synced 2026-06-02 17:00:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor setting theme and icon initially

Browse Source 
Signed-off-by: Pablo Zmdl <pablo@nextcloud.com>
This commit is contained in:
Pablo Zmdl
2026-02-17 08:36:13 +01:00
parent bf2d9ff394
commit fee94d10bc
1 changed files with 7 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
php/public/toggle-dark-mode.js
View File

@@ -6,8 +6,7 @@ function toggleTheme() {
localStorage.setItem('theme', newTheme); localStorage.setItem('theme', newTheme);
// Change the icon based on the current theme // Change the icon based on the current theme
const themeIcon = document.getElementById('theme-icon'); setThemeIcon(newTheme);
themeIcon.textContent = newTheme === 'dark' ? '☀️' : '🌙'; // Switch between moon and sun icons
} }
function setThemeToDOM(value) { function setThemeToDOM(value) {
@@ -16,16 +15,13 @@ function setThemeToDOM(value) {
documents.forEach((doc) => doc.documentElement.setAttribute('data-theme', value)); documents.forEach((doc) => doc.documentElement.setAttribute('data-theme', value));
} }
// Function to immediately apply saved theme without icon update function getSavedTheme() {
function applySavedThemeImmediately() { return localStorage.getItem('theme') ?? '';
// Default to light theme
setThemeToDOM(localStorage.getItem('theme') ?? '');
} }
// Function to apply theme-icon update // Function to apply theme-icon update
function setThemeIcon() { function setThemeIcon(theme) {
const savedTheme = localStorage.getItem('theme'); if (theme === 'dark') {
if (savedTheme === 'dark') {
document.getElementById('theme-icon').textContent = '☀️'; // Sun icon for dark mode document.getElementById('theme-icon').textContent = '☀️'; // Sun icon for dark mode
} else { } else {
document.getElementById('theme-icon').textContent = '🌙'; // Moon icon for light mode document.getElementById('theme-icon').textContent = '🌙'; // Moon icon for light mode
@@ -33,7 +29,7 @@ function setThemeIcon() {
} }
// Immediately apply the saved theme to avoid flickering // Immediately apply the saved theme to avoid flickering
applySavedThemeImmediately(); setThemeToDOM(getSavedTheme());
// Apply theme when the page loads // Apply theme when the page loads
document.addEventListener('DOMContentLoaded', setThemeIcon); document.addEventListener('DOMContentLoaded', () => setThemeIcon(getSavedTheme()));