fix: themes somtimes override default custom accent colour

This commit is contained in:
SethBurkart123
2025-03-28 11:50:52 +11:00
parent a33f4f3f00
commit c4c50f2c30
3 changed files with 38 additions and 32 deletions
@@ -96,11 +96,6 @@
onDestroy(() => { onDestroy(() => {
themeUpdates.removeListener(fetchThemes); themeUpdates.removeListener(fetchThemes);
}) })
$effect(() => {
if (!themes) return;
console.log(themes.selectedTheme);
})
</script> </script>
<div <div
+3 -1
View File
@@ -15,9 +15,11 @@ const themeManager = ThemeManager.getInstance();
export function OpenThemeCreator(themeID: string = "") { export function OpenThemeCreator(themeID: string = "") {
CloseThemeCreator() CloseThemeCreator()
// Store that theme creator is open and save original color // Only store original color if we're not editing an existing theme
localStorage.setItem('themeCreatorOpen', 'true'); localStorage.setItem('themeCreatorOpen', 'true');
if (!themeID) {
localStorage.setItem('originalPreviewColor', settingsState.selectedColor); localStorage.setItem('originalPreviewColor', settingsState.selectedColor);
}
const width = "310px" const width = "310px"
+13 -4
View File
@@ -454,7 +454,8 @@ export class ThemeManager {
try { try {
const { CustomCSS, CustomImages, defaultColour, forceDark } = theme; const { CustomCSS, CustomImages, defaultColour, forceDark } = theme;
// Store original settings if not already stored // Store original settings only if this is a new theme
if (!theme.webURL) {
if (this.originalPreviewColor === null) { if (this.originalPreviewColor === null) {
this.originalPreviewColor = settingsState.selectedColor; this.originalPreviewColor = settingsState.selectedColor;
localStorage.setItem('originalPreviewColor', settingsState.selectedColor); localStorage.setItem('originalPreviewColor', settingsState.selectedColor);
@@ -462,6 +463,7 @@ export class ThemeManager {
if (this.originalPreviewTheme === null) { if (this.originalPreviewTheme === null) {
this.originalPreviewTheme = settingsState.DarkMode; this.originalPreviewTheme = settingsState.DarkMode;
} }
}
// Apply custom CSS // Apply custom CSS
if (CustomCSS) { if (CustomCSS) {
@@ -487,13 +489,15 @@ export class ThemeManager {
// Update previousImageVariableNames // Update previousImageVariableNames
this.previousImageVariableNames = newImageVariableNames; this.previousImageVariableNames = newImageVariableNames;
// Apply theme settings // Apply theme settings only if this is a new theme
if (!theme.webURL) {
if (forceDark !== undefined) { if (forceDark !== undefined) {
settingsState.DarkMode = forceDark; settingsState.DarkMode = forceDark;
} }
if (defaultColour) { if (defaultColour) {
settingsState.selectedColor = defaultColour; settingsState.selectedColor = defaultColour;
} }
}
} catch (error) { } catch (error) {
console.error('[ThemeManager] Error previewing theme:', error); console.error('[ThemeManager] Error previewing theme:', error);
} }
@@ -505,13 +509,16 @@ export class ThemeManager {
public async updatePreview(theme: Partial<LoadedCustomTheme>): Promise<void> { public async updatePreview(theme: Partial<LoadedCustomTheme>): Promise<void> {
console.debug('[ThemeManager] Updating theme preview'); console.debug('[ThemeManager] Updating theme preview');
try { try {
// Store original settings if not already stored // Only store original settings if this is a new theme (not editing)
// We can tell it's a new theme if it has no webURL (which is set when a theme is saved/loaded)
if (!theme.webURL) {
if (this.originalPreviewColor === null) { if (this.originalPreviewColor === null) {
this.originalPreviewColor = settingsState.selectedColor; this.originalPreviewColor = settingsState.selectedColor;
} }
if (this.originalPreviewTheme === null) { if (this.originalPreviewTheme === null) {
this.originalPreviewTheme = settingsState.DarkMode; this.originalPreviewTheme = settingsState.DarkMode;
} }
}
// Apply CSS if changed // Apply CSS if changed
if (theme.CustomCSS !== undefined) { if (theme.CustomCSS !== undefined) {
@@ -548,13 +555,15 @@ export class ThemeManager {
this.previousImageVariableNames = newImageVariableNames; this.previousImageVariableNames = newImageVariableNames;
} }
// Update theme settings // Update theme settings only if this is a new theme
if (!theme.webURL) {
if (theme.forceDark !== undefined) { if (theme.forceDark !== undefined) {
settingsState.DarkMode = theme.forceDark; settingsState.DarkMode = theme.forceDark;
} }
if (theme.defaultColour) { if (theme.defaultColour) {
settingsState.selectedColor = theme.defaultColour; settingsState.selectedColor = theme.defaultColour;
} }
}
} catch (error) { } catch (error) {
console.error('[ThemeManager] Error updating theme preview:', error); console.error('[ThemeManager] Error updating theme preview:', error);
} }