Add nullable colors to settings UI

[carlos-zamora]

Summary of the Pull Request

Adds some pre-existing settings ($profile.foreground, $profile.background, $profile.selectionBackground, $profile.cursorColor) to the settings UI. This was accomplished by introducing a new control: NullableColorPicker. This control allows the user to pick a color from the color scheme, set the color to null, and select a color from an advanced color picker.

References and Relevant Issues

#10000

Detailed Description of the Pull Request / Additional comments

• NullableColorPicker control
  • includes a built-in NullColorButton to set the current value to null
  • includes a "More colors..." button to display an advanced color picker
  • uses data templates on data templates (data templates squared?) to convert the current color scheme into a grid of color chips
  • color chips display a checkmark (similar to Windows settings personalization). This automatically updates its color to stay compliant with color contrast.
  • color chips are added to a list so we can (un)check them when a new color is selected
• SettingsContainer changes
  • Forked ExpanderSettingContainerStyle to allow for a custom preview template. This way, we can display the current value in the expander and we're not just limited to text.
  • changed type of CurrentValue property from String to IInspectable
  • added CurrentValueTemplate property to control how to display the current value
• Miscellaneous:
  • Added a few converters (BooleanToVisibility, ColorToString, ColorToBrush)
  • Added NameWithHexCode to ColorTableEntry to expose a color as Red #RRGGBB (used for tooltips and a11y)
  • Added ForegroundPreview (and equivalent for other colors) to AppearanceViewModel to deduce the color that will be used

Validation Steps Performed

• a11y pass (NVDA, keyboard)
• set the color to one of the color chips
• set the color to null
• set the color to a value from the integrated color picker
• control updates properly when a new color scheme is selected
• control updates properly when a color scheme has multiple colors of the same value

Follow-ups

• [A11y] Screen readers don't read expander's preview text
• Add Tab Color to settings UI
• Update CursorColor preview to display #FFFFFF as "invert"
• [Focus issue] Clicking on the appearance page yeets focus to FontFace control

[carlos-zamora]

Demo