Theme for settings

[bundgaard]

Adds support for a new settings object in the theme settings. This includes a single property, theme. This allows users to set a different theme from the app's requested theme, if they so choose.

Closes #9231

[zadjii-msft]

Hey so I spent another few minutes playing with this, and I think I realized what's wonky about mica and the settings UI. Basically, Mica will always be in the app theme, so a light themed MainPage will have black text, and if you put that on top of a dark-themed Mica, it'll look insane.

Fortunately, the fix is actually pretty straightforward:

diff --git a/src/cascadia/TerminalSettingsEditor/MainPage.cpp b/src/cascadia/TerminalSettingsEditor/MainPage.cpp
index be390f728..ea98ee83f 100644
--- a/src/cascadia/TerminalSettingsEditor/MainPage.cpp
+++ b/src/cascadia/TerminalSettingsEditor/MainPage.cpp
@@ -699,21 +699,23 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
             }
         }

-        if (!isMicaAvailable)
-        {
-            return;
-        }
         const auto& theme = _settingsSource.GlobalSettings().CurrentTheme();
-        const auto& requestedTheme = (theme.Settings() != nullptr) ? theme.Settings().RequestedTheme() : theme.RequestedTheme();
+        const bool hasThemeForSettings{ theme.Settings() != nullptr };
+        const auto& appTheme = theme.RequestedTheme();
+        const auto& requestedTheme = (hasThemeForSettings) ? theme.Settings().RequestedTheme() : appTheme;

         RequestedTheme(requestedTheme);

-        if (!isMicaAvailable)
-        {
-            return;
-        }
+        // Mica gets it's appearance from the app's theme, not necessarily the
+        // Page's theme. In the case of dark app, light settings, mica will be a
+        // dark color, and the text will also be dark, making the UI _very_ hard
+        // to read. (and similarly in the inverse situation).
+        //
+        // To mitigate this, don't set the transparent background in the case
+        // that our theme is different than the app's.
+        const bool actuallyUseMica = isMicaAvailable && (appTheme == requestedTheme);

-        const auto bgKey = (theme.Window() != nullptr && theme.Window().UseMica()) ?
+        const auto bgKey = (theme.Window() != nullptr && theme.Window().UseMica()) && actuallyUseMica ?
                                L"SettingsPageMicaBackground" :
                                L"SettingsPageBackground";

I think you should be able to take that delta and get this into a totally working state, and we can finally merge this in. Sorry for all the delays here.

settings blob I was using

        {
            "name": "GH#16479 Light app, no mica, light settings",
            "window":
            {
                "applicationTheme": "light",
                "useMica": false
            },
            "settings": { "theme": "light" }
        },
        {
            "name": "GH#16479 Dark app, no mica, light settings",
            "window":
            {
                "applicationTheme": "dark",
                "useMica": false
            },
            "settings": { "theme": "light" }
        },
        {
            "name": "GH#16479 Light app, yes mica, light settings",
            "window":
            {
                "applicationTheme": "light",
                "useMica": true
            },
            "settings": { "theme": "light" }
        },
        {
            "name": "GH#16479 Dark app, yes mica, light settings",
            "window":
            {
                "applicationTheme": "dark",
                "useMica": true
            },
            "settings": { "theme": "light" }
        },
        {
            "name": "GH#16479 Light app, no mica, dark settings",
            "window":
            {
                "applicationTheme": "light",
                "useMica": false
            },
            "settings": { "theme": "dark" }
        },
        {
            "name": "GH#16479 Dark app, no mica, dark settings",
            "window":
            {
                "applicationTheme": "dark",
                "useMica": false
            },
            "settings": { "theme": "dark" }
        },
        {
            "name": "GH#16479 Light app, yes mica, dark settings",
            "window":
            {
                "applicationTheme": "light",
                "useMica": true
            },
            "settings": { "theme": "dark" }
        },
        {
            "name": "GH#16479 Dark app, yes mica, dark settings",
            "window":
            {
                "applicationTheme": "dark",
                "useMica": true
            },
            "settings": { "theme": "dark" }
        }

[zadjii-msft]

(as noted)

[zadjii-msft]

I'm just gonna push the above delta to this branch after Build and get this merged in, cause I think this is pretty straightforward.

now I'm on the hook

[carlos-zamora]

Just want a response to that one comment before reviewing. Also don't forget to update the...

• schema
• docs

[carlos-zamora]

Does this macro get called anywhere?

[zadjii-msft]

[carlos-zamora]

Idk why ctrl+f didn't find the reference there... thanks!