From 38b9494aaf7a9dec268840e6524a62c0ad64af9f Mon Sep 17 00:00:00 2001
From: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
Date: Wed, 14 Aug 2024 18:18:32 +0800
Subject: [PATCH 1/4] feat: enhance NotificationCard.

---
 .../Controls/NotificationCard.axaml           | 114 ++++++++++--------
 .../Themes/Dark/NotificationCard.axaml        |   3 +-
 .../Themes/Light/NotificationCard.axaml       |   3 +-
 .../Themes/Shared/NotificationCard.axaml      |  23 +++-
 4 files changed, 84 insertions(+), 59 deletions(-)

diff --git a/src/Semi.Avalonia/Controls/NotificationCard.axaml b/src/Semi.Avalonia/Controls/NotificationCard.axaml
index 221af99..1d3cfa4 100644
--- a/src/Semi.Avalonia/Controls/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Controls/NotificationCard.axaml
@@ -3,15 +3,26 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
     <Design.PreviewWith>
-        <NotificationCard>
-            <TextBlock Text="Hello World" />
-        </NotificationCard>
+        <ThemeVariantScope RequestedThemeVariant="Dark">
+            <StackPanel>
+                <NotificationCard>
+                    Hello, Semi.Avalonia!
+                </NotificationCard>
+                <NotificationCard NotificationType="Success">
+                    <Notification Title="Welcome" Message="Hello, Semi.Avalonia!" />
+                </NotificationCard>
+                <NotificationCard NotificationType="Warning">
+                    <Notification Title="" Message="Hello, Semi.Avalonia!" />
+                </NotificationCard>
+                <NotificationCard NotificationType="Error">
+                    <Notification Message="Hello, Semi.Avalonia!" />
+                </NotificationCard>
+            </StackPanel>
+        </ThemeVariantScope>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type NotificationCard}" TargetType="NotificationCard">
         <Setter Property="UseLayoutRounding" Value="True" />
-        <Setter Property="MinWidth" Value="{DynamicResource NotificationCardWidth}" />
-        <Setter Property="FontSize" Value="14" />
-        <Setter Property="Foreground" Value="{DynamicResource NotificationCardForeground}" />
+        <Setter Property="MinWidth" Value="{DynamicResource NotificationCardMinWidth}" />
         <Setter Property="RenderTransformOrigin" Value="50%,75%" />
         <Setter Property="BorderThickness" Value="{DynamicResource NotificationCardBorderThickness}" />
         <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardBorderBrush}" />
@@ -21,54 +32,53 @@
             <ControlTemplate TargetType="NotificationCard">
                 <LayoutTransformControl Name="PART_LayoutTransformControl" UseRenderTransform="True">
                     <Border
-                        Margin="8"
+                        Margin="{DynamicResource NotificationCardMargin}"
+                        Padding="{DynamicResource NotificationCardPadding}"
                         BoxShadow="{DynamicResource NotificationCardBoxShadows}"
