From 89e8c2c5a378507069ce232322cbe0e6d8af9592 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Tue, 13 Feb 2024 17:47:54 +0800
Subject: [PATCH] feat: default styling.

---
 demo/Ursa.Demo/Pages/NavMenuDemo.axaml        | 13 +++-
 .../ViewModels/NavMenuDemoViewModel.cs        |  1 -
 src/Ursa.Themes.Semi/Controls/NavMenu.axaml   | 73 ++++++++++++-------
 .../Converters/NavMenuMarginConverter.cs      |  2 +-
 4 files changed, 61 insertions(+), 28 deletions(-)

diff --git a/demo/Ursa.Demo/Pages/NavMenuDemo.axaml b/demo/Ursa.Demo/Pages/NavMenuDemo.axaml
index bf1a6f8..59ade47 100644
--- a/demo/Ursa.Demo/Pages/NavMenuDemo.axaml
+++ b/demo/Ursa.Demo/Pages/NavMenuDemo.axaml
@@ -54,9 +54,20 @@
                 HeaderBinding="{Binding Header}"
                 SubMenuBinding="{Binding  Children}"
                 IconBinding="{Binding}">
+                <u:NavMenu.Styles>
+                    <Style Selector="Rectangle">
+                        <Setter Property="Fill" Value="Blue"></Setter>
+                    </Style>
+                    <Style Selector="Rectangle.Active">
+                        <Setter Property="Fill" Value="Red"></Setter>
+                    </Style>
+                </u:NavMenu.Styles>
                 <u:NavMenu.IconTemplate>
                     <DataTemplate>
-                        <Rectangle Width="10" Height="10" Fill="Blue"></Rectangle>
+                        <Rectangle
+                            Classes.Active="{Binding $parent[u:NavMenuItem].IsHighlighted}"
+                            Width="10" Height="10" >
+                        </Rectangle>
                     </DataTemplate>
                 </u:NavMenu.IconTemplate>
             </u:NavMenu>
diff --git a/demo/Ursa.Demo/ViewModels/NavMenuDemoViewModel.cs b/demo/Ursa.Demo/ViewModels/NavMenuDemoViewModel.cs
index f7dc981..7748926 100644
--- a/demo/Ursa.Demo/ViewModels/NavMenuDemoViewModel.cs
+++ b/demo/Ursa.Demo/ViewModels/NavMenuDemoViewModel.cs
@@ -4,7 +4,6 @@ using System.Windows.Input;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
 using Ursa.Controls;
-
 namespace Ursa.Demo.ViewModels;
 
 public class NavMenuDemoViewModel: ObservableObject
diff --git a/src/Ursa.Themes.Semi/Controls/NavMenu.axaml b/src/Ursa.Themes.Semi/Controls/NavMenu.axaml
index 3b2e7ca..8236e96 100644
--- a/src/Ursa.Themes.Semi/Controls/NavMenu.axaml
+++ b/src/Ursa.Themes.Semi/Controls/NavMenu.axaml
@@ -9,7 +9,7 @@
 
     <ControlTheme x:Key="{x:Type u:NavMenu}" TargetType="u:NavMenu">
         <Setter Property="Grid.IsSharedSizeScope" Value="True" />
-        <Setter Property="SubMenuIndent" Value="16" />
+        <Setter Property="SubMenuIndent" Value="24" />
         <Setter Property="Template">
             <ControlTemplate TargetType="u:NavMenu">
                 <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
@@ -22,8 +22,9 @@
     <ControlTemplate x:Key="DefaultNavMenuItemTemplate" TargetType="u:NavMenuItem">
         <Grid RowDefinitions="Auto, *">
             <Border
+                Name="PART_Border"
                 Grid.Row="0"
-                Background="{Binding Background, RelativeSource={RelativeSource TemplatedParent}}"
+                Background="{TemplateBinding u:NavMenuItem.Background}"
                 CornerRadius="4">
                 <Grid HorizontalAlignment="Stretch">
                     <Grid.Margin>
@@ -81,8 +82,11 @@
     </ControlTemplate>
     <ControlTemplate x:Key="TopLevelCollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
         <Border
-            MinWidth="24"
-            MinHeight="24"
+            Name="PART_Border"
+            CornerRadius="4"
+            MinWidth="32"
+            MinHeight="32"
+            Background="{TemplateBinding u:NavMenuItem.Background}"
             HorizontalAlignment="Left">
             <Grid>
                 <ContentPresenter
@@ -94,19 +98,20 @@
                     IsLightDismissEnabled="True"
                     Placement="RightEdgeAlignedTop"
                     PlacementTarget="{Binding #PART_IconPresenter}">
-                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True">
+                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True" Padding="4">
                         <ItemsPresenter ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
                     </Border>
                 </Popup>
             </Grid>
         </Border>
     </ControlTemplate>
-    
     <ControlTemplate x:Key="CollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
         <Border
             Name="PART_Border"
