Flyout styles and settings animations (#682)

* Refactor and enhance settings pages and solution structure

- Added transition effects to multiple pages for enhanced UI animations.
- Moved `AboutPage` and `PersonalizationPage` to settings folder.
- Put version into settings card instead of text.

* Fixed main logo in about page and changed version styles

* revert platforms

* Remove useless imprt

* Apply this animation globally

* Added resize transition for mail rendering page

* remove entrance transition from rendering page

Wino.Mail/MenuFlyouts/WinoOperationFlyoutItem.cs

@@ -1,5 +1,4 @@
 using System;
-using Windows.UI.Xaml;
 using Windows.UI.Xaml.Controls;
 using Wino.Core.Domain.Interfaces;
 using Wino.Core.Domain.Models.Folders;
@@ -11,18 +10,11 @@ namespace Wino.MenuFlyouts;
 
 public partial class WinoOperationFlyoutItem<TOperationMenuItem> : MenuFlyoutItem, IDisposable where TOperationMenuItem : IMenuOperation
 {
-    private const double CustomHeight = 35;
-
     public TOperationMenuItem Operation { get; set; }
     Action<TOperationMenuItem> Clicked { get; set; }
 
     public WinoOperationFlyoutItem(TOperationMenuItem operationMenuItem, Action<TOperationMenuItem> clicked)
     {
-        Margin = new Thickness(4, 2, 4, 2);
-        CornerRadius = new CornerRadius(6, 6, 6, 6);
-
-        MinHeight = CustomHeight;
-
         Operation = operationMenuItem;
         IsEnabled = operationMenuItem.IsEnabled;
 

Wino.Mail/Views/MailRenderingPage.xaml

@@ -156,6 +156,11 @@
             <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />
         </Grid.RowDefinitions>
+        <Grid.ChildrenTransitions>
+            <TransitionCollection>
+                <RepositionThemeTransition IsStaggeringEnabled="False" />
+            </TransitionCollection>
+        </Grid.ChildrenTransitions>
 
         <Border
             Background="{ThemeResource WinoContentZoneBackgroud}"

Wino.Mail/Views/Settings/AboutPage.xaml

@@ -14,7 +14,7 @@
             <Image
                 Width="50"
                 Height="50"
-                Source="ms-appx:///Assets/StoreLogo.png" />
+                Source="ms-appx:///Images/StoreLogo.png" />
             <TextBlock
                 Margin="0,6,0,4"
                 HorizontalAlignment="Center"
@@ -167,9 +167,14 @@
                 </controls:SettingsExpander.Items>
             </controls:SettingsExpander>
 
-            <TextBlock Margin="0,0,4,0" HorizontalAlignment="Right">
-                <Run Text="{x:Bind domain:Translator.SettingsAboutVersion}" /><Run Text="{x:Bind ViewModel.VersionName}" />
-            </TextBlock>
+            <controls:SettingsCard Header="Wino Mail">
+                <controls:SettingsCard.HeaderIcon>
+                    <BitmapIcon ShowAsMonochrome="False" UriSource="ms-appx:///Images/StoreLogo.png" />
+                </controls:SettingsCard.HeaderIcon>
+                <TextBlock Foreground="{ThemeResource TextFillColorSecondaryBrush}" IsTextSelectionEnabled="True">
+                    <Run Text="{x:Bind domain:Translator.SettingsAboutVersion}" /><Run Text="{x:Bind ViewModel.VersionName}" />
+                </TextBlock>
+            </controls:SettingsCard>
         </StackPanel>
     </ScrollViewer>
 </abstract:AboutPageAbstract>

Wino.Mail/Views/Settings/ReadComposePanePage.xaml

@@ -71,7 +71,7 @@
                     </controls:SettingsCard>
                     <controls:SettingsCard Header="{x:Bind domain:Translator.SettingsLoadPlaintextLinks_Title}">
                         <controls:SettingsCard.HeaderIcon>
-                           <PathIcon Data="{StaticResource AddLinkPathIcon}" />
+                            <PathIcon Data="{StaticResource AddLinkPathIcon}" />
                         </controls:SettingsCard.HeaderIcon>
                         <ToggleSwitch IsOn="{x:Bind ViewModel.PreferencesService.RenderPlaintextLinks, Mode=TwoWay}" />
                     </controls:SettingsCard>
@@ -122,4 +122,4 @@
             </controls:SettingsExpander>
         </StackPanel>
     </ScrollViewer>
-</abstract:ReadComposePanePageAbstract>
+</abstract:ReadComposePanePageAbstract>