ux: improve checkbox contrast in dark theme

Author: liccode

src/Resources/Styles.axaml

@@ -1021,7 +1021,7 @@
     <Setter Property="Template">
       <ControlTemplate>
         <Grid Background="Transparent" ColumnDefinitions="Auto,*">
-          <Border x:Name="Border" Grid.Column="0" Width="16" Height="16" VerticalAlignment="Center" BorderBrush="{DynamicResource Brush.Border1}" BorderThickness="1" Background="Transparent" CornerRadius="2">
+          <Border x:Name="Border" Grid.Column="0" Width="16" Height="16" VerticalAlignment="Center" BorderBrush="{DynamicResource Brush.CheckBox.Border}" BorderThickness="1" Background="Transparent" CornerRadius="2">
             <Path x:Name="Icon" Height="12" Width="12" Data="{DynamicResource Icons.Check}" Fill="{DynamicResource Brush.Accent}" IsVisible="False" Margin="0,2,0,0"/>
           </Border>
 
@@ -1038,19 +1038,24 @@
     <Style Selector="^:pointerover /template/ Border#Border">
       <Setter Property="BorderBrush" Value="{DynamicResource Brush.Accent}"/>
     </Style>
+    <Style Selector="^:checked /template/ Border#Border">
+      <Setter Property="Background" Value="{DynamicResource Brush.CheckBox.CheckedBackground}"/>
+      <Setter Property="BorderBrush" Value="{DynamicResource Brush.CheckBox.CheckedBorder}"/>
+    </Style>
     <Style Selector="^:checked /template/ Path#Icon">
       <Setter Property="IsVisible" Value="True"/>
+      <Setter Property="Fill" Value="{DynamicResource Brush.CheckBox.CheckedFG}"/>
     </Style>
     <Style Selector="^:focus-visible /template/ Border#Border">
       <Setter Property="BorderBrush" Value="{DynamicResource Brush.Accent}"/>
       <Setter Property="BorderThickness" Value="2"/>
     </Style>
     <Style Selector="^:focus-visible:checked /template/ Border#Border">
       <Setter Property="BorderBrush" Value="{DynamicResource Brush.Accent}"/>
-      <Setter Property="Background" Value="{DynamicResource Brush.Accent}"/>
+      <Setter Property="Background" Value="{DynamicResource Brush.CheckBox.CheckedBackground}"/>
     </Style>
     <Style Selector="^:focus-visible:checked /template/ Path#Icon">
-      <Setter Property="Fill" Value="White"/>
+      <Setter Property="Fill" Value="{DynamicResource Brush.CheckBox.CheckedFG}"/>
     </Style>
   </Style>
 

src/Resources/Themes.axaml

@@ -33,6 +33,10 @@
       <Color x:Key="Color.InlineCode">#FFE4E4E4</Color>
       <Color x:Key="Color.InlineCodeFG">Black</Color>
       <Color x:Key="Color.HistoryBG">#FFF0F5F9</Color>
+      <Color x:Key="Color.CheckBox.Border">#FF898989</Color>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedBackground" Color="Transparent"/>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedBorder" Color="#FF898989"/>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedFG" Color="{DynamicResource SystemAccentColor}"/>
     </ResourceDictionary>
 
     <ResourceDictionary x:Key="Dark">
@@ -67,6 +71,10 @@
       <Color x:Key="Color.InlineCode">#FF383838</Color>
       <Color x:Key="Color.InlineCodeFG">#FFF0F0F0</Color>
       <Color x:Key="Color.HistoryBG">#FF272727</Color>
+      <Color x:Key="Color.CheckBox.Border">#FFA8A8A8</Color>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedBackground" Color="{DynamicResource SystemAccentColor}"/>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedBorder" Color="{DynamicResource SystemAccentColor}"/>
+      <SolidColorBrush x:Key="Brush.CheckBox.CheckedFG" Color="White"/>
     </ResourceDictionary>
   </ResourceDictionary.ThemeDictionaries>
 
@@ -85,6 +93,7 @@
   <SolidColorBrush x:Key="Brush.Conflict.TheirsBG" Color="{DynamicResource Color.Conflict.TheirsBG}"/>
   <SolidColorBrush x:Key="Brush.Border0" Color="{DynamicResource Color.Border0}"/>
   <SolidColorBrush x:Key="Brush.Border1" Color="{DynamicResource Color.Border1}"/>
+  <SolidColorBrush x:Key="Brush.CheckBox.Border" Color="{DynamicResource Color.CheckBox.Border}"/>
   <SolidColorBrush x:Key="Brush.Border2" Color="{DynamicResource Color.Border2}"/>
   <SolidColorBrush x:Key="Brush.FlatButton.Background" Color="{DynamicResource Color.FlatButton.Background}"/>
   <SolidColorBrush x:Key="Brush.FlatButton.BackgroundHovered" Color="{DynamicResource Color.FlatButton.BackgroundHovered}"/>