Skip to content

Commit

Permalink
Correct Default Application Selector styles for high contrast and to …
Browse files Browse the repository at this point in the history
…change with OS theme dark/light toggle (#10185)

Correct Default Application Selector styles for high contrast and to change with OS theme dark/light toggle

## References
- https://docs.microsoft.com/windows/uwp/design/controls-and-patterns/xaml-theme-resources

## PR Checklist
* [x] Closes #10181
* [x] I work here
* [x] Manual tests passed

## Detailed Description of the Pull Request / Additional comments
1. If I'm going to override colors, I need to define styles in a resource dictionary with Light, Dark, and HighContrast variants so it can be appropriate for each of those. 
2. For HighContrast, I need to not mess with text colors and let them follow the default settings. 
3. For using System Brushes, I need to use a `ThemeResource` binding not a `StaticResource` binding. The former lets it change when you flip the OS toggle Light/Dark. The latter is stuck to whatever it was when the page loaded.

## Validation Steps Performed
- Loaded in light mode. Flipped to dark. Watched it change live. Checked both unselected and rollover/selected to ensure it was fine.
- Loaded in dark mode. Flipped to light. Watched it change live. Checked both unselected and rollover/selected to ensure it was fine.
- Flipped to HC. Watched it change live. Confirmed that unselected is black/white contrast and the roll over has the cyan/black. (No longer uses special second-line brush for HC, matches the controls I modeled this one on from OS Settings).
  • Loading branch information
miniksa authored May 26, 2021
1 parent 7687dd7 commit 43d5713
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 2 deletions.
20 changes: 20 additions & 0 deletions src/cascadia/TerminalSettingsEditor/CommonResources.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,26 @@
<ResourceDictionary Source="SettingContainerStyle.xaml" />
</ResourceDictionary.MergedDictionaries>

<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Light">
<Style x:Key="SecondaryTextBlockStyle"
TargetType="TextBlock">
<Setter Property="Foreground" Value="{ThemeResource SystemBaseMediumColor}" />
</Style>
</ResourceDictionary>
<ResourceDictionary x:Key="Dark">
<Style x:Key="SecondaryTextBlockStyle"
TargetType="TextBlock">
<Setter Property="Foreground" Value="{ThemeResource SystemBaseMediumColor}" />
</Style>
</ResourceDictionary>
<ResourceDictionary x:Key="HighContrast">
<Style x:Key="SecondaryTextBlockStyle"
TargetType="TextBlock" />
<!-- Do not mess with the foreground color for High Contrast. Let it ride as is. -->
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

<x:Double x:Key="StandardIconSize">14.0</x:Double>
<Thickness x:Key="StandardIndentMargin">13,0,0,0</Thickness>
<Thickness x:Key="StandardControlMargin">0,24,0,0</Thickness>
Expand Down
4 changes: 2 additions & 2 deletions src/cascadia/TerminalSettingsEditor/Launch.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -114,12 +114,12 @@

<TextBlock Grid.Row="1"
Grid.Column="1"
Foreground="{StaticResource SystemBaseMediumColor}"
Style="{ThemeResource SecondaryTextBlockStyle}"
Text="{x:Bind Author}" />

<TextBlock Grid.Row="1"
Grid.Column="2"
Foreground="{StaticResource SystemBaseMediumColor}"
Style="{ThemeResource SecondaryTextBlockStyle}"
Text="{x:Bind Version}" />

</Grid>
Expand Down

0 comments on commit 43d5713

Please sign in to comment.