Change SolidColorBrush to AcrylicBrush in MainPage.xaml

[AlejandroBlanco2001]

Summary of the Pull Request

In the MainPage.xaml, change the SolidColorBrush to AcrylicBrush to be able to alter the color of the panel when it cannot be rendered

References and Relevant Issues

• Give our NavigationView's acrylic a fallback color #9752 Original implementaion
• Settings UI tweaks #12973 Modifying this change

Detailed Description of the Pull Request / Additional comments

In #12973, we changed the way of rendering the panel to use a SolidColorBrush with a transparent background. However, when this cannot be rendered, it causes an error of overlapping. Therefore, this change is to revert this panel to the original implementation introduced in #9752, using AcrylicBrush and setting the color to 'SystemChromeMediumLowColor' when it cannot be rendered.

Validation Steps Performed

1. Open the Windows terminal App
2. Set the width to <= 500px
3. Open the Settings tab
4. Check that the background is not longer overlapping.

PR Checklist

• Closes Sidebar and settings are shown at the same time #16906
• Tests added/passed
• Documentation updated
  • If checked, please file a pull request on our docs repo and link it here: #xxx
• Schema updated (if necessary)

[AlejandroBlanco2001]

@AlejandroBlanco2001 please read the following Contributor License Agreement(CLA). If you agree with the CLA, please reply with the following information.

@microsoft-github-policy-service agree [company="{your company}"]

Options:

• (default - no company specified) I have sole ownership of intellectual property rights to my Submissions and I am not making Submissions in the course of work for my employer.

@microsoft-github-policy-service agree

• (when company given) I am making Submissions in the course of work for my employer (or my employer has intellectual property rights in my Submissions by contract or applicable law). I have permission from my employer to make Submissions and enter into this Agreement on behalf of my employer. By signing below, the defined term “You” includes me and my employer.

@microsoft-github-policy-service agree company="Microsoft"

Contributor License Agreement

@microsoft-github-policy-service agree