+                        Background="{TemplateBinding Background}"
+                        BorderBrush="{TemplateBinding BorderBrush}"
+                        BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding CornerRadius}">
-                        <Border
-                            Background="{TemplateBinding Background}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            ClipToBounds="True"
-                            CornerRadius="{TemplateBinding CornerRadius}">
-                            <DockPanel>
-                                <PathIcon
-                                    Name="NotificationIcon"
-                                    Width="16"
-                                    Height="16"
-                                    Margin="16,16,12,0"
-                                    VerticalAlignment="Top"
-                                    IsVisible="False"
-                                    Data="{DynamicResource NotificationCardInformationIconPathData}"/>
-                                <ContentControl
-                                    Name="PART_Content"
-                                    MinHeight="64"
-                                    Content="{TemplateBinding Content}">
-                                    <ContentControl.DataTemplates>
-                                        <DataTemplate DataType="INotification">
-                                            <StackPanel Margin="0,8,8,8" Spacing="8">
-                                                <TextBlock
-                                                    FontSize="16"
-                                                    FontWeight="600"
-                                                    Text="{Binding Title}" />
-                                                <TextBlock
-                                                    MaxHeight="80"
-                                                    Margin="0,0,8,0"
-                                                    FontSize="14"
-                                                    FontWeight="400"
-                                                    Text="{Binding Message}"
-                                                    TextWrapping="Wrap" />
-                                            </StackPanel>
-                                        </DataTemplate>
-                                        <DataTemplate DataType="x:String">
-                                            <TextBlock
-                                                Margin="12"
-                                                Text="{Binding}"
+                        <DockPanel>
+                            <PathIcon
+                                Name="NotificationIcon"
+                                Width="{DynamicResource NotificationCardIconWidth}"
+                                Height="{DynamicResource NotificationCardIconHeight}"
+                                Margin="{DynamicResource NotificationCardIconMargin}"
+                                VerticalAlignment="Top"
+                                IsVisible="False"
+                                Data="{DynamicResource NotificationCardInformationIconPathData}" />
+                            <ContentControl
+                                Name="PART_Content"
+                                Content="{TemplateBinding Content}">
+                                <ContentControl.DataTemplates>
+                                    <DataTemplate DataType="INotification">
+                                        <StackPanel Spacing="{DynamicResource NotificationCardTitleSpacing}">
+                                            <SelectableTextBlock
+                                                Foreground="{DynamicResource NotificationCardTitleForeground}"
+                                                FontSize="{DynamicResource NotificationCardTitleFontSize}"
+                                                FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
+                                                IsVisible="{Binding Title, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                                Text="{Binding Title}" />
+                                            <SelectableTextBlock
+                                                Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                                FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                                FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
+                                                Text="{Binding Message}"
                                                 TextWrapping="Wrap" />
-                                        </DataTemplate>
-                                    </ContentControl.DataTemplates>
-                                </ContentControl>
-                            </DockPanel>
-                        </Border>
+                                        </StackPanel>
+                                    </DataTemplate>
+                                    <DataTemplate DataType="x:String">
+                                        <SelectableTextBlock
+                                            Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                            FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                            FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
+                                            Text="{Binding}"
+                                            TextWrapping="Wrap" />
+                                    </DataTemplate>
+                                </ContentControl.DataTemplates>
+                            </ContentControl>
+                        </DockPanel>
                     </Border>
                 </LayoutTransformControl>
             </ControlTemplate>
@@ -154,4 +164,4 @@
             <Setter Property="Data" Value="{DynamicResource NotificationCardErrorIconPathData}" />
         </Style>
     </ControlTheme>
-</ResourceDictionary>
+</ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
index 03c9d2a..dc17611 100644
--- a/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
@@ -1,5 +1,4 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="NotificationCardForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="NotificationCardBorderBrush" Opacity="0.08" Color="White" />
     <SolidColorBrush x:Key="NotificationCardBackground" Color="#43444A" />
     <SolidColorBrush x:Key="NotificationCardInformationIconForeground" Color="#54A9FF" />
@@ -7,4 +6,6 @@
     <SolidColorBrush x:Key="NotificationCardWarningIconForeground" Color="#FFAE43" />
     <SolidColorBrush x:Key="NotificationCardErrorIconForeground" Color="#FC725A" />
     <BoxShadows x:Key="NotificationCardBoxShadows">0 0 8 0 #1AFFFFFF</BoxShadows>
+    <SolidColorBrush x:Key="NotificationCardTitleForeground" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="NotificationCardMessageForeground" Opacity="0.8" Color="#F9F9F9" />
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
index 2f0f914..4541075 100644
--- a/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
@@ -1,5 +1,4 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="NotificationCardForeground" Color="#1C1F23" />
     <SolidColorBrush x:Key="NotificationCardBorderBrush" Opacity="0.08" Color="#1C1F23" />
     <SolidColorBrush x:Key="NotificationCardBackground" Color="White" />
     <SolidColorBrush x:Key="NotificationCardInformationIconForeground" Color="#0077FA" />