+            CornerRadius="4"
             MinWidth="24"
             MinHeight="24"
+            Background="{TemplateBinding u:NavMenuItem.Background}"
             HorizontalAlignment="Stretch">
             <Grid >
                 <Grid.ColumnDefinitions>
@@ -132,46 +137,64 @@
                     Width="8"
                     Height="8"
                     Margin="12,0"
+                    RenderTransform="rotate(-90deg)"
                     Data="{DynamicResource NavigationMenuItemExpandIconGlyph}"
                     Foreground="{DynamicResource NavigationMenuItemExpandIconForeground}">
-                    <PathIcon.Transitions>
-                        <Transitions>
-                            <TransformOperationsTransition Property="RenderTransform" Duration="0.1" />
-                        </Transitions>
-                    </PathIcon.Transitions>
                 </PathIcon>
                 <Popup Grid.Column="0"
                     Name="PART_Popup"
                     IsLightDismissEnabled="True"
                     Placement="RightEdgeAlignedTop"
                     PlacementTarget="{Binding #PART_Border}">
-                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True">
+                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True" Padding="4">
                         <ItemsPresenter ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
                     </Border>
                 </Popup>
             </Grid>
         </Border>
     </ControlTemplate>
-    
     <ControlTheme x:Key="{x:Type u:NavMenuItem}" TargetType="u:NavMenuItem">
-        <Setter Property="Template" Value="{StaticResource DefaultNavMenuItemTemplate}" />
-        <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource NavigationMenuItemSelectedBackground}" />
-        </Style>
-        <Style Selector="^:vertical-collapsed /template/ LayoutTransformControl#PART_Transform">
-            <Setter Property="LayoutTransform" Value="scale(1,0)" />
-        </Style>
-        <Style Selector="^:vertical-collapsed /template/ PathIcon#PART_ExpanderIcon">
-            <Setter Property="RenderTransform" Value="rotate(180deg)" />
-        </Style>
-        <Style Selector="^:empty /template/ PathIcon#PART_ExpanderIcon">
-            <Setter Property="IsVisible" Value="False" />
+        <Setter Property="Background" Value="Transparent"></Setter>
+        <Style Selector="^">
+            <Setter Property="Template" Value="{StaticResource DefaultNavMenuItemTemplate}" />
+            <Style Selector="^:selected">
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemSelectedBackground}" />
+            </Style>
+            <Style Selector="^:vertical-collapsed /template/ LayoutTransformControl#PART_Transform">
+                <Setter Property="LayoutTransform" Value="scale(1,0)" />
+            </Style>
+            <Style Selector="^:vertical-collapsed /template/ PathIcon#PART_ExpanderIcon">
+                <Setter Property="RenderTransform" Value="rotate(180deg)" />
+            </Style>
+            <Style Selector="^:empty /template/ PathIcon#PART_ExpanderIcon">
+                <Setter Property="IsVisible" Value="False" />
+            </Style>
+            <Style Selector="^ /template/ Border#PART_Border:pointerover">
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+            </Style>
         </Style>
+        
         <Style Selector="^:horizontal-collapsed:first-level">
             <Setter Property="Template" Value="{StaticResource TopLevelCollapsedNavMenuItemTemplate}" />
+            <Style Selector="^ /template/ Border#PART_Border">
+                <Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}"/>
+                <Setter Property="ToolTip.ShowDelay" Value="0"/>
+            </Style>
+            <Style Selector="^/template/ Border#PART_Border:pointerover">
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+            </Style>
         </Style>
         <Style Selector="^:horizontal-collapsed:not(:first-level)">
             <Setter Property="Template" Value="{StaticResource CollapsedNavMenuItemTemplate}" />
+            <Style Selector="^:selected">
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemSelectedBackground}" />
+            </Style>
+            <Style Selector="^:empty /template/ PathIcon#PART_ExpanderIcon">
+                <Setter Property="IsVisible" Value="False" />
+            </Style>
+            <Style Selector="^/template/ Border#PART_Border:pointerover">
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+            </Style>
         </Style>
     </ControlTheme>
 
diff --git a/src/Ursa.Themes.Semi/Converters/NavMenuMarginConverter.cs b/src/Ursa.Themes.Semi/Converters/NavMenuMarginConverter.cs
index 999c0b1..6bd2c37 100644
--- a/src/Ursa.Themes.Semi/Converters/NavMenuMarginConverter.cs
+++ b/src/Ursa.Themes.Semi/Converters/NavMenuMarginConverter.cs
@@ -10,7 +10,7 @@ public class NavMenuMarginConverter: IMultiValueConverter
     {
         if (values[0] is double indent && values[1] is int level)
         {
-            return new Thickness(indent * level, 0, 0, 0);
+            return new Thickness(indent * (level-1), 0, 0, 0);
         }
         return AvaloniaProperty.UnsetValue;
     }