Fix ContentDialog CornerRadius (#1405)

* Fix ContentDialog CornerRadius * Update masters * Fix conditional xaml
microsoft · Oct 4, 2019 · 45c12e5 · 45c12e5
1 parent 0053f1e
commit 45c12e5
Show file tree

Hide file tree

Showing 8 changed files with 35 additions and 185 deletions.
diff --git a/MUXControls.sln b/MUXControls.sln
@@ -747,6 +747,7 @@ Global
 		dev\CommandBarFlyout\CommandBarFlyout.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
 		dev\CommonStyles\CommonStyles.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
 		dev\Common\Common.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
+		dev\ContentDialog\ContentDialog.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
 		dev\DatePicker\DatePicker.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
 		dev\DropDownButton\DropDownButton.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4
 		dev\Effects\Microsoft.UI.Composition.Effects.vcxitems*{ad0c90b0-4845-4d4b-88f1-86f653f8171b}*SharedItemsImports = 4

diff --git a/dev/ContentDialog/ContentDialog_themeresources.xaml b/dev/ContentDialog/ContentDialog_themeresources.xaml
@@ -23,7 +23,8 @@
             <Thickness x:Key="ContentDialogTitleMargin">0,0,0,12</Thickness>
             <Thickness x:Key="ContentDialogPadding">24,18,24,24</Thickness>
             <StaticResource x:Key="ContentDialogForeground" ResourceKey="SystemControlPageTextBaseHighBrush" />
-            <StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
+            <contract7NotPresent:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlBackgroundChromeMediumLowBrush" />
+            <contract7Present:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
             <StaticResource x:Key="ContentDialogBorderBrush" ResourceKey="SystemControlBackgroundBaseLowBrush" />
             <StaticResource x:Key="ContentDialogLightDismissOverlayBackground" ResourceKey="SystemControlPageBackgroundMediumAltMediumBrush" />
             <SolidColorBrush x:Key="ContentDialogBackgroundThemeBrush" Color="LightGray" />
@@ -34,8 +35,9 @@
         </ResourceDictionary>
         <ResourceDictionary x:Key="HighContrast">
             <StaticResource x:Key="ContentDialogForeground" ResourceKey="SystemControlPageTextBaseHighBrush" />
-            <StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlBackgroundAltHighBrush" />
-            <StaticResource x:Key="ContentDialogBorderBrush" ResourceKey="SystemControlForegroundAccentBrush" />
+            <contract7NotPresent:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlBackgroundChromeMediumLowBrush" />
+            <contract7Present:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
+            <StaticResource x:Key="ContentDialogBorderBrush" ResourceKey="SystemControlBackgroundBaseLowBrush" />
             <StaticResource x:Key="ContentDialogLightDismissOverlayBackground" ResourceKey="SystemControlPageBackgroundMediumAltMediumBrush" />
             <x:Double x:Key="ContentDialogMinWidth">320</x:Double>
             <x:Double x:Key="ContentDialogMaxWidth">548</x:Double>
@@ -53,7 +55,7 @@
             <Thickness x:Key="ContentDialogContentScrollViewerMargin">0,0,0,0</Thickness>
             <Thickness x:Key="ContentDialogTitleMargin">0,0,0,12</Thickness>
             <Thickness x:Key="ContentDialogPadding">24,18,24,24</Thickness>
-            <StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
+            <SolidColorBrush x:Key="ContentDialogBackgroundThemeBrush" Color="{ThemeResource SystemColorButtonTextColor}" />
             <SolidColorBrush x:Key="ContentDialogBorderThemeBrush" Color="{ThemeResource SystemAccentColor}" />
             <SolidColorBrush x:Key="ContentDialogContentForegroundBrush" Color="Black" />
             <SolidColorBrush x:Key="ContentDialogDimmingThemeBrush" Color="{ThemeResource SystemColorHighlightColor}" />
@@ -77,7 +79,8 @@
             <Thickness x:Key="ContentDialogTitleMargin">0,0,0,12</Thickness>
             <Thickness x:Key="ContentDialogPadding">24,18,24,24</Thickness>
             <StaticResource x:Key="ContentDialogForeground" ResourceKey="SystemControlPageTextBaseHighBrush" />
-            <StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
+            <contract7NotPresent:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlBackgroundChromeMediumLowBrush" />
+            <contract7Present:StaticResource x:Key="ContentDialogBackground" ResourceKey="SystemControlPageBackgroundAltHighBrush" />
             <StaticResource x:Key="ContentDialogBorderBrush" ResourceKey="SystemControlBackgroundBaseLowBrush" />
             <StaticResource x:Key="ContentDialogLightDismissOverlayBackground" ResourceKey="SystemControlPageBackgroundMediumAltMediumBrush" />
             <SolidColorBrush x:Key="ContentDialogBackgroundThemeBrush" Color="LightGray" />
@@ -95,6 +98,9 @@
         <Setter Property="Background" Value="{ThemeResource ContentDialogBackground}" />
         <Setter Property="BorderBrush" Value="{ThemeResource ContentDialogBorderBrush}" />
         <Setter Property="IsTabStop" Value="False" />
+        <Setter Property="PrimaryButtonStyle" Value="{ThemeResource DefaultButtonStyle}" />
+        <Setter Property="SecondaryButtonStyle" Value="{ThemeResource DefaultButtonStyle}" />
+        <Setter Property="CloseButtonStyle" Value="{ThemeResource DefaultButtonStyle}" />
         <contract7Present:Setter Property="CornerRadius" Value="{ThemeResource OverlayCornerRadius}" />
         <Setter Property="Template">
             <Setter.Value>

diff --git a/dev/ContentDialog/TestUI/ContentDialogPage.xaml.cs b/dev/ContentDialog/TestUI/ContentDialogPage.xaml.cs
@@ -16,7 +16,7 @@ public ContentDialogPage()
 
         private void ShowDialog_Click(object sender, RoutedEventArgs e)
         {
-            var dialog = new ContentDialog { Title = "Title", Content = "Content", IsPrimaryButtonEnabled = true, PrimaryButtonText = "PrimaryButton" };
+            var dialog = new ContentDialog { Title = "Title", Content = "Content", IsPrimaryButtonEnabled = true, PrimaryButtonText = "PrimaryButton", SecondaryButtonText = "SecondaryButton", CloseButtonText = "CloseButton" };
             _ = dialog.ShowAsync();
         }
     }

