admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-20 11:22:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(editor): Fix log view style bugs (#16312)

Browse Source
This commit is contained in:
Suguru Inoue
2025-06-16 14:50:57 +02:00
committed by GitHub
parent c22ca2cb4a
commit 58a556430c
6 changed files with 105 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
packages/frontend/editor-ui/src/stores/ui.utils.ts
View File

@@ -1,11 +1,12 @@
import type { AppliedThemeOption, ThemeOption } from '@/Interface';
import { useStorage } from '@/composables/useStorage';
import { LOCAL_STORAGE_THEME } from '@/constants';
import type { AppliedThemeOption, ThemeOption } from '@/Interface';
const themeRef = useStorage(LOCAL_STORAGE_THEME);
export function addThemeToBody(theme: AppliedThemeOption) {
window.document.body.setAttribute('data-theme', theme);
export function applyThemeToBody(theme: ThemeOption, window_?: Window) {
if (theme === 'system') {
(window_ ?? window).document.body.removeAttribute('data-theme');
} else {
(window_ ?? window).document.body.setAttribute?.('data-theme', theme); // setAttribute can be missing in jsdom environment
}
}
export function isValidTheme(theme: string | null): theme is AppliedThemeOption {
@@ -13,29 +14,12 @@ export function isValidTheme(theme: string | null): theme is AppliedThemeOption
}
// query param allows overriding theme for demo view in preview iframe without flickering
export function getThemeOverride() {
return getQueryParam('theme') || themeRef.value;
export function getThemeOverride(): AppliedThemeOption | null {
const override = getQueryParam('theme') ?? localStorage.getItem(LOCAL_STORAGE_THEME);
return isValidTheme(override) ? override : null;
}
function getQueryParam(paramName: string): string | null {
return new URLSearchParams(window.location.search).get(paramName);
}
export function updateTheme(theme: ThemeOption) {
if (theme === 'system') {
window.document.body.removeAttribute('data-theme');
themeRef.value = null;
} else {
addThemeToBody(theme);
themeRef.value = theme;
}
}
export function getPreferredTheme(): { theme: AppliedThemeOption; mediaQuery: MediaQueryList } {
const isDarkModeQuery = !!window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');
return {
theme: isDarkModeQuery?.matches ? 'dark' : 'light',
mediaQuery: isDarkModeQuery,
};
}