From 3ecebc0387157d25c4b2b4a9bc8475d043d0306f Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 15:48:14 +0800
Subject: [PATCH 01/13] fix: Update TextBox theme.

---
 .../Pages/TextBoxDemo.axaml                   | 36 +++++++++---
 .../Controls/AutoCompleteBox.axaml            |  2 +-
 src/Semi.Avalonia/Controls/TextBox.axaml      | 55 +++++++++++--------
 src/Semi.Avalonia/Themes/Dark/TextBox.axaml   | 26 +++++----
 src/Semi.Avalonia/Themes/Light/TextBox.axaml  | 28 +++++-----
 5 files changed, 89 insertions(+), 58 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/TextBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/TextBoxDemo.axaml
index f8169ae..a181a61 100644
--- a/demo/Semi.Avalonia.Demo/Pages/TextBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/TextBoxDemo.axaml
@@ -1,26 +1,46 @@
 <UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo" xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="450"
-    d:DesignWidth="800" mc:Ignorable="d">
+    x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    d:DesignHeight="450"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
     <ScrollViewer>
         <StackPanel HorizontalAlignment="Left" Spacing="20">
             <TextBox Width="300" />
+            <TextBox Width="300" Classes="Large" />
+            <TextBox Width="300" Classes="Small" />
             <TextBox Width="300" Watermark="Please use this" />
             <TextBox Width="300" InnerLeftContent="http://" />
             <TextBox Width="300" InnerRightContent=".com" />
             <TextBox
-                Width="500" InnerLeftContent="http://"
+                Width="500"
+                InnerLeftContent="http://"
                 InnerRightContent=".com" />
             <TextBox Width="300" Classes="clearButton" />
             <TextBox Width="300" PasswordChar="*" />
             <TextBox
-                Width="300" Classes="revealPasswordButton"
+                Width="300"
+                Classes="revealPasswordButton"
                 PasswordChar="*" />
             <TextBox
-                Width="500" InnerLeftContent="http://"
+                Width="500"
+                InnerLeftContent="http://"
                 InnerRightContent=".com"
-                Theme="{StaticResource BorderlessTextBox}" />
+                IsEnabled="False" />
+            <TextBox
+                Width="500"
+                Classes="Bordered"
+                InnerLeftContent="http://"
+                InnerRightContent=".com" />
+            <TextBox
+                Width="500"
+                Classes="Bordered"
+                InnerLeftContent="http://"
+                InnerRightContent=".com"
+                IsEnabled="False" />
         </StackPanel>
     </ScrollViewer>
 </UserControl>
diff --git a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
index 64a6416..e2377cb 100644
--- a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
@@ -56,7 +56,7 @@
         TargetType="AutoCompleteBox">
         <ControlTheme.Children>
             <Style Selector="^ /template/ TextBox#PART_TextBox">
-                <Setter Property="Theme" Value="{StaticResource BorderlessTextBox}" />
+                <Setter Property="Theme" Value="{DynamicResource BorderlessTextBox}" />
             </Style>
         </ControlTheme.Children>
         <Setter Property="Background" Value="{DynamicResource AutoCompleteBoxBorderlessBackground}" />
diff --git a/src/Semi.Avalonia/Controls/TextBox.axaml b/src/Semi.Avalonia/Controls/TextBox.axaml
index c8afe84..4975ac4 100644
--- a/src/Semi.Avalonia/Controls/TextBox.axaml
+++ b/src/Semi.Avalonia/Controls/TextBox.axaml
@@ -176,18 +176,24 @@
                 </Border>
             </ControlTemplate>
         </Setter>
+
+        <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxPointeroverBackground}" />
+        </Style>
+        <Style Selector="^:pressed /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxPressedBackground}" />
+        </Style>
+        <Style Selector="^:focus /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
+        </Style>
+        <Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
+        </Style>
         <Style Selector="^:disabled">
             <Setter Property="TextBox.Foreground" Value="{DynamicResource TextBoxDisabledForeground}" />
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
         </Style>
-        <Style Selector="^:pointerover">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxPointerOverBorderBrush}" />
-        </Style>
-        <Style Selector="^:focus">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
-        </Style>
-        <Style Selector="^.clearButton">
+        <Style Selector="^.clearButton, ^.ClearButton">
             <Style Selector="^[AcceptsReturn=False][IsReadOnly=False]:focus:not(:empty) /template/ Button#PART_ClearButton">
                 <Setter Property="Button.IsVisible" Value="True" />
             </Style>
@@ -195,7 +201,7 @@
                 <Setter Property="Button.IsVisible" Value="True" />
             </Style>
         </Style>
-        <Style Selector="^.revealPasswordButton">
+        <Style Selector="^.revealPasswordButton, ^.RevealPasswordButton">
             <Style Selector="^ /template/ ToggleButton#PART_RevealButton">
                 <Setter Property="ToggleButton.IsVisible" Value="True" />
             </Style>
@@ -206,21 +212,22 @@
         <Style Selector="^.Small">
             <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxSmallHeight}" />
         </Style>
-    </ControlTheme>
 
-    <ControlTheme
-        x:Key="BorderlessTextBox"
-        BasedOn="{StaticResource {x:Type TextBox}}"
-        TargetType="TextBox">
-        <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessDefaultBackground}" />
-        <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessDefaultBorderBrush}" />
-        <Style Selector="^:pointerover">
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessPointeroverBorderBrush}" />
-        </Style>
-        <Style Selector="^:focus">
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
+        <Style Selector="^.Bordered">
+            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedDefaultBackground}" />
+            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedDefaultBorderBrush}" />
+            <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
+                <Setter Property="Border.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:focus">
+                <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
+                <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
+                <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
+                <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
+            </Style>
         </Style>
     </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
index b6fd870..6d7c503 100644
--- a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
@@ -4,26 +4,28 @@
     xmlns:sys="clr-namespace:System;assembly=System.Runtime">
     <SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="White" />
 
-    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="#41464C" />
-    <SolidColorBrush x:Key="TextBoxDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="#7FC1FF" />
-    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxDefaultBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.2" Color="White" />
+    <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="TextBoxForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.62" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.6" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#E6E8EA" />
     <SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#E6E8EA" />
 
-    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#403238" />
+    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="#2E3238" />
+    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="Transparent" />
 
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
 
     <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
     <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>