diff --git a/dev/dll/Microsoft.UI.Xaml.vcxproj b/dev/dll/Microsoft.UI.Xaml.vcxproj
@@ -131,6 +131,7 @@
     <Import Project="..\ScrollBar\ScrollBar.vcxitems" Label="Shared" Condition="$(FeatureScrollBarEnabled) == 'true' Or $(FeatureScrollBarEnabled) == 'productOnly'" />
     <Import Project="..\CalendarView\CalendarView.vcxitems" Label="Shared" Condition="$(FeatureScrollBarEnabled) == 'true' Or $(FeatureScrollBarEnabled) == 'productOnly'" />
     <Import Project="..\SplitView\SplitView.vcxitems" Label="Shared" Condition="$(FeatureScrollBarEnabled) == 'true' Or $(FeatureScrollBarEnabled) == 'productOnly'" />
+    <Import Project="..\ContentDialog\ContentDialog.vcxitems" Label="Shared" Condition="$(FeatureContentDialogEnabled) == 'true' Or $(FeatureContentDialogEnabled) == 'productOnly'" />
   </ImportGroup>
   <ItemGroup>
     <SharedPage Include="@(Page)" />

diff --git a/test/MUXControlsTestApp/master/ContentDialog-5.xml b/test/MUXControlsTestApp/master/ContentDialog-5.xml
@@ -17,8 +17,8 @@
       Padding=0,0,0,0
       Foreground=#FF000000
       BorderThickness=0,0,0,0
-      BorderBrush=#FF0078D7
-      Background=#FFFFFFFF
+      BorderBrush=#33000000
+      Background=#FFF2F2F2
       Margin=0,0,0,0
       FocusVisualSecondaryThickness=1,1,1,1
       FocusVisualSecondaryBrush=#99FFFFFF
@@ -56,10 +56,10 @@
           RenderSize=0,0
         [Windows.UI.Xaml.Controls.Border]
             Padding=0,0,0,0
-            CornerRadius=0,0,0,0
+            CornerRadius=4,4,4,4
             BorderThickness=1,1,1,1
-            BorderBrush=#FF0078D7
-            Background=#FFFFFFFF
+            BorderBrush=#33000000
+            Background=#FFF2F2F2
             Name=BackgroundElement
             MinWidth=320
             MinHeight=184
@@ -93,7 +93,7 @@
                 BorderBrush=#00FFFFFF
                 Background=#00FFFFFF
                 Name=ContentScrollViewer
-                Margin=0,0,0,24
+                Margin=0,0,0,0
                 FocusVisualSecondaryThickness=1,1,1,1
                 FocusVisualSecondaryBrush=#99FFFFFF
                 FocusVisualPrimaryThickness=2,2,2,2
