From 2a44e707f532959170e00dc066e25aa4d0519b34 Mon Sep 17 00:00:00 2001
From: Steven Kirk <grokys@gmail.com>
Date: Wed, 2 Mar 2016 18:02:24 +0100
Subject: [PATCH] Use theme colors in ControlCatalog.

And demonstrate changing theme colors for a single button.
---
 samples/ControlCatalog/Pages/BorderPage.paml  | 11 +++++---
 samples/ControlCatalog/Pages/ButtonPage.paml  | 26 +++++++++++++------
 .../ControlCatalog/Pages/DropDownPage.paml    |  2 +-
 3 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/samples/ControlCatalog/Pages/BorderPage.paml b/samples/ControlCatalog/Pages/BorderPage.paml
index 5ce9eb80f1..5cad5dfc42 100644
--- a/samples/ControlCatalog/Pages/BorderPage.paml
+++ b/samples/ControlCatalog/Pages/BorderPage.paml
@@ -7,19 +7,22 @@
                 Margin="0,16,0,0"
                 HorizontalAlignment="Center"
                 Gap="16">
-      <Border BorderBrush="#f44336" BorderThickness="2" Padding="16">
+      <Border BorderBrush="{StyleResource ThemeAccentBrush}" BorderThickness="2" Padding="16">
         <TextBlock>Border</TextBlock>
       </Border>
-      <Border Background="#f44336" BorderBrush="#4285f4" BorderThickness="4" Padding="16">
+      <Border Background="{StyleResource ThemeAccentBrush2}" 
+              BorderBrush="{StyleResource ThemeAccentBrush}" 
+              BorderThickness="4" 
+              Padding="16">
         <TextBlock>Border and Background</TextBlock>
       </Border>
-      <Border BorderBrush="#4285f4" 
+      <Border BorderBrush="{StyleResource ThemeAccentBrush}"
               BorderThickness="4" 
               CornerRadius="8"
               Padding="16">
         <TextBlock>Rounded Corners</TextBlock>
       </Border>
-      <Border Background="#f44336" 
+      <Border Background="{StyleResource ThemeAccentBrush2}"
               CornerRadius="8"
               Padding="16">
         <TextBlock>Rounded Corners</TextBlock>
diff --git a/samples/ControlCatalog/Pages/ButtonPage.paml b/samples/ControlCatalog/Pages/ButtonPage.paml
index a5f99634aa..5d9cce80f1 100644
--- a/samples/ControlCatalog/Pages/ButtonPage.paml
+++ b/samples/ControlCatalog/Pages/ButtonPage.paml
@@ -1,4 +1,5 @@
-<UserControl xmlns="https://github.com/perspex">
+<UserControl xmlns="https://github.com/perspex"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   <StackPanel Orientation="Vertical" Gap="4">
     <TextBlock Classes="h1">Button</TextBlock>
     <TextBlock Classes="h2">A button control</TextBlock>
@@ -9,18 +10,27 @@
                 Gap="16">
       <StackPanel Orientation="Vertical" Gap="8" Width="150">
         <Button>Button</Button>
-        <Button Foreground="Blue">Foreground</Button>
-        <Button Background="#f44336">Background</Button>
+        <Button Foreground="White">Foreground</Button>
+        <Button Background="{StyleResource ThemeAccentBrush}">Background</Button>
         <Button IsEnabled="False">Disabled</Button>
+        <Button Content="Re-themed">
+          <Button.Styles>
+            <Style>
+              <Style.Resources>
+                <SolidColorBrush x:Key="ThemeBorderMidBrush">Red</SolidColorBrush>
+                <SolidColorBrush x:Key="ThemeControlDarkBrush">DarkRed</SolidColorBrush>
+              </Style.Resources>
+            </Style>
+          </Button.Styles>          
+        </Button>
       </StackPanel>
 
       <StackPanel Orientation="Vertical" Gap="8" Width="150">
         <Button BorderThickness="0">No Border</Button>
-        <Button BorderBrush="#f44336">Border Color</Button>
-        <Button BorderBrush="#f44336" BorderThickness="4">Thick Border</Button>
-        <Button BorderBrush="#f44336" BorderThickness="4" IsEnabled="False">Disabled</Button>
+        <Button BorderBrush="{StyleResource ThemeAccentBrush}">Border Color</Button>
+        <Button BorderBrush="{StyleResource ThemeAccentBrush}" BorderThickness="4">Thick Border</Button>
+        <Button BorderBrush="{StyleResource ThemeAccentBrush}" BorderThickness="4" IsEnabled="False">Disabled</Button>
       </StackPanel>
-    </StackPanel>
-    
+    </StackPanel>    
   </StackPanel>
 </UserControl>
\ No newline at end of file
diff --git a/samples/ControlCatalog/Pages/DropDownPage.paml b/samples/ControlCatalog/Pages/DropDownPage.paml
index 0637a3a80a..1660588525 100644
--- a/samples/ControlCatalog/Pages/DropDownPage.paml
+++ b/samples/ControlCatalog/Pages/DropDownPage.paml
@@ -14,7 +14,7 @@
       <DropDown SelectedIndex="0">
         <DropDownItem>
           <Panel>
-            <Rectangle Fill="Red"/>
+            <Rectangle Fill="{StyleResource ThemeAccentBrush}"/>
             <TextBlock Margin="8">Control Items</TextBlock>
           </Panel>
         </DropDownItem>