diff --git a/src/Semi.Avalonia/Themes/Light/TextBox.axaml b/src/Semi.Avalonia/Themes/Light/TextBox.axaml
index c00388e..f073ca8 100644
--- a/src/Semi.Avalonia/Themes/Light/TextBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/TextBox.axaml
@@ -4,26 +4,28 @@
     xmlns:sys="clr-namespace:System;assembly=System.Runtime">
     <SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="Black" />
 
-    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="#C6CACD" />
-    <SolidColorBrush x:Key="TextBoxDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxDefaultBackground" Opacity="0.05" Color="#2E3238" />
+    <SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.09" Color="#FF2E3238" />
+    <SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.13" Color="#FF2E3238" />
     <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.05" Color="#E6E8EA" />
-    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="#0062D6" />
-    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#004FB3" />
+    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#0077FA" />
     <SolidColorBrush x:Key="TextBoxForeground" Color="#1C1F23" />
     <SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#1C1F23" />
     <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.62" Color="#1C1F23" />
 
-    <SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#2E3238" />
-    <SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#2E3238" />
+    <SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.08" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Color="#0077FA" />
 
-    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#403238" />
-    <SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#1C1F23" />
-    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="#E6E8EA" />
+    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#2E3238" />
+    <SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="Transparent" />
 
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBackground" Opacity="0.05" Color="#2E3238" />
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBackground" Opacity="0.09" Color="#2E3238" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.08" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
 
     <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
     <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>

From 7762eff21491004ff1cc5f9fa19d5aaf2de29beb Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 16:17:49 +0800
Subject: [PATCH 02/13] feat: AutoCompleteBox new theme.

---
 .../Pages/AutoCompleteBoxDemo.axaml           | 12 +++-
 .../Controls/AutoCompleteBox.axaml            | 58 ++++++++++++-------
 .../Themes/Dark/AutoCompleteBox.axaml         |  4 --
 .../Themes/Light/AutoCompleteBox.axaml        |  4 --
 4 files changed, 48 insertions(+), 30 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
index 65e30b9..dbd4fef 100644
--- a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
@@ -25,8 +25,18 @@
             </AutoCompleteBox.ItemTemplate>
         </AutoCompleteBox>
         <AutoCompleteBox
+            Classes="Bordered"
+            Items="{Binding States}"
+            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
+        <AutoCompleteBox
+            IsEnabled="False"
             Items="{Binding States}"
-            Theme="{StaticResource BorderlessAutoCompleteBox}"
             ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
diff --git a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
index e2377cb..01203b5 100644
--- a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
@@ -6,23 +6,14 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
-        <Setter Property="Background" Value="{DynamicResource AutoCompleteBoxDefaultBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxDefaultBorderBrush}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource AutoCompleteBoxCornerRadius}" />
         <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="600" />
-        <Setter Property="BorderThickness" Value="1" />
         <Setter Property="Template">
             <ControlTemplate TargetType="AutoCompleteBox">
                 <Panel>
                     <TextBox
                         Name="PART_TextBox"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
                         DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                         Watermark="{TemplateBinding Watermark}" />
-
                     <Popup
                         Name="PART_Popup"
                         MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
@@ -48,18 +39,43 @@
                 </Panel>
             </ControlTemplate>
         </Setter>
+
+        <Style Selector="^.Bordered">
+            <Setter Property="Template">
+                <ControlTemplate TargetType="AutoCompleteBox">
+                    <Panel>
+                        <TextBox
+                            Name="PART_TextBox"
+                            Classes="Bordered"
+                            DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
+                            Watermark="{TemplateBinding Watermark}" />
+                        <Popup
+                            Name="PART_Popup"
+                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                            MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                            IsLightDismissEnabled="True"
+                            PlacementTarget="{TemplateBinding}">
+                            <Border
+                                Margin="{DynamicResource AutoCompleteBoxPopupMargin}"
+                                HorizontalAlignment="Stretch"
+                                Background="{DynamicResource AutoCompleteBoxPopupBackground}"
+                                BorderBrush="{DynamicResource AutoCompleteBoxPopupBorderBrush}"
+                                BorderThickness="{DynamicResource AutoCompleteBoxPopupBorderThickness}"
+                                BoxShadow="{DynamicResource AutoCompleteBoxPopupBoxShadow}"
+                                CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}">
+                                <ListBox
+                                    Name="PART_SelectingItemsControl"
+                                    Foreground="{TemplateBinding Foreground}"
+                                    ItemTemplate="{TemplateBinding ItemTemplate}"
+                                    ScrollViewer.HorizontalScrollBarVisibility="Auto"
+                                    ScrollViewer.VerticalScrollBarVisibility="Auto" />
+                            </Border>
+                        </Popup>
+                    </Panel>
+                </ControlTemplate>
+            </Setter>
+        </Style>
     </ControlTheme>
 
-    <ControlTheme
-        x:Key="BorderlessAutoCompleteBox"
-        BasedOn="{StaticResource {x:Type AutoCompleteBox}}"
-        TargetType="AutoCompleteBox">
-        <ControlTheme.Children>
-            <Style Selector="^ /template/ TextBox#PART_TextBox">
-                <Setter Property="Theme" Value="{DynamicResource BorderlessTextBox}" />
-            </Style>
-        </ControlTheme.Children>
-        <Setter Property="Background" Value="{DynamicResource AutoCompleteBoxBorderlessBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxBorderlessBorderBrush}" />
-    </ControlTheme>
+
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
index 81ae115..194a05e 100644
--- a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
@@ -1,13 +1,9 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#41464C" />
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
     <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1AFFFFFF</BoxShadows>
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="#35363C" />
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#F9F9F9" />
     <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#E6E8EA" />
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
index 46dc2f1..ad05cb1 100644
--- a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
@@ -1,13 +1,9 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#C6CACD" />
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
     <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1A000000</BoxShadows>
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="White" />
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#1C1F23" />
     <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#2E3238" />
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
 </ResourceDictionary>

From ada894e456475011ac3f4d76551510a8c146f768 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 16:25:38 +0800
Subject: [PATCH 03/13] feat: update AutoCompleteBox theme.