@@ -7,4 +6,6 @@
     <SolidColorBrush x:Key="NotificationCardWarningIconForeground" Color="#FC8800" />
     <SolidColorBrush x:Key="NotificationCardErrorIconForeground" Color="#F93920" />
     <BoxShadows x:Key="NotificationCardBoxShadows">0 0 8 0 #1A000000</BoxShadows>
+    <SolidColorBrush x:Key="NotificationCardTitleForeground" Color="#1C1F23" />
+    <SolidColorBrush x:Key="NotificationCardMessageForeground" Opacity="0.8" Color="#1C1F23" />
 </ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
index 41c7039..4e5476c 100644
--- a/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
@@ -1,9 +1,22 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <x:Double x:Key="NotificationCardWidth">320</x:Double>
+    <x:Double x:Key="NotificationCardMinWidth">320</x:Double>
     <Thickness x:Key="NotificationCardBorderThickness">1</Thickness>
     <CornerRadius x:Key="NotificationCardCornerRadius">6</CornerRadius>
-    <Geometry x:Key="NotificationCardInformationIconPathData">M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM14 7C14 8.10457 13.1046 9 12 9C10.8954 9 10 8.10457 10 7C10 5.89543 10.8954 5 12 5C13.1046 5 14 5.89543 14 7ZM9 10.75C9 10.3358 9.33579 10 9.75 10H12.5C13.0523 10 13.5 10.4477 13.5 11V16.5H14.25C14.6642 16.5 15 16.8358 15 17.25C15 17.6642 14.6642 18 14.25 18H9.75C9.33579 18 9 17.6642 9 17.25C9 16.8358 9.33579 16.5 9.75 16.5H10.5V11.5H9.75C9.33579 11.5 9 11.1642 9 10.75Z</Geometry>
-    <Geometry x:Key="NotificationCardSuccessIconPathData">M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17.8831 9.82235L11.6854 17.4112C11.4029 17.7806 10.965 17.9981 10.5 18C10.035 18.0019 9.59533 17.788 9.30982 17.421L5.81604 13.4209C5.30744 12.767 5.42524 11.8246 6.07916 11.316C6.73308 10.8074 7.67549 10.9252 8.1841 11.5791L10.4838 14.0439L15.5 8C16.0032 7.34193 16.9446 7.21641 17.6027 7.71964C18.2608 8.22287 18.3863 9.16428 17.8831 9.82235Z</Geometry>
-    <Geometry x:Key="NotificationCardWarningIconPathData">M10.2268 2.3986L1.52616 19.0749C0.831449 20.4064 1.79747 22 3.29933 22H20.7007C22.2025 22 23.1686 20.4064 22.4739 19.0749L13.7732 2.3986C13.0254 0.965441 10.9746 0.965442 10.2268 2.3986ZM13.1415 14.0101C13.0603 14.5781 12.5739 15 12.0001 15C11.4263 15 10.9398 14.5781 10.8586 14.0101L10.2829 9.97992C10.1336 8.93495 10.9445 8.00002 12.0001 8.00002C13.0556 8.00002 13.8665 8.93495 13.7172 9.97992L13.1415 14.0101ZM13.5001 18.5C13.5001 19.3284 12.8285 20 12.0001 20C11.1716 20 10.5001 19.3284 10.5001 18.5C10.5001 17.6716 11.1716 17 12.0001 17C12.8285 17 13.5001 17.6716 13.5001 18.5Z</Geometry>
-    <Geometry x:Key="NotificationCardErrorIconPathData">M23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12ZM13.5 17.5C13.5 16.6716 12.8284 16 12 16C11.1716 16 10.5 16.6716 10.5 17.5C10.5 18.3284 11.1716 19 12 19C12.8284 19 13.5 18.3284 13.5 17.5ZM12 5C10.9138 5 10.0507 5.91244 10.1109 6.99692L10.4168 12.5023C10.4635 13.3426 11.1584 14 12 14C12.8416 14 13.5365 13.3426 13.5832 12.5023L13.8891 6.99692C13.9493 5.91244 13.0862 5 12 5Z</Geometry>
+    <Thickness x:Key="NotificationCardMargin">8</Thickness>
+    <Thickness x:Key="NotificationCardPadding">16 12</Thickness>
+
+    <x:Double x:Key="NotificationCardIconWidth">18</x:Double>
+    <x:Double x:Key="NotificationCardIconHeight">18</x:Double>
+    <Thickness x:Key="NotificationCardIconMargin">0 0 12 0</Thickness>
+    <StreamGeometry x:Key="NotificationCardInformationIconPathData">M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM14 7C14 8.10457 13.1046 9 12 9C10.8954 9 10 8.10457 10 7C10 5.89543 10.8954 5 12 5C13.1046 5 14 5.89543 14 7ZM9 10.75C9 10.3358 9.33579 10 9.75 10H12.5C13.0523 10 13.5 10.4477 13.5 11V16.5H14.25C14.6642 16.5 15 16.8358 15 17.25C15 17.6642 14.6642 18 14.25 18H9.75C9.33579 18 9 17.6642 9 17.25C9 16.8358 9.33579 16.5 9.75 16.5H10.5V11.5H9.75C9.33579 11.5 9 11.1642 9 10.75Z</StreamGeometry>
+    <StreamGeometry x:Key="NotificationCardSuccessIconPathData">M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17.8831 9.82235L11.6854 17.4112C11.4029 17.7806 10.965 17.9981 10.5 18C10.035 18.0019 9.59533 17.788 9.30982 17.421L5.81604 13.4209C5.30744 12.767 5.42524 11.8246 6.07916 11.316C6.73308 10.8074 7.67549 10.9252 8.1841 11.5791L10.4838 14.0439L15.5 8C16.0032 7.34193 16.9446 7.21641 17.6027 7.71964C18.2608 8.22287 18.3863 9.16428 17.8831 9.82235Z</StreamGeometry>
+    <StreamGeometry x:Key="NotificationCardWarningIconPathData">M10.2268 2.3986L1.52616 19.0749C0.831449 20.4064 1.79747 22 3.29933 22H20.7007C22.2025 22 23.1686 20.4064 22.4739 19.0749L13.7732 2.3986C13.0254 0.965441 10.9746 0.965442 10.2268 2.3986ZM13.1415 14.0101C13.0603 14.5781 12.5739 15 12.0001 15C11.4263 15 10.9398 14.5781 10.8586 14.0101L10.2829 9.97992C10.1336 8.93495 10.9445 8.00002 12.0001 8.00002C13.0556 8.00002 13.8665 8.93495 13.7172 9.97992L13.1415 14.0101ZM13.5001 18.5C13.5001 19.3284 12.8285 20 12.0001 20C11.1716 20 10.5001 19.3284 10.5001 18.5C10.5001 17.6716 11.1716 17 12.0001 17C12.8285 17 13.5001 17.6716 13.5001 18.5Z</StreamGeometry>
+    <StreamGeometry x:Key="NotificationCardErrorIconPathData">M23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12ZM13.5 17.5C13.5 16.6716 12.8284 16 12 16C11.1716 16 10.5 16.6716 10.5 17.5C10.5 18.3284 11.1716 19 12 19C12.8284 19 13.5 18.3284 13.5 17.5ZM12 5C10.9138 5 10.0507 5.91244 10.1109 6.99692L10.4168 12.5023C10.4635 13.3426 11.1584 14 12 14C12.8416 14 13.5365 13.3426 13.5832 12.5023L13.8891 6.99692C13.9493 5.91244 13.0862 5 12 5Z</StreamGeometry>
+
+    <x:Double x:Key="NotificationCardTitleSpacing">4</x:Double>
+
+    <x:Double x:Key="NotificationCardTitleFontSize">16</x:Double>
+    <FontWeight x:Key="NotificationCardTitleFontWeight">600</FontWeight>
+    <x:Double x:Key="NotificationCardMessageFontSize">14</x:Double>
+    <FontWeight x:Key="NotificationCardMessageFontWeight">400</FontWeight>
 </ResourceDictionary>
