fix default values for system-theme-overrides

[azrikahar]

Context

Currently when a user with light theme looks at Dark Theme Customizations field, the default values are actually light theme's rather than dark theme's:

(the foreground for dark theme should be light/white, while the background should be black/dark)

This is because darkMode here depends on the current user's configured appearance, rather than "light" for Light Theme Customization, and "dark" for Dark Theme Customization:

directus/app/src/interfaces/_system/system-theme-overrides/system-theme-overrides.vue

Line 40 in be4410f

const { darkMode, themeDark, themeLight } = useThemeConfiguration();

This PR adds a new prop to system-theme-overrides so it will use the forced/correct appearance instead of depending on the current user's appearance to show the correct default values.

Result

Scope

What's changed:

• Use fixed dark/light appearance to set the correct default values for Light Theme Customizations and Dark Theme Customizations fields

Potential Risks / Drawbacks

• None if I'm not mistaken, unless system-theme-overrides component will be used elsewhere where it needs to depend on the user's appearance

Review Notes / Questions

• Check whether this logic is correct

[changeset-bot]

🦋 Changeset detected

Latest commit: 80c5b3d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@directus/app	Patch
@directus/api	Patch
directus	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[paescuj]

LGTM 🚀