---
 .../Pages/AutoCompleteBoxDemo.axaml           | 20 +++++++++++++++++++
 .../Controls/AutoCompleteBox.axaml            | 10 ++++++++++
 .../Themes/Light/AutoCompleteBox.axaml        |  3 +++
 src/Semi.Avalonia/Themes/Light/TextBox.axaml  | 17 +++++++---------
 4 files changed, 40 insertions(+), 10 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
index dbd4fef..277a486 100644
--- a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
@@ -24,6 +24,26 @@
                 </DataTemplate>
             </AutoCompleteBox.ItemTemplate>
         </AutoCompleteBox>
+        <AutoCompleteBox
+            Classes="Large"
+            Items="{Binding States}"
+            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
+        <AutoCompleteBox
+            Classes="Small"
+            Items="{Binding States}"
+            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Bordered"
             Items="{Binding States}"
diff --git a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
index 01203b5..05df1ea 100644
--- a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
@@ -12,6 +12,7 @@
                 <Panel>
                     <TextBox
                         Name="PART_TextBox"
+                        VerticalAlignment="Center"
                         DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                         Watermark="{TemplateBinding Watermark}" />
                     <Popup
@@ -46,6 +47,7 @@
                     <Panel>
                         <TextBox
                             Name="PART_TextBox"
+                            VerticalAlignment="Center"
                             Classes="Bordered"
                             DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                             Watermark="{TemplateBinding Watermark}" />
@@ -75,7 +77,15 @@
                 </ControlTemplate>
             </Setter>
         </Style>
+        <Style Selector="^.Large /template/ TextBox">
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource AutoCompleteBoxLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small /template/ TextBox">
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource AutoCompleteBoxSmallHeight}" />
+        </Style>
     </ControlTheme>
 
 
+
+
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
index ad05cb1..dc0fb9e 100644
--- a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
@@ -6,4 +6,7 @@
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">30</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">22</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">38</x:Double>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/TextBox.axaml b/src/Semi.Avalonia/Themes/Light/TextBox.axaml
index f073ca8..4844c52 100644
--- a/src/Semi.Avalonia/Themes/Light/TextBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/TextBox.axaml
@@ -1,7 +1,4 @@
-<ResourceDictionary
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:sys="clr-namespace:System;assembly=System.Runtime">
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="Black" />
 
     <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
@@ -27,12 +24,12 @@
     <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
     <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
 
-    <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
-    <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>
-    <sys:Double x:Key="TextBoxLargeHeight">38</sys:Double>
-    <sys:Double x:Key="TextBoxWrapperDefaultHeight">32</sys:Double>
-    <sys:Double x:Key="TextBoxWrapperSmallHeight">24</sys:Double>
-    <sys:Double x:Key="TextBoxWrapperLargeHeight">40</sys:Double>
+    <x:Double x:Key="TextBoxDefaultHeight">30</x:Double>
+    <x:Double x:Key="TextBoxSmallHeight">22</x:Double>
+    <x:Double x:Key="TextBoxLargeHeight">38</x:Double>
+    <x:Double x:Key="TextBoxWrapperDefaultHeight">32</x:Double>
+    <x:Double x:Key="TextBoxWrapperSmallHeight">24</x:Double>
+    <x:Double x:Key="TextBoxWrapperLargeHeight">40</x:Double>
 
     <CornerRadius x:Key="TextBoxDefaultCornerRadius">3</CornerRadius>
 

From 1bfe7a6744fc393a110e6e208977d893d31bd508 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 16:28:08 +0800
Subject: [PATCH 04/13] fix: move dimensions to resource.

---
 src/Semi.Avalonia/Controls/AutoCompleteBox.axaml     | 2 +-
 src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml  | 4 ++++
 src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml | 1 +
 3 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
index 05df1ea..3f094c0 100644
--- a/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
@@ -6,7 +6,7 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
-        <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="600" />
+        <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="{DynamicResource AutoCompleteMaxDropdownHeight}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="AutoCompleteBox">
                 <Panel>
diff --git a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
index 194a05e..f958f57 100644
--- a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
@@ -6,4 +6,8 @@
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">30</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">22</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">38</x:Double>
+    <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
index dc0fb9e..f44ef66 100644
--- a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
@@ -9,4 +9,5 @@
     <x:Double x:Key="AutoCompleteBoxDefaultHeight">30</x:Double>
     <x:Double x:Key="AutoCompleteBoxSmallHeight">22</x:Double>
     <x:Double x:Key="AutoCompleteBoxLargeHeight">38</x:Double>
+    <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>

From 73e2ebc3165dc457b24a340537334dd1bf6af907 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 17:18:05 +0800
Subject: [PATCH 05/13] feat: add CalendarDatePicker theme.

---
 .../Controls/CalendarDatePicker.axaml         | 36 ++++++++++++++++---
 src/Semi.Avalonia/Controls/TextBox.axaml      |  6 ++--
 .../Themes/Dark/AutoCompleteBox.axaml         |  6 ++--
 .../Themes/Dark/CalendarDatePicker.axaml      | 10 +++---
 .../Themes/Light/AutoCompleteBox.axaml        |  6 ++--
 .../Themes/Light/CalendarDatePicker.axaml     | 13 +++++--
 6 files changed, 56 insertions(+), 21 deletions(-)

diff --git a/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml b/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
index afdd762..20231fd 100644
--- a/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
@@ -31,7 +31,8 @@
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Padding" Value="4 0" />
+        <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerDefaultHeight}" />
+        <Setter Property="Padding" Value="8 0" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CalendarDatePicker">
                 <Panel
@@ -51,6 +52,7 @@
                             <TextBox
                                 Name="PART_TextBox"
                                 Grid.Column="0"
+                                MinHeight="{DynamicResource CalendarDatePickerInnerDefaultHeight}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Center"
                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
@@ -63,19 +65,25 @@
                                 UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
                                 Watermark="{TemplateBinding Watermark}">
                                 <TextBox.Styles>
-                                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
+                                    <Style Selector="TextBox#PART_TextBox:pointerover /template/ Border#PART_ContentPresenterBorder">
+                                        <!--  By default the TextBox has its own focused state, override this to disable it here  -->
+                                        <Setter Property="Background" Value="Transparent" />
+                                        <Setter Property="BorderBrush" Value="Transparent" />
+                                        <Setter Property="BorderThickness" Value="0" />
+                                    </Style>
+                                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_ContentPresenterBorder">
                                         <!--  By default the TextBox has its own focused state, override this to disable it here  -->
                                         <Setter Property="Background" Value="Transparent" />
                                         <Setter Property="BorderBrush" Value="Transparent" />
                                         <Setter Property="BorderThickness" Value="0" />
                                     </Style>
                                     <Style Selector="TextBox#PART_TextBox:disabled">