\ No newline at end of file

From a328e2bb99b072365e4b43106ea05e41f8c6f293 Mon Sep 17 00:00:00 2001
From: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
Date: Wed, 14 Aug 2024 20:00:43 +0800
Subject: [PATCH 2/4] feat: add Light class to NotificationCard.

---
 .../Pages/ExpanderDemo.axaml                  |   3 +-
 .../Pages/NotificationDemo.axaml              |  41 ++++---
 .../Pages/NotificationDemo.axaml.cs           |  26 ++++-
 .../Controls/NotificationCard.axaml           | 102 +++++++++++-------
 4 files changed, 117 insertions(+), 55 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
index 2de225a..bd2cc1e 100644
--- a/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
@@ -9,6 +9,7 @@
     mc:Ignorable="d">
     <StackPanel Spacing="20">
         <StackPanel>
+            <Slider Name="SliderTest" Maximum="400" Minimum="0" TickFrequency="1" IsSnapToTickEnabled="True" />
             <Expander Header="Expander 1">
                 <TextBlock Text="Hello Avalonia!" />
             </Expander>
@@ -36,4 +37,4 @@
             </Expander>
         </Grid>
     </StackPanel>
-</UserControl>
+</UserControl>
\ No newline at end of file
diff --git a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
index dd3b7da..ab62545 100644
--- a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
@@ -7,18 +7,33 @@
     d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