@@ -107,15 +107,15 @@
                 BorderBrush=[NULL]
                 Background=[NULL]
                 Name=CommandSpace
-                Margin=0,0,0,0
+                Margin=0,24,0,0
                 FocusVisualSecondaryThickness=1,1,1,1
                 FocusVisualSecondaryBrush=#99FFFFFF
                 FocusVisualPrimaryThickness=2,2,2,2
                 FocusVisualPrimaryBrush=#FF000000
-                Visibility=Visible
+                Visibility=Collapsed
                 RenderSize=0,0
               [Windows.UI.Xaml.Controls.Button]
-                  Padding=8,4,8,4
+                  Padding=8,5,8,5
                   Foreground=#FF000000
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
@@ -126,10 +126,10 @@
                   FocusVisualSecondaryBrush=#99FFFFFF
                   FocusVisualPrimaryThickness=2,2,2,2
                   FocusVisualPrimaryBrush=#FF000000
-                  Visibility=Collapsed
+                  Visibility=Visible
                   RenderSize=0,0
               [Windows.UI.Xaml.Controls.Button]
-                  Padding=8,4,8,4
+                  Padding=8,5,8,5
                   Foreground=#FF000000
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
@@ -140,10 +140,10 @@
                   FocusVisualSecondaryBrush=#99FFFFFF
                   FocusVisualPrimaryThickness=2,2,2,2
                   FocusVisualPrimaryBrush=#FF000000
-                  Visibility=Collapsed
+                  Visibility=Visible
                   RenderSize=0,0
               [Windows.UI.Xaml.Controls.Button]
-                  Padding=8,4,8,4
+                  Padding=8,5,8,5
                   Foreground=#FF000000
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
@@ -154,5 +154,5 @@
                   FocusVisualSecondaryBrush=#99FFFFFF
                   FocusVisualPrimaryThickness=2,2,2,2
                   FocusVisualPrimaryBrush=#FF000000
-                  Visibility=Collapsed
+                  Visibility=Visible
                   RenderSize=0,0
diff --git a/test/MUXControlsTestApp/master/ContentDialog-6.xml b/test/MUXControlsTestApp/master/ContentDialog-6.xml
diff --git a/test/MUXControlsTestApp/master/ContentDialog-7.xml b/test/MUXControlsTestApp/master/ContentDialog-7.xml
@@ -19,7 +19,7 @@
       BorderThickness=0,0,0,0
       BorderBrush=#33000000
       Background=#FFFFFFFF
-      CornerRadius=0,0,0,0
+      CornerRadius=4,4,4,4
       Margin=0,0,0,0
       FocusVisualSecondaryThickness=1,1,1,1
       FocusVisualSecondaryBrush=#99FFFFFF
@@ -57,7 +57,7 @@
           RenderSize=0,0
         [Windows.UI.Xaml.Controls.Border]
             Padding=0,0,0,0
-            CornerRadius=0,0,0,0
+            CornerRadius=4,4,4,4
             BorderThickness=1,1,1,1
             BorderBrush=#33000000
             Background=#FFFFFFFF
@@ -122,7 +122,7 @@
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
                   Background=#33000000
-                  CornerRadius=0,0,0,0
+                  CornerRadius=2,2,2,2
                   Name=PrimaryButton
                   Margin=0,0,2,0
                   FocusVisualSecondaryThickness=1,1,1,1
@@ -137,7 +137,7 @@
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
                   Background=#33000000
-                  CornerRadius=0,0,0,0
+                  CornerRadius=2,2,2,2
                   Name=SecondaryButton
                   Margin=2,0,2,0
                   FocusVisualSecondaryThickness=1,1,1,1
@@ -152,7 +152,7 @@
                   BorderThickness=1,1,1,1
                   BorderBrush=#00FFFFFF
                   Background=#33000000
-                  CornerRadius=0,0,0,0
+                  CornerRadius=2,2,2,2
                   Name=CloseButton
                   Margin=2,0,0,0
                   FocusVisualSecondaryThickness=1,1,1,1

diff --git a/test/MUXControlsTestApp/master/ContentDialog.xml b/test/MUXControlsTestApp/master/ContentDialog.xml
@@ -17,8 +17,8 @@
       Padding=0,0,0,0
       Foreground=#FF000000
       BorderThickness=0,0,0,0
-      BorderBrush=#FF0078D7
-      Background=#FFFFFFFF
+      BorderBrush=#33000000
+      Background=#FFF2F2F2
       MaxWidth=548
       MaxHeight=756
       Margin=0,0,0,0