-                                        <Style Selector="^ /template/ Border#PART_BorderElement">
+                                        <Style Selector="^ /template/ Border#PART_ContentPresenterBorder">
                                             <!--  By default the TextBox has its own disabled state, override this to make the border background show through  -->
                                             <Setter Property="Background" Value="Transparent" />
                                             <Setter Property="BorderBrush" Value="Transparent" />
                                         </Style>
-                                        <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
+                                        <Style Selector="^ /template/ TextBlock#PART_Watermark">
                                             <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
                                         </Style>
                                     </Style>
@@ -113,11 +121,29 @@
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^.Large">
+            <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerLargeHeight}" />
+            <Style Selector="^ /template/ TextBox#PART_TextBox">
+                <Setter Property="TextBox.MinHeight" Value="{DynamicResource CalendarDatePickerInnerLargeHeight}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerSmallHeight}" />
+            <Style Selector="^ /template/ TextBox#PART_TextBox">
+                <Setter Property="TextBox.MinHeight" Value="{DynamicResource CalendarDatePickerInnerSmallHeight}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:pointerover">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource CalendarDatePickerPointeroverBackground}" />
+            </Style>
+        </Style>
+
         <!--  Disabled State  -->
         <Style Selector="^:disabled">
             <Style Selector="^ /template/ Border#Background">
                 <Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerDisabledBorderBrush}" />
             </Style>
 
             <Style Selector="^ /template/ Button#PART_Button">
diff --git a/src/Semi.Avalonia/Controls/TextBox.axaml b/src/Semi.Avalonia/Controls/TextBox.axaml
index 4975ac4..15b90a9 100644
--- a/src/Semi.Avalonia/Controls/TextBox.axaml
+++ b/src/Semi.Avalonia/Controls/TextBox.axaml
@@ -93,7 +93,7 @@
         <Setter Property="TextBox.FontSize" Value="14" />
         <Setter Property="TextBox.Cursor" Value="IBeam" />
         <Setter Property="TextBox.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
-        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxDefaultHeight}" />
+        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperDefaultHeight}" />
         <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />
         <Setter Property="TextBox.VerticalContentAlignment" Value="Center" />
         <Setter Property="TextBox.FocusAdorner" Value="{x:Null}" />
@@ -207,10 +207,10 @@
             </Style>
         </Style>
         <Style Selector="^.Large">
-            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxLargeHeight}" />
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperLargeHeight}" />
         </Style>
         <Style Selector="^.Small">
-            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxSmallHeight}" />
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperSmallHeight}" />
         </Style>
 
         <Style Selector="^.Bordered">
diff --git a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
index f958f57..10f580e 100644
--- a/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
@@ -6,8 +6,8 @@
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
-    <x:Double x:Key="AutoCompleteBoxDefaultHeight">30</x:Double>
-    <x:Double x:Key="AutoCompleteBoxSmallHeight">22</x:Double>
-    <x:Double x:Key="AutoCompleteBoxLargeHeight">38</x:Double>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">24</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">40</x:Double>
     <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
index 8d816ba..3b9fad2 100644
--- a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
@@ -3,13 +3,15 @@
     <SolidColorBrush x:Key="CalendarDatePickerIconForeground" Opacity="0.62" Color="#F9F9F9" />
     <SolidColorBrush x:Key="CalendarDatePickerIconPointeroverForeground" Color="#F9F9F9" />
     <PathGeometry x:Key="CalendarDatePickerIconGlyph">M4 20V8H20V20H4ZM2 4C2 2.89543 2.89543 2 4 2H20C21.1046 2 22 2.89543 22 4V20C22 21.1046 21.1046 22 20 22H4C2.89543 22 2 21.1046 2 20V4ZM6 10.5C6 10.2239 6.22386 10 6.5 10H8.5C8.77614 10 9 10.2239 9 10.5V12.5C9 12.7761 8.77614 13 8.5 13H6.5C6.22386 13 6 12.7761 6 12.5V10.5ZM6.5 15C6.22386 15 6 15.2239 6 15.5V17.5C6 17.7761 6.22386 18 6.5 18H8.5C8.77614 18 9 17.7761 9 17.5V15.5C9 15.2239 8.77614 15 8.5 15H6.5ZM10.5 10.5C10.5 10.2239 10.7239 10 11 10H13C13.2761 10 13.5 10.2239 13.5 10.5V12.5C13.5 12.7761 13.2761 13 13 13H11C10.7239 13 10.5 12.7761 10.5 12.5V10.5ZM11 15C10.7239 15 10.5 15.2239 10.5 15.5V17.5C10.5 17.7761 10.7239 18 11 18H13C13.2761 18 13.5 17.7761 13.5 17.5V15.5C13.5 15.2239 13.2761 15 13 15H11ZM15 10.5C15 10.2239 15.2239 10 15.5 10H17.5C17.7761 10 18 10.2239 18 10.5V12.5C18 12.7761 17.7761 13 17.5 13H15.5C15.2239 13 15 12.7761 15 12.5V10.5ZM15.5 15C15.2239 15 15 15.2239 15 15.5V17.5C15 17.7761 15.2239 18 15.5 18H17.5C17.7761 18 18 17.7761 18 17.5V15.5C18 15.2239 17.7761 15 17.5 15H15.5Z</PathGeometry>
-    <SolidColorBrush x:Key="CalendarDatePickerBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="#41464C" />
+    <SolidColorBrush x:Key="CalendarDatePickerBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerPressedBackground" Opacity="0.2" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="Transparent" />
     <Thickness x:Key="CalendarDatePickerBorderThickness">1</Thickness>
     <CornerRadius x:Key="CalendarDatePickerCornerRadius">3</CornerRadius>
-    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledBackground" Color="#1C1F23" />
-    <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="#1C1F23" />
+    <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />
     <BoxShadows x:Key="CalendarDatePickerPopupBoxShadows">0 0 8 0 #1AFFFFFF</BoxShadows>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