-    <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <StackPanel.Styles>
-            <Style Selector="Button">
-                <Setter Property="Theme" Value="{DynamicResource SolidButton}" />
-                <Setter Property="HorizontalAlignment" Value="Stretch" />
-            </Style>
-        </StackPanel.Styles>
-
-        <Button Click="InfoButton_OnClick" Content="Default" />
-        <Button Click="InfoButton_OnClick" Content="Information" />
-        <Button Click="InfoButton_OnClick" Content="Success" Classes="Success" />
-        <Button Click="InfoButton_OnClick" Content="Warning" Classes="Warning" />
-        <Button Click="InfoButton_OnClick" Content="Error" Classes="Danger" />
+    <StackPanel Spacing="20">
+        <StackPanel Orientation="Horizontal" Spacing="20">
+            <Button Click="NormalButton_OnClick" Content="Information" />
+            <Button Click="NormalButton_OnClick" Content="Success" Classes="Success" />
+            <Button Click="NormalButton_OnClick" Content="Warning" Classes="Warning" />
+            <Button Click="NormalButton_OnClick" Content="Error" Classes="Danger" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <Button Click="PositionButton_OnClick" Content="TopLeft" />
+            <Button Click="PositionButton_OnClick" Content="TopCenter" />
+            <Button Click="PositionButton_OnClick" Content="TopRight" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <Button Click="PositionButton_OnClick" Content="BottomLeft" />
+            <Button Click="PositionButton_OnClick" Content="BottomCenter" />
+            <Button Click="PositionButton_OnClick" Content="BottomRight" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal" Spacing="20">
+            <StackPanel.Styles>
+                <Style Selector="Button">
+                    <Setter Property="Theme" Value="{DynamicResource SolidButton}" />
+                </Style>
+            </StackPanel.Styles>
+            <Button Click="LightButton_OnClick" Content="Information" />
+            <Button Click="LightButton_OnClick" Content="Success" Classes="Success" />
+            <Button Click="LightButton_OnClick" Content="Warning" Classes="Warning" />
+            <Button Click="LightButton_OnClick" Content="Error" Classes="Danger" />
+        </StackPanel>
     </StackPanel>
 </UserControl>