index f44ef66..7c9823f 100644
--- a/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
@@ -6,8 +6,8 @@
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
-    <x:Double x:Key="AutoCompleteBoxDefaultHeight">30</x:Double>
-    <x:Double x:Key="AutoCompleteBoxSmallHeight">22</x:Double>
-    <x:Double x:Key="AutoCompleteBoxLargeHeight">38</x:Double>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">24</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">40</x:Double>
     <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml b/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
index e486791..18c9442 100644
--- a/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
@@ -3,13 +3,20 @@
     <SolidColorBrush x:Key="CalendarDatePickerIconForeground" Opacity="0.62" Color="#1C1F23" />
     <SolidColorBrush x:Key="CalendarDatePickerIconPointeroverForeground" Color="#1C1F23" />
     <PathGeometry x:Key="CalendarDatePickerIconGlyph">M4 20V8H20V20H4ZM2 4C2 2.89543 2.89543 2 4 2H20C21.1046 2 22 2.89543 22 4V20C22 21.1046 21.1046 22 20 22H4C2.89543 22 2 21.1046 2 20V4ZM6 10.5C6 10.2239 6.22386 10 6.5 10H8.5C8.77614 10 9 10.2239 9 10.5V12.5C9 12.7761 8.77614 13 8.5 13H6.5C6.22386 13 6 12.7761 6 12.5V10.5ZM6.5 15C6.22386 15 6 15.2239 6 15.5V17.5C6 17.7761 6.22386 18 6.5 18H8.5C8.77614 18 9 17.7761 9 17.5V15.5C9 15.2239 8.77614 15 8.5 15H6.5ZM10.5 10.5C10.5 10.2239 10.7239 10 11 10H13C13.2761 10 13.5 10.2239 13.5 10.5V12.5C13.5 12.7761 13.2761 13 13 13H11C10.7239 13 10.5 12.7761 10.5 12.5V10.5ZM11 15C10.7239 15 10.5 15.2239 10.5 15.5V17.5C10.5 17.7761 10.7239 18 11 18H13C13.2761 18 13.5 17.7761 13.5 17.5V15.5C13.5 15.2239 13.2761 15 13 15H11ZM15 10.5C15 10.2239 15.2239 10 15.5 10H17.5C17.7761 10 18 10.2239 18 10.5V12.5C18 12.7761 17.7761 13 17.5 13H15.5C15.2239 13 15 12.7761 15 12.5V10.5ZM15.5 15C15.2239 15 15 15.2239 15 15.5V17.5C15 17.7761 15.2239 18 15.5 18H17.5C17.7761 18 18 17.7761 18 17.5V15.5C18 15.2239 17.7761 15 17.5 15H15.5Z</PathGeometry>
-    <SolidColorBrush x:Key="CalendarDatePickerBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="#C6CACD" />
+    <SolidColorBrush x:Key="CalendarDatePickerBackground" Opacity="0.05" Color="#FF2E3238" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerPointeroverBackground" Opacity="0.09" Color="#FF2E3238" />
     <Thickness x:Key="CalendarDatePickerBorderThickness">1</Thickness>
     <CornerRadius x:Key="CalendarDatePickerCornerRadius">3</CornerRadius>
-    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#004FB3" />
+    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#FF0077FA" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledBackground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="#F9F9F9" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledIconForeground" Opacity="0.4" Color="#2E3238" />
     <BoxShadows x:Key="CalendarDatePickerPopupBoxShadows">0 0 8 0 #1A000000</BoxShadows>
+    <x:Double x:Key="CalendarDatePickerInnerDefaultHeight">30</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerSmallHeight">22</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerLargeHeight">38</x:Double>
+    <x:Double x:Key="CalendarDatePickerDefaultHeight">32</x:Double>
+    <x:Double x:Key="CalendarDatePickerSmallHeight">24</x:Double>
+    <x:Double x:Key="CalendarDatePickerLargeHeight">40</x:Double>
 </ResourceDictionary>

From 46efeebf7648c3818c05a76ed3e4e1b5babbf16c Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 17:19:45 +0800
Subject: [PATCH 06/13] feat: Add dimension to dark mode, add demo of
 dimension.

---
 demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml | 2 ++
 src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml     | 6 ++++++
 2 files changed, 8 insertions(+)

diff --git a/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
index 033d65e..7f4649d 100644
--- a/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
@@ -9,6 +9,8 @@
     mc:Ignorable="d">
     <StackPanel HorizontalAlignment="Left" Spacing="20">
         <CalendarDatePicker />
+        <CalendarDatePicker Classes="Large" />
+        <CalendarDatePicker Classes="Small" />
         <CalendarDatePicker
             Name="DatePicker2"
             Margin="0,0,0,8"
diff --git a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
index 3b9fad2..01a741d 100644
--- a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
@@ -14,4 +14,10 @@
     <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />
     <BoxShadows x:Key="CalendarDatePickerPopupBoxShadows">0 0 8 0 #1AFFFFFF</BoxShadows>
+    <x:Double x:Key="CalendarDatePickerInnerDefaultHeight">30</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerSmallHeight">22</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerLargeHeight">38</x:Double>
+    <x:Double x:Key="CalendarDatePickerDefaultHeight">32</x:Double>
+    <x:Double x:Key="CalendarDatePickerSmallHeight">24</x:Double>
+    <x:Double x:Key="CalendarDatePickerLargeHeight">40</x:Double>
 </ResourceDictionary>

From 07debbb6f41b5fed7c525f8628f993045c7a9429 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 15 Feb 2023 17:38:31 +0800
Subject: [PATCH 07/13] feat: Add bordered style for calendar datepicker.

---
 .../Pages/AutoCompleteBoxDemo.axaml           |  8 ++++--
 .../Pages/CalendarDatePickerDemo.axaml        |  2 ++
 .../Controls/CalendarDatePicker.axaml         | 25 +++++++++++++++++++
 .../Themes/Dark/CalendarDatePicker.axaml      |  5 ++++
 .../Themes/Light/CalendarDatePicker.axaml     |  5 ++++
 5 files changed, 43 insertions(+), 2 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
index 277a486..9e672d3 100644
--- a/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
@@ -17,7 +17,10 @@
                 <Setter Property="Width" Value="300" />
             </Style>
         </StackPanel.Styles>
-        <AutoCompleteBox Items="{Binding States}" ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+        <AutoCompleteBox
+            Items="{Binding States}"
+            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}"
+            Watermark="Please select a State">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
                     <TextBlock Text="{Binding Name}" />
@@ -57,7 +60,8 @@
         <AutoCompleteBox
             IsEnabled="False"
             Items="{Binding States}"
-            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}"
+            Watermark="Disabled">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
                     <TextBlock Text="{Binding Name}" />
diff --git a/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
index 7f4649d..ca8b258 100644
--- a/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/CalendarDatePickerDemo.axaml
@@ -23,5 +23,7 @@
         <CalendarDatePicker Margin="0,0,0,8" Watermark="Watermark" />
 
         <CalendarDatePicker IsEnabled="False" />
+        <CalendarDatePicker Classes="Bordered" />
+        <CalendarDatePicker Classes="Bordered" IsEnabled="False" />
     </StackPanel>
 </UserControl>
diff --git a/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml b/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
index 20231fd..f20511f 100644
--- a/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Controls/CalendarDatePicker.axaml
@@ -159,5 +159,30 @@
         <Style Selector="^:focus-within /template/ Border#Background">
             <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerFocusBorderBrush}" />
         </Style>
+
+        <Style Selector="^.Bordered">
+            <Style Selector="^ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedDefaultBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedDefaultBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:focus-within /template/ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#Background">
+                    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
+                    <Setter Property="Border.BorderBrush" Value="Transparent" />
+                </Style>
+
+                <Style Selector="^ /template/ Button#PART_Button">
+                    <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerDisabledIconForeground}" />
+                </Style>
+            </Style>
+        </Style>
     </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
index 01a741d..cb5a659 100644
--- a/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml
@@ -20,4 +20,9 @@
     <x:Double x:Key="CalendarDatePickerDefaultHeight">32</x:Double>
     <x:Double x:Key="CalendarDatePickerSmallHeight">24</x:Double>
     <x:Double x:Key="CalendarDatePickerLargeHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBorderBrush" Color="#0062D6" />
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml b/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
index 18c9442..a8ca466 100644
--- a/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
+++ b/src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml
@@ -19,4 +19,9 @@
     <x:Double x:Key="CalendarDatePickerDefaultHeight">32</x:Double>
     <x:Double x:Key="CalendarDatePickerSmallHeight">24</x:Double>
     <x:Double x:Key="CalendarDatePickerLargeHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBorderBrush" Opacity="0.08" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBorderBrush" Color="#0062D6" />
 </ResourceDictionary>

From 068f1e36cc932227e921dde70945924ef4b294e7 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Thu, 16 Feb 2023 02:01:17 +0800
Subject: [PATCH 08/13] feat: update ComboBox demo.

---
 .../Pages/ComboBoxDemo.axaml                  | 26 +++++++++
 src/Semi.Avalonia/Controls/ComboBox.axaml     | 53 ++++++++++++++++---
 src/Semi.Avalonia/Themes/Dark/ComboBox.axaml  | 11 ++++
 src/Semi.Avalonia/Themes/Dark/TextBox.axaml   |  2 +-
 src/Semi.Avalonia/Themes/Light/ComboBox.axaml | 11 ++++
 5 files changed, 95 insertions(+), 8 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
index df5a595..c73cc17 100644
--- a/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
@@ -23,5 +23,31 @@
             <ComboBoxItem>BBB</ComboBoxItem>
             <ComboBoxItem>CCC</ComboBoxItem>
         </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Large"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Small">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Bordered">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Bordered"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
     </StackPanel>
 </UserControl>
diff --git a/src/Semi.Avalonia/Controls/ComboBox.axaml b/src/Semi.Avalonia/Controls/ComboBox.axaml
index 9f0b934..c6019fb 100644
--- a/src/Semi.Avalonia/Controls/ComboBox.axaml
+++ b/src/Semi.Avalonia/Controls/ComboBox.axaml
@@ -35,7 +35,7 @@
         <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
         <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
         <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-        <Setter Property="MinHeight" Value="30" />
+        <Setter Property="MinHeight" Value="{DynamicResource ComboBoxDefaultHeight}" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="HorizontalAlignment" Value="Left" />
@@ -115,6 +115,7 @@
                             BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
                             BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
                             BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
+                            ClipToBounds="True"
                             CornerRadius="6">
                             <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
                                 <ItemsPresenter
@@ -128,6 +129,13 @@
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^.Large">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" />
+        </Style>
+
         <!--  PointerOver State  -->
         <Style Selector="^:pointerover">
             <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorPointerOverBackground}" />
@@ -163,6 +171,35 @@
                 <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
             </Style>
         </Style>
+        <Style Selector="^.Bordered">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPressedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#Background">
+                    <Setter Property="Border.Background" Value="{DynamicResource ComboBoxSelectorDisabledBackground}" />
+                    <Setter Property="Border.BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentControl#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
@@ -187,24 +224,26 @@
             </ControlTemplate>
         </Setter>
 
-        <Style Selector="^:pointerover">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPointerOverBackground}" />
         </Style>
 
-        <Style Selector="^:disabled">
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemDisabledBackground}" />
         </Style>
 
-        <Style Selector="^:pressed">
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPressedBackground}" />
         </Style>
 
         <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
-            <Style Selector="^:disabled">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
+            </Style>
+            <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedDisabledBackground}" />
             </Style>
-            <Style Selector="^:pointerover">
+            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedPointerOverBackground}" />
             </Style>
         </Style>
diff --git a/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml b/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
index b7f63ae..e0b90f4 100644
--- a/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
@@ -37,4 +37,15 @@
     <PathGeometry x:Key="ComboBoxIcon">
         M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z
     </PathGeometry>
+
+    <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="ComboBoxLargeHeight">24</x:Double>
+    <x:Double x:Key="ComboBoxSmallHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBorderBrush" Color="#7FC1FF" />
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
index 6d7c503..ee51c09 100644
--- a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
@@ -25,7 +25,7 @@
     <SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#7FC1FF" />
 
     <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
     <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>
diff --git a/src/Semi.Avalonia/Themes/Light/ComboBox.axaml b/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
index 8f50dac..bd82b4b 100644
--- a/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
@@ -37,4 +37,15 @@
     <PathGeometry x:Key="ComboBoxIcon">
         M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z
     </PathGeometry>