\ No newline at end of file
diff --git a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
index 65a0955..63a252f 100644
--- a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
+++ b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
@@ -22,13 +22,35 @@ public partial class NotificationDemo : UserControl
         _manager = new WindowNotificationManager(topLevel) { MaxItems = 3 };
     }
 
-    private void InfoButton_OnClick(object? sender, RoutedEventArgs e)
+    private void NormalButton_OnClick(object? sender, RoutedEventArgs e)
     {
         if (sender is Button b && b.Content is string s)
         {
-            _manager?.Show(Enum.TryParse<NotificationType>(s, out NotificationType t)
+            _manager?.Show(Enum.TryParse<NotificationType>(s, out var t)
                 ? new Notification(t.ToString(), "This is message", t)
                 : new Notification(s, "This is message"));
         }
     }
+
+    private void PositionButton_OnClick(object? sender, RoutedEventArgs e)
+    {
+        if (sender is Button b && b.Content is string s)
+        {
+            Enum.TryParse<NotificationPosition>(s, out var t);
+            _manager.Position = t;
+            _manager?.Show(new Notification(t.ToString(), "This is message"));
+        }
+    }
+
+    private void LightButton_OnClick(object? sender, RoutedEventArgs e)
+    {
+        if (sender is Button b && b.Content is string s)
+        {
+            Enum.TryParse<NotificationType>(s, out var notificationType);
+            _manager?.Show(
+                new Notification(notificationType.ToString(), "This is message"),
+                type: notificationType,
+                classes: ["Light"]);
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/Semi.Avalonia/Controls/NotificationCard.axaml b/src/Semi.Avalonia/Controls/NotificationCard.axaml
index 1d3cfa4..5348ac6 100644
--- a/src/Semi.Avalonia/Controls/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Controls/NotificationCard.axaml
@@ -33,52 +33,56 @@
                 <LayoutTransformControl Name="PART_LayoutTransformControl" UseRenderTransform="True">
                     <Border
                         Margin="{DynamicResource NotificationCardMargin}"
-                        Padding="{DynamicResource NotificationCardPadding}"
-                        BoxShadow="{DynamicResource NotificationCardBoxShadows}"
                         Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding CornerRadius}">
-                        <DockPanel>
-                            <PathIcon
-                                Name="NotificationIcon"
-                                Width="{DynamicResource NotificationCardIconWidth}"
-                                Height="{DynamicResource NotificationCardIconHeight}"
-                                Margin="{DynamicResource NotificationCardIconMargin}"
-                                VerticalAlignment="Top"
-                                IsVisible="False"
-                                Data="{DynamicResource NotificationCardInformationIconPathData}" />
-                            <ContentControl
-                                Name="PART_Content"
-                                Content="{TemplateBinding Content}">
-                                <ContentControl.DataTemplates>
-                                    <DataTemplate DataType="INotification">
-                                        <StackPanel Spacing="{DynamicResource NotificationCardTitleSpacing}">
-                                            <SelectableTextBlock
-                                                Foreground="{DynamicResource NotificationCardTitleForeground}"
-                                                FontSize="{DynamicResource NotificationCardTitleFontSize}"
-                                                FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
-                                                IsVisible="{Binding Title, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
-                                                Text="{Binding Title}" />
+                        <Border
+                            x:Name="PART_RootBorder"
+                            Padding="{DynamicResource NotificationCardPadding}"
+                            BoxShadow="{DynamicResource NotificationCardBoxShadow}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding CornerRadius}">
+                            <DockPanel>
+                                <PathIcon
+                                    Name="NotificationIcon"
+                                    Width="{DynamicResource NotificationCardIconWidth}"
+                                    Height="{DynamicResource NotificationCardIconHeight}"
+                                    Margin="{DynamicResource NotificationCardIconMargin}"
+                                    VerticalAlignment="Top"
+                                    IsVisible="False"
+                                    Data="{DynamicResource NotificationCardInformationIconPathData}" />
+                                <ContentControl
+                                    Name="PART_Content"
+                                    Content="{TemplateBinding Content}">
+                                    <ContentControl.DataTemplates>
+                                        <DataTemplate DataType="INotification">
+                                            <StackPanel Spacing="{DynamicResource NotificationCardTitleSpacing}">
+                                                <SelectableTextBlock
+                                                    Foreground="{DynamicResource NotificationCardTitleForeground}"
+                                                    FontSize="{DynamicResource NotificationCardTitleFontSize}"
+                                                    FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
+                                                    IsVisible="{Binding Title, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                                    Text="{Binding Title}" />
+                                                <SelectableTextBlock
+                                                    Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                                    FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                                    FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
+                                                    Text="{Binding Message}"
+                                                    TextWrapping="Wrap" />
+                                            </StackPanel>
+                                        </DataTemplate>
+                                        <DataTemplate DataType="x:String">
                                             <SelectableTextBlock
                                                 Foreground="{DynamicResource NotificationCardMessageForeground}"
                                                 FontSize="{DynamicResource NotificationCardMessageFontSize}"
                                                 FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
-                                                Text="{Binding Message}"
+                                                Text="{Binding}"
                                                 TextWrapping="Wrap" />
-                                        </StackPanel>
-                                    </DataTemplate>
-                                    <DataTemplate DataType="x:String">
-                                        <SelectableTextBlock
-                                            Foreground="{DynamicResource NotificationCardMessageForeground}"
-                                            FontSize="{DynamicResource NotificationCardMessageFontSize}"
-                                            FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
-                                            Text="{Binding}"
-                                            TextWrapping="Wrap" />
-                                    </DataTemplate>
-                                </ContentControl.DataTemplates>
-                            </ContentControl>
-                        </DockPanel>
+                                        </DataTemplate>
+                                    </ContentControl.DataTemplates>
+                                </ContentControl>
+                            </DockPanel>
+                        </Border>
                     </Border>
                 </LayoutTransformControl>
             </ControlTemplate>
@@ -163,5 +167,25 @@
             <Setter Property="Foreground" Value="{DynamicResource NotificationCardErrorIconForeground}" />
             <Setter Property="Data" Value="{DynamicResource NotificationCardErrorIconPathData}" />
         </Style>
+
+        <Style Selector="^.Light">
+            <Setter Property="Background" Value="{DynamicResource SemiColorBackground0}" />
+            <Style Selector="^:information /template/ Border#PART_RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorInformation}" />
+                <Setter Property="Background" Value="{DynamicResource SemiColorInformationLight}" />
+            </Style>
+            <Style Selector="^:success /template/ Border#PART_RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorSuccess}" />
+                <Setter Property="Background" Value="{DynamicResource SemiColorSuccessLight}" />
+            </Style>
+            <Style Selector="^:warning /template/ Border#PART_RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorWarning}" />
+                <Setter Property="Background" Value="{DynamicResource SemiColorWarningLight}" />
+            </Style>
+            <Style Selector="^:error /template/ Border#PART_RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorDanger}" />
+                <Setter Property="Background" Value="{DynamicResource SemiColorDangerLight}" />
+            </Style>
+        </Style>
     </ControlTheme>
 </ResourceDictionary>
\ No newline at end of file

From 6630d04565246187eb7c25f20c2512eefbdf43aa Mon Sep 17 00:00:00 2001
From: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
Date: Wed, 14 Aug 2024 20:50:54 +0800
Subject: [PATCH 3/4] feat: enhance NotificationDemo.

---
 .../Pages/NotificationDemo.axaml              | 23 +++++++++++--------
 .../Pages/NotificationDemo.axaml.cs           | 19 ++++++++-------
 2 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
index ab62545..66a8958 100644
--- a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
@@ -8,22 +8,25 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <StackPanel Spacing="20">
+        <UniformGrid Rows="3" Columns="3" Width="500" HorizontalAlignment="Left">
+            <UniformGrid.Styles>
+                <Style Selector="RadioButton">
+                    <Setter Property="Theme" Value="{DynamicResource PureCardRadioButton}" />
+                </Style>
+            </UniformGrid.Styles>
+            <RadioButton Click="PositionButton_OnClick" Content="TopLeft" />
+            <RadioButton Click="PositionButton_OnClick" Content="TopCenter" />
+            <RadioButton Click="PositionButton_OnClick" Content="TopRight" IsChecked="True" />
+            <RadioButton Click="PositionButton_OnClick" Content="BottomLeft" />
+            <RadioButton Click="PositionButton_OnClick" Content="BottomCenter" />
+            <RadioButton Click="PositionButton_OnClick" Content="BottomRight" />
+        </UniformGrid>
         <StackPanel Orientation="Horizontal" Spacing="20">
             <Button Click="NormalButton_OnClick" Content="Information" />
             <Button Click="NormalButton_OnClick" Content="Success" Classes="Success" />
             <Button Click="NormalButton_OnClick" Content="Warning" Classes="Warning" />
             <Button Click="NormalButton_OnClick" Content="Error" Classes="Danger" />
         </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <Button Click="PositionButton_OnClick" Content="TopLeft" />
-            <Button Click="PositionButton_OnClick" Content="TopCenter" />
-            <Button Click="PositionButton_OnClick" Content="TopRight" />
-        </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <Button Click="PositionButton_OnClick" Content="BottomLeft" />
-            <Button Click="PositionButton_OnClick" Content="BottomCenter" />
-            <Button Click="PositionButton_OnClick" Content="BottomRight" />
-        </StackPanel>
         <StackPanel Orientation="Horizontal" Spacing="20">
             <StackPanel.Styles>
                 <Style Selector="Button">
diff --git a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
index 63a252f..4392a7a 100644
--- a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
+++ b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml.cs
@@ -22,6 +22,15 @@ public partial class NotificationDemo : UserControl
         _manager = new WindowNotificationManager(topLevel) { MaxItems = 3 };
     }
 
+    private void PositionButton_OnClick(object? sender, RoutedEventArgs e)
+    {
+        if (sender is RadioButton b && b.Content is string s)
+        {
+            Enum.TryParse<NotificationPosition>(s, out var t);
+            _manager.Position = t;
+        }
+    }
+
     private void NormalButton_OnClick(object? sender, RoutedEventArgs e)
     {
         if (sender is Button b && b.Content is string s)
@@ -32,16 +41,6 @@ public partial class NotificationDemo : UserControl
         }
     }
 
-    private void PositionButton_OnClick(object? sender, RoutedEventArgs e)
-    {
-        if (sender is Button b && b.Content is string s)
-        {
-            Enum.TryParse<NotificationPosition>(s, out var t);
-            _manager.Position = t;
-            _manager?.Show(new Notification(t.ToString(), "This is message"));
-        }
-    }
-
     private void LightButton_OnClick(object? sender, RoutedEventArgs e)
     {
         if (sender is Button b && b.Content is string s)

From 1b26941ec99216d2567eb625fd9459071884b09b Mon Sep 17 00:00:00 2001
From: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
Date: Wed, 14 Aug 2024 20:52:40 +0800
Subject: [PATCH 4/4] fix: revert commit.

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

diff --git a/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
index bd2cc1e..c52c5b3 100644
--- a/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml
@@ -9,7 +9,6 @@
     mc:Ignorable="d">
     <StackPanel Spacing="20">
         <StackPanel>
-            <Slider Name="SliderTest" Maximum="400" Minimum="0" TickFrequency="1" IsSnapToTickEnabled="True" />
             <Expander Header="Expander 1">
                 <TextBlock Text="Hello Avalonia!" />
             </Expander>