+
+    <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="ComboBoxLargeHeight">24</x:Double>
+    <x:Double x:Key="ComboBoxSmallHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBorderBrush" Opacity="0.08" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBorderBrush" Color="#0062D6" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBorderBrush" Color="#0062D6" />
 </ResourceDictionary>

From 4e5a6c327dfc2996a24ba59a515e94dcc49b1d16 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Thu, 16 Feb 2023 23:58:55 +0800
Subject: [PATCH 09/13] feat: DateTime picker theme.

---
 src/Semi.Avalonia/Controls/DatePicker.axaml               | 5 +++--
 src/Semi.Avalonia/Controls/DateTimePickerShared.axaml     | 3 ++-
 src/Semi.Avalonia/Controls/TimePicker.axaml               | 7 +++++--
 src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml | 8 ++++----
 4 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/Semi.Avalonia/Controls/DatePicker.axaml b/src/Semi.Avalonia/Controls/DatePicker.axaml
index e170212..c74cd20 100644
--- a/src/Semi.Avalonia/Controls/DatePicker.axaml
+++ b/src/Semi.Avalonia/Controls/DatePicker.axaml
@@ -125,7 +125,7 @@
 
     <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
         <Setter Property="FontSize" Value="14" />
-        <Setter Property="Height" Value="30" />
+        <Setter Property="Height" Value="32" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
@@ -141,7 +141,7 @@
                         Width="298"
                         MinWidth="298"
                         HorizontalAlignment="Stretch"
-                        VerticalAlignment="Top"
+                        VerticalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
@@ -154,6 +154,7 @@
                             <Grid
                                 Name="PART_ButtonContentGrid"
                                 Grid.Column="0"
+                                VerticalAlignment="Center"
                                 ColumnDefinitions="78*,Auto,132*,Auto,78*">
                                 <TextBlock
                                     Name="PART_DayTextBlock"
diff --git a/src/Semi.Avalonia/Controls/DateTimePickerShared.axaml b/src/Semi.Avalonia/Controls/DateTimePickerShared.axaml
index 3cbb0d4..75119ba 100644
--- a/src/Semi.Avalonia/Controls/DateTimePickerShared.axaml
+++ b/src/Semi.Avalonia/Controls/DateTimePickerShared.axaml
@@ -3,6 +3,7 @@
 
     <ControlTheme x:Key="DateTimePickerFlyoutButton" TargetType="Button">
         <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="Button.VerticalAlignment" Value="Stretch" />
         <Setter Property="Template">
             <ControlTemplate>
                 <ContentPresenter
@@ -19,7 +20,7 @@
         </Setter>
 
         <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonPointeroverBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonPointeroverBackground}" />
         </Style>
 
         <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
diff --git a/src/Semi.Avalonia/Controls/TimePicker.axaml b/src/Semi.Avalonia/Controls/TimePicker.axaml
index 811100a..3ed461a 100644
--- a/src/Semi.Avalonia/Controls/TimePicker.axaml
+++ b/src/Semi.Avalonia/Controls/TimePicker.axaml
@@ -128,7 +128,7 @@
 
     <ControlTheme x:Key="{x:Type TimePicker}" TargetType="TimePicker">
         <Setter Property="FontSize" Value="14" />
-        <Setter Property="Height" Value="30" />
+        <Setter Property="Height" Value="32" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
@@ -144,7 +144,7 @@
                         Width="242"
                         MinWidth="242"
                         HorizontalAlignment="Stretch"
-                        VerticalAlignment="Top"
+                        VerticalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
@@ -165,6 +165,7 @@
                                         x:Name="PART_HourTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
@@ -187,6 +188,7 @@
                                         x:Name="PART_MinuteTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
@@ -209,6 +211,7 @@
                                         x:Name="PART_PeriodTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
diff --git a/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml b/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
index 4b4c9b0..a337d88 100644
--- a/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
+++ b/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
@@ -23,15 +23,15 @@
     <sys:Double x:Key="DateTimePickerListBoxItemHeight">28</sys:Double>
 
 
-    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="#C6CACD" />
-    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Opacity="0.05" Color="#FF2E3238" />
     <SolidColorBrush x:Key="DateTimePickerButtonForeground" Color="#1C1F23" />
 
     <SolidColorBrush x:Key="DateTimePickerIconForeground" Opacity="0.62" Color="#1C1F23" />
     <SolidColorBrush x:Key="DateTimePickerEmptyForeground" Opacity="0.5" Color="#1C1F23" />
 
-    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBorderBrush" Color="#0062D6" />
-    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBackground" Opacity="0.09" Color="#FF2E3238" />
+    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledBackground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledIconForeground" Opacity="0.4" Color="#2E3238" />
 

From 7b16b5a36a7cf70ff08ce16a680266b94131e6b5 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Fri, 17 Feb 2023 00:14:41 +0800
Subject: [PATCH 10/13] misc: improve menu demo.

---
 demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml
index 52d3b0d..eaf4adf 100644
--- a/demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml
@@ -73,7 +73,7 @@
                 <MenuItem Header="Child 19" />
             </MenuItem>
         </Menu>
-        <Border>
+        <Border Theme="{DynamicResource CardBorder}">
             <Border.ContextMenu>
                 <ContextMenu>
                     <MenuItem Header="Standard _Menu Item" InputGesture="Ctrl+A" />
@@ -100,7 +100,7 @@
             </Border.ContextMenu>
             <TextBlock Text="Right Click to show Context Menu" />
         </Border>
-        <Border>
+        <Border Theme="{DynamicResource CardBorder}">
             <Border.ContextFlyout>
                 <MenuFlyout>
                     <MenuItem Header="Standard _Menu Item" InputGesture="Ctrl+A" />

From df217f3c8258d977177a43234b74bc9b6466a0fe Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Fri, 17 Feb 2023 00:20:22 +0800
Subject: [PATCH 11/13] fix: fix date time picker dark mode.

---
 src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml b/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
index c7d40b7..fb1d27b 100644
--- a/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
@@ -23,14 +23,14 @@
     <sys:Double x:Key="DateTimePickerListBoxItemHeight">28</sys:Double>
 
 
-    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="#41464C" />
-    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="DateTimePickerButtonForeground" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="DateTimePickerIconForeground" Opacity="0.62" Color="#F9F9F9" />
     <SolidColorBrush x:Key="DateTimePickerEmptyForeground" Opacity="0.5" Color="#F9F9F9" />
 
-    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="#1C1F23" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledBackground" Color="#1C1F23" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />

From 6e5512e42943cd5e5f84c36daa9406304d57e620 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Fri, 17 Feb 2023 00:31:31 +0800
Subject: [PATCH 12/13] feat: Add Size to date and time picker.

---
 demo/Semi.Avalonia.Demo/Pages/DatePickerDemo.axaml  |  2 ++
 demo/Semi.Avalonia.Demo/Pages/TimePickerDemo.axaml  |  2 ++
 src/Semi.Avalonia/Controls/DatePicker.axaml         | 13 +++++++++----
 src/Semi.Avalonia/Controls/TimePicker.axaml         | 10 ++++++++--
 .../Themes/Dark/DateTimePickerShared.axaml          |  7 +++++++
 .../Themes/Light/DateTimePickerShared.axaml         |  6 ++++++
 6 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/DatePickerDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/DatePickerDemo.axaml
index 90e3b0f..2c0e9e9 100644
--- a/demo/Semi.Avalonia.Demo/Pages/DatePickerDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/DatePickerDemo.axaml
@@ -11,5 +11,7 @@
         <DatePicker />
         <DatePicker DayFormat="d (ddd)" YearVisible="False" />
         <DatePicker IsEnabled="False" />
+        <DatePicker Classes="Large" />
+        <DatePicker Classes="Small" />
     </StackPanel>
 </UserControl>
diff --git a/demo/Semi.Avalonia.Demo/Pages/TimePickerDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/TimePickerDemo.axaml
index 42baa9a..c58465c 100644
--- a/demo/Semi.Avalonia.Demo/Pages/TimePickerDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/TimePickerDemo.axaml
@@ -12,5 +12,7 @@
         <TimePicker MinuteIncrement="15" />
         <TimePicker ClockIdentifier="24HourClock" />
         <TimePicker ClockIdentifier="12HourClock" IsEnabled="False" />
+        <TimePicker Classes="Large" />
+        <TimePicker Classes="Small" />
     </StackPanel>
 </UserControl>
diff --git a/src/Semi.Avalonia/Controls/DatePicker.axaml b/src/Semi.Avalonia/Controls/DatePicker.axaml
index c74cd20..0997b81 100644
--- a/src/Semi.Avalonia/Controls/DatePicker.axaml
+++ b/src/Semi.Avalonia/Controls/DatePicker.axaml
@@ -124,13 +124,12 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
-        <Setter Property="FontSize" Value="14" />
-        <Setter Property="Height" Value="32" />
+        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
-        <Setter Property="BorderThickness" Value="1" />
-        <Setter Property="CornerRadius" Value="3" />
+        <Setter Property="BorderThickness" Value="{DynamicResource DateTimePickerButtonBorderThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource DateTimePickerButtonCornerRadius}" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="Template">
@@ -230,6 +229,12 @@
         <Style Selector="^:hasnodate /template/ Button#PART_FlyoutButton TextBlock">
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
+        </Style>
     </ControlTheme>
 
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Controls/TimePicker.axaml b/src/Semi.Avalonia/Controls/TimePicker.axaml
index 3ed461a..e0d2d98 100644
--- a/src/Semi.Avalonia/Controls/TimePicker.axaml
+++ b/src/Semi.Avalonia/Controls/TimePicker.axaml
@@ -127,8 +127,7 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type TimePicker}" TargetType="TimePicker">
-        <Setter Property="FontSize" Value="14" />
-        <Setter Property="Height" Value="32" />
+        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
@@ -248,5 +247,12 @@
         <Style Selector="^:hasnotime /template/ Button#PART_FlyoutButton TextBlock">
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
+
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
+        </Style>
     </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml b/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
index fb1d27b..95a582a 100644
--- a/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml
@@ -39,4 +39,11 @@
     <Thickness x:Key="DateTimePickerFlyoutPadding">16 0</Thickness>
     <Thickness x:Key="DateTimePickerFlyoutBorderMargin">8</Thickness>
 
+    <x:Double x:Key="DateTimePickerButtonSmallHeight">24</x:Double>
+    <x:Double x:Key="DateTimePickerButtonDefaultHeight">32</x:Double>
+    <x:Double x:Key="DateTimePickerButtonLargeHeight">40</x:Double>
+
+    <Thickness x:Key="DateTimePickerButtonBorderThickness">1</Thickness>
+    <CornerRadius x:Key="DateTimePickerButtonCornerRadius">3</CornerRadius>
+
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml b/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
index a337d88..cf90300 100644
--- a/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
+++ b/src/Semi.Avalonia/Themes/Light/DateTimePickerShared.axaml
@@ -39,4 +39,10 @@
     <Thickness x:Key="DateTimePickerFlyoutPadding">16 0</Thickness>
     <Thickness x:Key="DateTimePickerFlyoutBorderMargin">8</Thickness>
 
+    <x:Double x:Key="DateTimePickerButtonSmallHeight">24</x:Double>
+    <x:Double x:Key="DateTimePickerButtonDefaultHeight">32</x:Double>
+    <x:Double x:Key="DateTimePickerButtonLargeHeight">40</x:Double>
+
+    <Thickness x:Key="DateTimePickerButtonBorderThickness">1</Thickness>
+    <CornerRadius x:Key="DateTimePickerButtonCornerRadius">3</CornerRadius>
 </ResourceDictionary>

From 24248f7d04249f72ab62959c17ee422b978ba51d Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Fri, 17 Feb 2023 14:23:01 +0800
Subject: [PATCH 13/13] fix: temporary fix a demo issue.

---
 demo/Semi.Avalonia.Demo/Pages/SplitViewDemo.axaml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/SplitViewDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/SplitViewDemo.axaml
index c8f65e3..38a6db3 100644
--- a/demo/Semi.Avalonia.Demo/Pages/SplitViewDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/SplitViewDemo.axaml
@@ -25,7 +25,6 @@
 
                 <ToggleSwitch
                     Content="Placement"
-                    IsChecked="{Binding !IsLeft}"
                     OffContent="Left"
                     OnContent="Right" />