Merge branch 'Tiktack-features/UI-refresh'

Wino.Mail/App.xaml

@@ -209,6 +209,12 @@
                     <Style TargetType="ScrollViewer">
                         <Setter Property="VerticalScrollBarVisibility" Value="Auto" />
                     </Style>
+
+                    <!--  Remove border/backgroud of command bar  -->
+                    <SolidColorBrush x:Key="CommandBarBackground" Color="Transparent" />
+                    <SolidColorBrush x:Key="CommandBarBackgroundOpen" Color="Transparent" />
+                    <SolidColorBrush x:Key="CommandBarBorderBrushOpen" Color="Transparent" />
+                    <Thickness x:Key="CommandBarBorderThicknessOpen">0</Thickness>
                 </ResourceDictionary>
 
                 <!--  Last item must always be the default theme.  -->

Wino.Mail/AppShell.xaml

@@ -2,26 +2,29 @@
     x:Class="Wino.Views.AppShell"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    x:Name="Root"
     xmlns:abstract="using:Wino.Views.Abstract"
     xmlns:advanced="using:Wino.Controls.Advanced"
     xmlns:animatedvisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
+    xmlns:animations="using:CommunityToolkit.WinUI.Animations"
     xmlns:controls="using:Wino.Controls"
     xmlns:controls1="using:CommunityToolkit.WinUI.Controls"
-    xmlns:domain="using:Wino.Core.Domain"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:domain="using:Wino.Core.Domain"
+    xmlns:enums="using:Wino.Core.Domain.Enums"
     xmlns:helpers="using:Wino.Helpers"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:enums="using:Wino.Core.Domain.Enums"
     xmlns:menu="using:Wino.Core.MenuItems"
     xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
-    xmlns:animations="using:CommunityToolkit.WinUI.Animations"
     xmlns:selectors="using:Wino.Selectors"
+    x:Name="Root"
     muxc:BackdropMaterial.ApplyToRootOrPageBackground="{ThemeResource UseMica}"
     mc:Ignorable="d">
 
     <Page.Resources>
 
+        <!--  Removes default styles for content of navigation view  -->
+        <SolidColorBrush x:Key="NavigationViewContentBackground" Color="Transparent" />
+        <SolidColorBrush x:Key="NavigationViewContentGridBorderBrush" Color="Transparent" />
 
         <DataTemplate x:Key="SeperatorTemplate">
             <muxc:NavigationViewItemSeparator Margin="-20,0" />
@@ -110,15 +113,15 @@
         <!--  Clickable New Style Account Template  -->
         <DataTemplate x:Key="ClickableAccountMenuTemplate" x:DataType="menu:AccountMenuItem">
             <controls:AccountNavigationItem
-                Style="{StaticResource SingleAccountNavigationViewItemTemplate}"
                 x:Name="AccountItem"
-                IsActiveAccount="{x:Bind IsSelected, Mode=OneWay}"
                 HorizontalContentAlignment="Stretch"
                 VerticalContentAlignment="Stretch"
+                DataContext="{x:Bind}"
+                IsActiveAccount="{x:Bind IsSelected, Mode=OneWay}"
                 IsChildSelected="{x:Bind IsChildSelected, Mode=TwoWay}"
                 IsExpanded="{x:Bind IsExpanded, Mode=TwoWay}"
-                DataContext="{x:Bind}"
-                SelectsOnInvoked="False">
+                SelectsOnInvoked="False"
+                Style="{StaticResource SingleAccountNavigationViewItemTemplate}">
                 <controls:WinoNavigationViewItem.ContentTransitions>
                     <TransitionCollection>
                         <EdgeUIThemeTransition Edge="Top" />
@@ -159,8 +162,8 @@
 
                         <TextBlock
                             FontSize="13"
-                            MaxLines="1"
                             FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightByChildSelectedState(IsSelected), Mode=OneWay}"
+                            MaxLines="1"
                             Style="{StaticResource CaptionTextBlockStyle}"
                             Text="{x:Bind Parameter.Address, Mode=OneWay}"
                             TextTrimming="CharacterEllipsis" />
@@ -239,8 +242,8 @@
         <DataTemplate x:Key="CreateNewMailTemplate" x:DataType="menu:NewMailMenuItem">
             <controls:WinoNavigationViewItem
                 Height="50"
-                SelectsOnInvoked="False"
-                DataContext="{x:Bind}">
+                DataContext="{x:Bind}"
+                SelectsOnInvoked="False">
                 <muxc:NavigationViewItem.Icon>
                     <controls:WinoFontIcon Icon="NewMail" />
                 </muxc:NavigationViewItem.Icon>
@@ -258,16 +261,16 @@
                 MinHeight="30"
                 AllowDrop="True"
                 ContextRequested="MenuItemContextRequested"
+                DataContext="{x:Bind}"
                 DragEnter="ItemDragEnterOnFolder"
                 DragLeave="ItemDragLeaveFromFolder"
                 Drop="ItemDroppedOnFolder"
-                DataContext="{x:Bind}"
                 FontSize="50"
                 FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightByChildSelectedState(IsSelected), Mode=OneWay}"
                 IsExpanded="{x:Bind IsExpanded, Mode=TwoWay}"
                 IsSelected="{x:Bind IsSelected, Mode=TwoWay}"
-                SelectsOnInvoked="{x:Bind IsMoveTarget, Mode=OneWay}"
-                MenuItemsSource="{x:Bind SubMenuItems, Mode=OneWay}">
+                MenuItemsSource="{x:Bind SubMenuItems, Mode=OneWay}"
+                SelectsOnInvoked="{x:Bind IsMoveTarget, Mode=OneWay}">
                 <animations:Implicit.Animations>
                     <animations:ScaleAnimation Duration="0:0:0.5" />
                 </animations:Implicit.Animations>
@@ -329,8 +332,8 @@
                 IsActiveAccount="{x:Bind IsSelected, Mode=OneWay}"
                 IsChildSelected="{x:Bind IsChildSelected, Mode=TwoWay}"
                 IsExpanded="{x:Bind IsExpanded, Mode=TwoWay}"
-                Style="{StaticResource SingleAccountNavigationViewItemTemplate}"
-                SelectsOnInvoked="False">
+                SelectsOnInvoked="False"
+                Style="{StaticResource SingleAccountNavigationViewItemTemplate}">
                 <muxc:NavigationViewItem.InfoBadge>
                     <muxc:InfoBadge
                         x:Name="FolderInfoBadge"
@@ -376,9 +379,9 @@
                 MinHeight="30"
                 AllowDrop="True"
                 ContextRequested="MenuItemContextRequested"
+                DataContext="{x:Bind}"
                 DragEnter="ItemDragEnterOnFolder"
                 DragLeave="ItemDragLeaveFromFolder"
-                DataContext="{x:Bind}"
                 Drop="ItemDroppedOnFolder"
                 FontSize="50"
                 FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightByChildSelectedState(IsSelected), Mode=OneWay}"
@@ -421,10 +424,10 @@
         <DataTemplate x:Key="MergedAccountMoreFolderItemTemplate" x:DataType="menu:MergedAccountMoreFolderMenuItem">
             <controls:WinoNavigationViewItem
                 MinHeight="30"
+                Content="{x:Bind domain:Translator.More}"
                 FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightByChildSelectedState(IsSelected), Mode=OneWay}"
                 IsExpanded="{x:Bind IsExpanded, Mode=TwoWay}"
                 IsSelected="{x:Bind IsSelected, Mode=TwoWay}"
-                Content="{x:Bind domain:Translator.More}"
                 MenuItemsSource="{x:Bind SubMenuItems, Mode=OneWay}"
                 SelectsOnInvoked="True">
                 <animations:Implicit.Animations>
@@ -469,15 +472,15 @@
 
         <selectors:NavigationMenuTemplateSelector
             x:Key="NavigationMenuTemplateSelector"
-            MergedAccountMoreExpansionItemTemplate="{StaticResource MergedAccountMoreFolderItemTemplate}"
-            ClickableAccountMenuTemplate="{StaticResource ClickableAccountMenuTemplate}"
             AccountManagementTemplate="{StaticResource ManageAccountsTemplate}"
-            NestedAccountMenuTemplate="{StaticResource NestedAccountMenuTemplate}"
+            ClickableAccountMenuTemplate="{StaticResource ClickableAccountMenuTemplate}"
             FixAuthenticationIssueTemplate="{StaticResource FixAuthenticationIssueTemplate}"
             FixMissingFolderConfigTemplate="{StaticResource FixMissingFolderConfig}"
             FolderMenuTemplate="{StaticResource FolderMenuTemplate}"
             MergedAccountFolderTemplate="{StaticResource MergedAccountFolderMenuItemTemplate}"
+            MergedAccountMoreExpansionItemTemplate="{StaticResource MergedAccountMoreFolderItemTemplate}"
             MergedAccountTemplate="{StaticResource MergedAccountTemplate}"
+            NestedAccountMenuTemplate="{StaticResource NestedAccountMenuTemplate}"
             NewMailTemplate="{StaticResource CreateNewMailTemplate}"
             RatingItemTemplate="{StaticResource RatingItemTemplate}"
             SeperatorTemplate="{StaticResource SeperatorTemplate}"
@@ -507,7 +510,6 @@
             IsHitTestVisible="False" />
 
         <muxc:NavigationView
-            IsTabStop="True"
             x:Name="navigationView"
             Grid.Row="1"
             Grid.ColumnSpan="3"
@@ -519,6 +521,7 @@
             IsPaneOpen="{x:Bind ViewModel.PreferencesService.IsNavigationPaneOpened, Mode=TwoWay}"
             IsPaneToggleButtonVisible="False"
             IsSettingsVisible="False"
+            IsTabStop="True"
             IsTitleBarAutoPaddingEnabled="False"
             ItemInvoked="NavigationViewItemInvoked"
             MenuItemTemplateSelector="{StaticResource NavigationMenuTemplateSelector}"
@@ -579,19 +582,19 @@
                     x:Name="ShellInfoBar"
                     Grid.Column="1"
                     MaxWidth="700"
-                    IsOpen="False"
                     Margin="0,60,25,0"
                     HorizontalAlignment="Right"
                     VerticalAlignment="Top"
-                    IsClosable="False" />
+                    IsClosable="False"
+                    IsOpen="False" />
 
                 <!--  Teaching Tip  -->
                 <muxc:TeachingTip
                     x:Name="ShellTip"
-                    Target="{x:Bind ShellInfoBar}"
                     Grid.Column="1"
                     IsOpen="False"
-                    PreferredPlacement="Bottom" />
+                    PreferredPlacement="Bottom"
+                    Target="{x:Bind ShellInfoBar}" />
             </Grid>
         </muxc:NavigationView>
 

Wino.Mail/AppThemes/Acrylic.xaml

@@ -1,43 +1,37 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:Microsoft.UI.Xaml.Media"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Acrylic</x:String>
     <x:Boolean x:Key="UseMica">False</x:Boolean>
 
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">0,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <!--  Acrylic Template  -->
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
-            <!--  Reading Pane Background  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">white</SolidColorBrush>
-
             <!--  Reading Page Date/Name Group Header Background  -->
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#ecf0f1</SolidColorBrush>
 
             <local:AcrylicBrush
                 x:Key="WinoApplicationBackgroundColor"
-                TintColor="#FCFCFC"
-                TintOpacity="0.75"
+                BackgroundSource="HostBackdrop"
                 FallbackColor="#F9F9F9"
-                BackgroundSource="HostBackdrop" />
+                TintColor="#FCFCFC"
+                TintOpacity="0.75" />
         </ResourceDictionary>
 
         <ResourceDictionary x:Name="Dark">
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">Transparent</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#2C2C2C</SolidColorBrush>
 
             <local:AcrylicBrush
                 x:Key="WinoApplicationBackgroundColor"
-                TintColor="#2C2C2C"
-                TintOpacity="0.30"
+                BackgroundSource="HostBackdrop"
                 FallbackColor="#2C2C2C"
-                BackgroundSource="HostBackdrop" />
+                TintColor="#2C2C2C"
+                TintOpacity="0.30" />
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 </ResourceDictionary>

Wino.Mail/AppThemes/Clouds.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Clouds</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appx:///BackgroundImages/Clouds.jpg</x:String>
@@ -9,19 +9,13 @@
 
     <ImageBrush x:Key="WinoApplicationBackgroundColor" ImageSource="{StaticResource ThemeBackgroundImage}" />
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">4,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3FFFFFF</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#FFFFFF</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#b2dffc</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3262626</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#5413191F</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#b2dffc</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 </ResourceDictionary>

Wino.Mail/AppThemes/Custom.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Custom</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appdata:///local/CustomWallpaper.jpg</x:String>
@@ -9,11 +9,8 @@
 
     <ImageBrush
         x:Key="WinoApplicationBackgroundColor"
-        Stretch="UniformToFill"
-        ImageSource="{StaticResource ThemeBackgroundImage}" />
-
-    <Thickness x:Key="RendererGridMargin">0,0,0,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">0,6,6,0</xaml:CornerRadius>
+        ImageSource="{StaticResource ThemeBackgroundImage}"
+        Stretch="UniformToFill" />
 
     <!--  Navigation View Settings  -->
     <xaml:CornerRadius x:Key="NavigationViewContentGridCornerRadius">0,0,0,0</xaml:CornerRadius>
@@ -27,9 +24,6 @@
 
             <Color x:Key="MainCustomThemeColor">#D9FFFFFF</Color>
 
-            <!--  Reading Pane Background  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush" Color="{StaticResource MainCustomThemeColor}" />
-
             <SolidColorBrush x:Key="AppBarBackgroundColor" Color="{StaticResource MainCustomThemeColor}" />
             <SolidColorBrush x:Key="NavigationViewContentBackground" Color="Transparent" />
             <SolidColorBrush x:Key="NavigationViewExpandedPaneBackground" Color="{StaticResource MainCustomThemeColor}" />

Wino.Mail/AppThemes/Forest.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Forest</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appx:///BackgroundImages/Forest.jpg</x:String>
@@ -9,18 +9,12 @@
 
     <ImageBrush x:Key="WinoApplicationBackgroundColor" ImageSource="{StaticResource ThemeBackgroundImage}" />
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">4,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#2900F00A</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#A800D608</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3262626</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#59001C01</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>

Wino.Mail/AppThemes/Garden.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Garden</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appx:///BackgroundImages/Garden.jpg</x:String>
@@ -9,19 +9,13 @@
 
     <ImageBrush x:Key="WinoApplicationBackgroundColor" ImageSource="{StaticResource ThemeBackgroundImage}" />
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">4,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3FFFFFF</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#FFFFFF</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#dcfad8</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
-            <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3262626</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#5413191F</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#dcfad8</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 </ResourceDictionary>

Wino.Mail/AppThemes/Mica.xaml

@@ -8,20 +8,14 @@
 
     <SolidColorBrush x:Key="WinoApplicationBackgroundColor">Transparent</SolidColorBrush>
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">0,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <!--  Mica Template  -->
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
-            <!--  Reading Pane Background  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">white</SolidColorBrush>
-
             <!--  Reading Page Date/Name Group Header Background  -->
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#ecf0f1</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">Transparent</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#1f1f1f</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>

Wino.Mail/AppThemes/Nighty.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Nighty</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appx:///BackgroundImages/Nighty.jpg</x:String>
@@ -9,18 +9,14 @@
 
     <ImageBrush x:Key="WinoApplicationBackgroundColor" ImageSource="{StaticResource ThemeBackgroundImage}" />
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">4,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
             <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3FFFFFF</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#fdcb6e</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
             <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3262626</SolidColorBrush>
             <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#5413191F</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>

Wino.Mail/AppThemes/Snowflake.xaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:xaml="using:Windows.UI.Xaml"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:xaml="using:Windows.UI.Xaml">
 
     <x:String x:Key="ThemeName">Snowflake</x:String>
     <x:String x:Key="ThemeBackgroundImage">ms-appx:///BackgroundImages/Snowflake.jpg</x:String>
@@ -9,19 +9,15 @@
 
     <ImageBrush x:Key="WinoApplicationBackgroundColor" ImageSource="{StaticResource ThemeBackgroundImage}" />
     <SolidColorBrush x:Key="AppBarBackgroundColor">Transparent</SolidColorBrush>
-    <Thickness x:Key="RendererGridMargin">4,0,4,0</Thickness>
-    <xaml:CornerRadius x:Key="MailListGridCornerRadius">6,6,6,6</xaml:CornerRadius>
 
     <ResourceDictionary.ThemeDictionaries>
         <ResourceDictionary x:Name="Light">
             <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3FFFFFF</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#FFFFFF</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#b0c6dd</SolidColorBrush>
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
             <!--  Brushes  -->
-            <SolidColorBrush x:Key="ReadingPaneBackgroundColorBrush">#A3262626</SolidColorBrush>
-            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#5413191F</SolidColorBrush>
+            <SolidColorBrush x:Key="MailListHeaderBackgroundColor">#b0c6dd</SolidColorBrush>
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 </ResourceDictionary>

Wino.Mail/Styles/Colors.xaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:Microsoft.UI.Xaml.Media">
 
     <SolidColorBrush x:Key="FlaggedBrush">#e74c3c</SolidColorBrush>
     <SolidColorBrush x:Key="DeleteBrush">#e74c3c</SolidColorBrush>
@@ -10,10 +13,12 @@
         <ResourceDictionary x:Name="Light">
             <SolidColorBrush x:Key="AttachmentBrush">#fdcb6e</SolidColorBrush>
             <SolidColorBrush x:Key="SettingsPaneBorderBrush">#636e72</SolidColorBrush>
+            <SolidColorBrush x:Key="WinoContentZoneBackgroud" Color="White" />
         </ResourceDictionary>
         <ResourceDictionary x:Name="Dark">
             <SolidColorBrush x:Key="AttachmentBrush">#fdcb6e</SolidColorBrush>
             <SolidColorBrush x:Key="SettingsPaneBorderBrush">#2d3436</SolidColorBrush>
+            <StaticResource x:Key="WinoContentZoneBackgroud" ResourceKey="LayerFillColorDefaultBrush" />
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 </ResourceDictionary>

Wino.Mail/Views/ComposePage.xaml

@@ -3,17 +3,17 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:abstract="using:Wino.Views.Abstract"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:controls="using:Wino.Controls"
-    xmlns:helpers="using:Wino.Helpers"
-    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
-    xmlns:mailkit="using:MimeKit"
-    xmlns:entities="using:Wino.Core.Domain.Entities"
     xmlns:controls1="using:CommunityToolkit.WinUI.Controls"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:data="using:Wino.Mail.ViewModels.Data"
-    xmlns:reader="using:Wino.Core.Domain.Models.Reader"
     xmlns:domain="using:Wino.Core.Domain"
+    xmlns:entities="using:Wino.Core.Domain.Entities"
+    xmlns:helpers="using:Wino.Helpers"
+    xmlns:mailkit="using:MimeKit"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
+    xmlns:reader="using:Wino.Core.Domain.Models.Reader"
     x:Name="root"
     d:Background="White"
     Loaded="ComposerLoaded"
@@ -48,7 +48,7 @@
                     FromName="{x:Bind Name}"
                     IsKnown="False" />
                 <TextBlock Grid.Column="1">
-                    <Run Text="{x:Bind Name}" FontWeight="SemiBold" /><LineBreak /><Run Text="{x:Bind Address}" />
+                    <Run FontWeight="SemiBold" Text="{x:Bind Name}" /><LineBreak /><Run Text="{x:Bind Address}" />
                 </TextBlock>
             </Grid>
         </DataTemplate>
@@ -58,9 +58,9 @@
         <DataTemplate x:Key="ComposerFileAttachmentTemplate" x:DataType="data:MailAttachmentViewModel">
             <Grid
                 Height="50"
+                Margin="-8,0,0,0"
                 Background="Transparent"
-                ColumnSpacing="3"
-                Margin="-8,0,0,0">
+                ColumnSpacing="3">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="36" />
                     <ColumnDefinition Width="*" />
@@ -85,8 +85,8 @@
 
                     <TextBlock
                         FontSize="13"
-                        Text="{x:Bind FileName}"
                         MaxLines="2"
+                        Text="{x:Bind FileName}"
                         TextTrimming="CharacterEllipsis" />
 
                     <TextBlock
@@ -101,17 +101,29 @@
                 <SymbolIcon
                     Grid.Column="2"
                     VerticalAlignment="Center"
-                    Symbol="Cancel"
-                    Foreground="{StaticResource DeleteBrush}" />
+                    Foreground="{StaticResource DeleteBrush}"
+                    Symbol="Cancel" />
             </Grid>
         </DataTemplate>
     </Page.Resources>
 
     <Grid
-        Background="{ThemeResource AppBarBackgroundColor}"
+        Padding="7,0"
         AllowDrop="True"
+        DragLeave="OnComposeGridDragLeave"
         DragOver="OnComposeGridDragOver"
-        DragLeave="OnComposeGridDragLeave">
+        RowSpacing="7">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+
+        <Border
+            Background="{ThemeResource WinoContentZoneBackgroud}"
+            BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+            BorderThickness="1"
+            CornerRadius="7">
+            <Grid>
                 <Grid.Resources>
                     <SolidColorBrush x:Key="AutoSuggestBoxBorderThemeBrush">Transparent</SolidColorBrush>
                 </Grid.Resources>
@@ -121,7 +133,6 @@
                     <RowDefinition Height="56" />
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
-            <RowDefinition Height="*" />
                 </Grid.RowDefinitions>
 
                 <Grid
@@ -135,24 +146,24 @@
                     <CommandBar
                         Grid.Row="1"
                         DefaultLabelPosition="Right"
-                OverflowButtonVisibility="Collapsed"
                         DynamicOverflowItemsChanging="BarDynamicOverflowChanging"
-                IsDynamicOverflowEnabled="True">
+                        IsDynamicOverflowEnabled="True"
+                        OverflowButtonVisibility="Collapsed">
                         <CommandBar.PrimaryCommands>
                             <AppBarButton
                                 x:Name="ComposerThemeToggleButton"
-                        LabelPosition="Collapsed"
-                        Click="InvertComposerThemeClicked">
+                                Click="InvertComposerThemeClicked"
+                                LabelPosition="Collapsed">
                                 <AppBarButton.Icon>
                                     <controls:WinoFontIcon Icon="DarkEditor" />
                                 </AppBarButton.Icon>
                             </AppBarButton>
-                    <AppBarButton Label="Discard" Command="{x:Bind ViewModel.DiscardCommand}">
+                            <AppBarButton Command="{x:Bind ViewModel.DiscardCommand}" Label="Discard">
                                 <AppBarButton.Icon>
                                     <controls:WinoFontIcon Icon="Delete" />
                                 </AppBarButton.Icon>
                             </AppBarButton>
-                    <AppBarButton Label="Send" Command="{x:Bind ViewModel.SendCommand}">
+                            <AppBarButton Command="{x:Bind ViewModel.SendCommand}" Label="Send">
                                 <AppBarButton.Icon>
                                     <controls:WinoFontIcon Icon="Send" />
                                 </AppBarButton.Icon>
@@ -179,10 +190,10 @@
                     Grid.Row="1"
                     Margin="0,6"
                     VerticalAlignment="Top"
-            VerticalScrollMode="Disabled"
-            VerticalScrollBarVisibility="Hidden"
                     HorizontalScrollBarVisibility="Hidden"
-            HorizontalScrollMode="Enabled">
+                    HorizontalScrollMode="Enabled"
+                    VerticalScrollBarVisibility="Hidden"
+                    VerticalScrollMode="Disabled">
                     <Grid Margin="16,0,16,20" Padding="8,0">
                         <!--  Format Panel  -->
                         <Grid x:Name="FormatPanel" Visibility="{x:Bind helpers:XamlHelpers.IsFormatSection(ViewModel.SelectedToolbarSection), Mode=OneWay}">
@@ -454,9 +465,9 @@
                 <!--  Mime Info  -->
                 <Grid
                     Grid.Row="2"
-            Padding="16,0"
-            RowSpacing="3"
-            ColumnSpacing="12">
+                    Padding="16,0,16,10"
+                    ColumnSpacing="12"
+                    RowSpacing="3">
                     <Grid.RowDefinitions>
                         <RowDefinition Height="Auto" />
                         <RowDefinition Height="Auto" />
@@ -464,7 +475,6 @@
                         <RowDefinition Height="Auto" />
                         <RowDefinition Height="Auto" />
                         <RowDefinition Height="Auto" />
-                <RowDefinition Height="Auto" />
                     </Grid.RowDefinitions>
 
                     <Grid.ColumnDefinitions>
@@ -496,14 +506,14 @@
 
                     <!--  To  -->
                     <TextBlock
-                Grid.Row="2"
+                        Grid.Row="1"
                         Margin="0,4,0,0"
                         HorizontalAlignment="Right"
                         VerticalAlignment="Center"
                         Text="{x:Bind domain:Translator.ComposerTo}" />
 
                     <Grid
-                Grid.Row="2"
+                        Grid.Row="1"
                         Grid.Column="1"
                         VerticalAlignment="Center">
                         <Grid.ColumnDefinitions>
@@ -515,24 +525,24 @@
                             x:Name="ToBox"
                             Grid.Column="0"
                             VerticalAlignment="Center"
-                    TokenDelimiter=";"
-                    Tag="ToBox"
-                    LostFocus="AddressBoxLostFocus"
                             BorderThickness="0"
                             ItemsSource="{x:Bind ViewModel.ToItems, Mode=OneTime}"
-                    TokenItemAdding="TokenItemAdding"
+                            LostFocus="AddressBoxLostFocus"
                             PlaceholderText="{x:Bind domain:Translator.ComposerToPlaceholder}"
-                    TokenItemTemplate="{StaticResource TokenBoxTemplate}"
-                    SuggestedItemTemplate="{StaticResource SuggestionBoxTemplate}" />
+                            SuggestedItemTemplate="{StaticResource SuggestionBoxTemplate}"
+                            Tag="ToBox"
+                            TokenDelimiter=";"
+                            TokenItemAdding="TokenItemAdding"
+                            TokenItemTemplate="{StaticResource TokenBoxTemplate}" />
 
                         <Button
                             x:Name="CCBCCShowButton"
                             Grid.Column="1"
                             Margin="6,6,0,0"
                             VerticalAlignment="Center"
+                            Click="ShowCCBCCClicked"
                             GotFocus="CCBBCGotFocus"
-                    Visibility="{x:Bind ViewModel.IsCCBCCVisible, Mode=OneWay}"
-                    Click="ShowCCBCCClicked">
+                            Visibility="{x:Bind ViewModel.IsCCBCCVisible, Mode=OneWay}">
                             <StackPanel Orientation="Horizontal" Spacing="6">
                                 <PathIcon
                                     HorizontalAlignment="Center"
@@ -546,7 +556,7 @@
                     <!--  CC BCC  -->
                     <TextBlock
                         x:Name="CCTextBlock"
-                Grid.Row="3"
+                        Grid.Row="2"
                         Margin="0,4,0,0"
                         HorizontalAlignment="Right"
                         VerticalAlignment="Center"
@@ -555,21 +565,21 @@
 
                     <controls1:TokenizingTextBox
                         x:Name="CCBox"
-                Grid.Row="3"
+                        Grid.Row="2"
                         Grid.Column="1"
                         VerticalAlignment="Center"
                         LostFocus="AddressBoxLostFocus"
                         PlaceholderText="{x:Bind domain:Translator.ComposerToPlaceholder}"
                         SuggestedItemTemplate="{StaticResource SuggestionBoxTemplate}"
                         Tag="CCBox"
+                        TokenDelimiter=";"
                         TokenItemAdding="TokenItemAdding"
                         TokenItemTemplate="{StaticResource TokenBoxTemplate}"
-                Visibility="{x:Bind helpers:XamlHelpers.ReverseVisibilityConverter(CCBCCShowButton.Visibility), Mode=OneWay}"
-                TokenDelimiter=";" />
+                        Visibility="{x:Bind helpers:XamlHelpers.ReverseVisibilityConverter(CCBCCShowButton.Visibility), Mode=OneWay}" />
 
                     <TextBlock
                         x:Name="BccTextBlock"
-                Grid.Row="4"
+                        Grid.Row="3"
                         HorizontalAlignment="Right"
                         VerticalAlignment="Center"
                         Text="Bcc: "
@@ -577,28 +587,28 @@
 
                     <controls1:TokenizingTextBox
                         x:Name="BccBox"
-                Grid.Row="4"
+                        Grid.Row="3"
                         Grid.Column="1"
-                LostFocus="AddressBoxLostFocus"
                         VerticalAlignment="Center"
+                        LostFocus="AddressBoxLostFocus"
                         PlaceholderText="{x:Bind domain:Translator.ComposerToPlaceholder}"
-                Visibility="{x:Bind helpers:XamlHelpers.ReverseVisibilityConverter(CCBCCShowButton.Visibility), Mode=OneWay}"
                         SuggestedItemTemplate="{StaticResource SuggestionBoxTemplate}"
                         Tag="BCCBox"
+                        TokenDelimiter=";"
                         TokenItemAdding="TokenItemAdding"
                         TokenItemTemplate="{StaticResource TokenBoxTemplate}"
-                TokenDelimiter=";" />
+                        Visibility="{x:Bind helpers:XamlHelpers.ReverseVisibilityConverter(CCBCCShowButton.Visibility), Mode=OneWay}" />
 
                     <!--  Subject  -->
                     <TextBlock
-                Grid.Row="5"
+                        Grid.Row="4"
                         Margin="0,4,0,0"
                         HorizontalAlignment="Right"
                         VerticalAlignment="Center"
                         Text="{x:Bind domain:Translator.ComposerSubject}" />
 
                     <TextBox
-                Grid.Row="5"
+                        Grid.Row="4"
                         Grid.Column="1"
                         Margin="0,4,0,0"
                         BorderThickness="0"
@@ -607,13 +617,13 @@
                     <!--  Attachments  -->
                     <ListView
                         x:Name="AttachmentsListView"
-                Grid.Row="6"
+                        Grid.Row="5"
                         Grid.ColumnSpan="2"
                         x:Load="{x:Bind helpers:XamlHelpers.CountToBooleanConverter(ViewModel.IncludedAttachments.Count), Mode=OneWay}"
                         IsItemClickEnabled="True"
+                        ItemClick="AttachmentClicked"
                         ItemTemplate="{StaticResource ComposerFileAttachmentTemplate}"
                         ItemsSource="{x:Bind ViewModel.IncludedAttachments, Mode=OneWay}"
-                ItemClick="AttachmentClicked"
                         SelectionMode="None">
                         <ListView.ItemsPanel>
                             <ItemsPanelTemplate>
@@ -627,44 +637,32 @@
                 <Grid
                     Grid.Row="0"
                     Grid.RowSpan="3"
-            Visibility="{x:Bind ViewModel.IsDraggingOverComposerGrid, Mode=OneWay}"
-            Drop="OnFileDropGridFileDropped"
-            DragOver="OnFileDropGridDragOver"
+                    AllowDrop="True"
                     DragLeave="OnFileDropGridDragLeave"
-            AllowDrop="True">
-            <Grid
-                Background="{ThemeResource AcrylicInAppFillColorDefaultBrush}"
-                CornerRadius="9"
-                Margin="0,7,5,0">
+                    DragOver="OnFileDropGridDragOver"
+                    Drop="OnFileDropGridFileDropped"
+                    Visibility="{x:Bind ViewModel.IsDraggingOverComposerGrid, Mode=OneWay}">
+                    <Grid Background="{ThemeResource AcrylicInAppFillColorDefaultBrush}" CornerRadius="9">
                         <Rectangle
                             x:Name="DropZoneBorder"
+                            Fill="Transparent"
+                            Opacity="0.5"
                             RadiusX="9"
                             RadiusY="9"
-                    Fill="Transparent"
                             Stroke="{ThemeResource TextFillColorPrimaryBrush}"
-                    Opacity="0.5"
                             StrokeDashArray="3,4"
                             StrokeThickness="2" />
                         <TextBlock
                             x:Name="DropZoneText"
                             HorizontalAlignment="Center"
                             VerticalAlignment="Center"
-                    Opacity="0.5"
                             FontSize="20"
                             FontWeight="SemiBold"
+                            Opacity="0.5"
                             Text="{x:Bind domain:Translator.ComposerAttachmentsDropZone_Message}" />
                     </Grid>
                 </Grid>
 
-        <Grid
-            Grid.Row="4"
-            CornerRadius="3"
-            Margin="0,6,0,0">
-            <Grid Background="White" Visibility="{x:Bind IsComposerDarkMode, Converter={StaticResource ReverseBooleanToVisibilityConverter}, Mode=OneWay}" />
-
-            <muxc:WebView2 x:Name="Chromium" />
-        </Grid>
-
                 <VisualStateManager.VisualStateGroups>
                     <VisualStateGroup x:Name="ComposerThemeToggleButtonStates">
                         <VisualState x:Name="DarkMode">
@@ -697,4 +695,20 @@
                     </VisualStateGroup>
                 </VisualStateManager.VisualStateGroups>
             </Grid>
+        </Border>
+        <Border
+            Grid.Row="1"
+            Background="{ThemeResource WinoContentZoneBackgroud}"
+            BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+            BorderThickness="1"
+            CornerRadius="10">
+            <Grid>
+                <Grid Background="White" Visibility="{x:Bind IsComposerDarkMode, Converter={StaticResource ReverseBooleanToVisibilityConverter}, Mode=OneWay}" />
+
+                <muxc:WebView2 x:Name="Chromium" />
+            </Grid>
+        </Border>
+    </Grid>
+
+
 </abstract:ComposePageAbstract>

Wino.Mail/Views/MailListPage.xaml

@@ -7,6 +7,7 @@
     xmlns:controls="using:Wino.Controls"
     xmlns:controls1="using:CommunityToolkit.WinUI.Controls"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:domain="using:Wino.Core.Domain"
     xmlns:enums="using:Wino.Core.Domain.Enums"
     xmlns:helpers="using:Wino.Helpers"
     xmlns:i="using:Microsoft.Xaml.Interactivity"
@@ -16,10 +17,9 @@
     xmlns:menuflyouts="using:Wino.MenuFlyouts"
     xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
     xmlns:selectors="using:Wino.Selectors"
-    xmlns:domain="using:Wino.Core.Domain"
     xmlns:ui="using:Microsoft.Toolkit.Uwp.UI"
-    xmlns:wino="using:Wino"
     xmlns:viewModelData="using:Wino.Mail.ViewModels.Data"
+    xmlns:wino="using:Wino"
     x:Name="root"
     Loaded="MailListPageLoaded"
     mc:Ignorable="d">
@@ -66,8 +66,8 @@
                 CornerRadius="6">
                 <TextBlock
                     Padding="12"
-                    AllowFocusOnInteraction="False"
                     VerticalAlignment="Center"
+                    AllowFocusOnInteraction="False"
                     FontSize="13"
                     FontWeight="SemiBold"
                     Text="{x:Bind helpers:XamlHelpers.GetMailGroupDateString(Key)}" />
@@ -224,8 +224,6 @@
                 Tag="{x:Bind}">
                 <controls:MailItemDisplayInformationControl
                     x:DefaultBindMode="OneWay"
-                    MailItem="{Binding}"
-                    HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
                     CenterHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.CenterHoverAction, Mode=OneWay}"
                     ContextRequested="MailItemContextRequested"
                     DisplayMode="{Binding ElementName=root, Path=ViewModel.PreferencesService.MailItemDisplayMode, Mode=OneWay}"
@@ -237,15 +235,17 @@
                     FromAddress="{x:Bind FromAddress}"
                     FromName="{x:Bind FromName}"
                     HasAttachments="{x:Bind HasAttachments}"
+                    HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
                     IsAvatarVisible="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowSenderPicturesEnabled, Mode=OneWay}"
                     IsCustomFocused="{x:Bind IsCustomFocused, Mode=OneWay}"
                     IsDraft="{x:Bind IsDraft, Mode=OneWay}"
                     IsFlagged="{x:Bind IsFlagged, Mode=OneWay}"
+                    IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
                     IsRead="{x:Bind IsRead, Mode=OneWay}"
                     LeftHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.LeftHoverAction, Mode=OneWay}"
+                    MailItem="{Binding}"
                     Prefer24HourTimeFormat="{Binding ElementName=root, Path=ViewModel.PreferencesService.Prefer24HourTimeFormat, Mode=OneWay}"
                     ReceivedDate="{x:Bind CreationDate}"
-                    IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
                     RightHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.RightHoverAction, Mode=OneWay}"
                     ShowPreviewText="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowPreviewEnabled, Mode=OneWay}"
                     Snippet="{x:Bind PreviewText}"
@@ -261,13 +261,10 @@
                 Tag="{x:Bind}">
                 <controls:MailItemDisplayInformationControl
                     x:DefaultBindMode="OneWay"
-                    MailItem="{Binding}"
-                    HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
                     CenterHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.CenterHoverAction, Mode=OneWay}"
                     ContextRequested="MailItemContextRequested"
                     DisplayMode="{Binding ElementName=root, Path=ViewModel.PreferencesService.MailItemDisplayMode, Mode=OneWay}"
                     FocusVisualMargin="8"
-                    IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
                     FocusVisualPrimaryBrush="{StaticResource SystemControlRevealFocusVisualBrush}"
                     FocusVisualPrimaryThickness="2"
                     FocusVisualSecondaryBrush="{StaticResource SystemControlFocusVisualSecondaryBrush}"
@@ -275,13 +272,16 @@
                     FromAddress="{x:Bind FromAddress}"
                     FromName="{x:Bind FromName}"
                     HasAttachments="{x:Bind HasAttachments}"
+                    HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
                     IsAvatarVisible="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowSenderPicturesEnabled, Mode=OneWay}"
-                    Prefer24HourTimeFormat="{Binding ElementName=root, Path=ViewModel.PreferencesService.Prefer24HourTimeFormat, Mode=OneWay}"
                     IsCustomFocused="{x:Bind IsCustomFocused, Mode=OneWay}"
                     IsDraft="{x:Bind IsDraft, Mode=OneWay}"
                     IsFlagged="{x:Bind IsFlagged, Mode=OneWay}"
+                    IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
                     IsRead="{x:Bind IsRead, Mode=OneWay}"
                     LeftHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.LeftHoverAction, Mode=OneWay}"
+                    MailItem="{Binding}"
+                    Prefer24HourTimeFormat="{Binding ElementName=root, Path=ViewModel.PreferencesService.Prefer24HourTimeFormat, Mode=OneWay}"
                     ReceivedDate="{x:Bind CreationDate}"
                     RightHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.RightHoverAction, Mode=OneWay}"
                     ShowPreviewText="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowPreviewEnabled, Mode=OneWay}"
@@ -306,14 +306,8 @@
                                 x:DefaultBindMode="OneWay"
                                 Background="Transparent"
                                 BorderThickness="0"
-                                MailItem="{Binding}"
-                                Prefer24HourTimeFormat="{Binding ElementName=root, Path=ViewModel.PreferencesService.Prefer24HourTimeFormat, Mode=OneWay}"
                                 CanDrag="True"
-                                IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
-                                HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
-                                LeftHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.LeftHoverAction, Mode=OneWay}"
                                 CenterHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.CenterHoverAction, Mode=OneWay}"
-                                RightHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.RightHoverAction, Mode=OneWay}"
                                 ConnectedExpander="{Binding ElementName=ThreadExpander}"
                                 ContextRequested="MailItemContextRequested"
                                 DisplayMode="{Binding ElementName=root, Path=ViewModel.PreferencesService.MailItemDisplayMode, Mode=OneWay}"
@@ -321,13 +315,19 @@
                                 DropCompleted="ThreadHeaderDragFinished"
                                 FromAddress="{x:Bind FromAddress}"
                                 FromName="{x:Bind FromName}"
-                                IsHitTestVisible="True"
                                 HasAttachments="{x:Bind HasAttachments}"
+                                HoverActionExecutedCommand="{Binding ElementName=root, Path=ViewModel.ExecuteHoverActionCommand}"
                                 IsAvatarVisible="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowSenderPicturesEnabled, Mode=OneWay}"
                                 IsDraft="{x:Bind IsDraft}"
                                 IsFlagged="{x:Bind IsFlagged}"
+                                IsHitTestVisible="True"
+                                IsHoverActionsEnabled="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsHoverActionsEnabled, Mode=OneWay}"
                                 IsRead="{x:Bind IsRead}"
+                                LeftHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.LeftHoverAction, Mode=OneWay}"
+                                MailItem="{Binding}"
+                                Prefer24HourTimeFormat="{Binding ElementName=root, Path=ViewModel.PreferencesService.Prefer24HourTimeFormat, Mode=OneWay}"
                                 ReceivedDate="{x:Bind CreationDate}"
+                                RightHoverAction="{Binding ElementName=root, Path=ViewModel.PreferencesService.RightHoverAction, Mode=OneWay}"
                                 ShowPreviewText="{Binding ElementName=root, Path=ViewModel.PreferencesService.IsShowPreviewEnabled, Mode=OneWay}"
                                 Snippet="{x:Bind PreviewText}"
                                 Subject="{x:Bind Subject}" />
@@ -357,8 +357,8 @@
 
         <Style
             x:Key="TopCommandBarButtonStyle"
-            TargetType="Button"
-            BasedOn="{StaticResource DefaultButtonStyle}">
+            BasedOn="{StaticResource DefaultButtonStyle}"
+            TargetType="Button">
             <Setter Property="Background" Value="Transparent" />
             <Setter Property="BorderThickness" Value="0" />
             <Setter Property="VerticalAlignment" Value="Center" />
@@ -368,8 +368,8 @@
 
         <Style
             x:Key="TopCommandBarToggleButtonStyle"
-            TargetType="ToggleButton"
-            BasedOn="{StaticResource DefaultToggleButtonStyle}">
+            BasedOn="{StaticResource DefaultToggleButtonStyle}"
+            TargetType="ToggleButton">
             <Setter Property="Background" Value="Transparent" />
             <Setter Property="BorderThickness" Value="0" />
             <Setter Property="VerticalAlignment" Value="Center" />
@@ -382,23 +382,22 @@
         <Grid>
             <!--  Hidden focus receiver...  -->
             <TextBox
-                Visibility="Collapsed"
-                Opacity="0"
                 Grid.Column="1"
+                HorizontalAlignment="Right"
                 VerticalAlignment="Bottom"
-                HorizontalAlignment="Right" />
+                Opacity="0"
+                Visibility="Collapsed" />
 
             <AutoSuggestBox
                 x:Name="SearchBar"
-                Margin="0,0,8,0"
                 VerticalAlignment="Center"
                 BorderBrush="Transparent"
                 GotFocus="SearchBoxFocused"
                 LostFocus="SearchBarUnfocused"
                 PlaceholderText="{x:Bind domain:Translator.SearchBarPlaceholder}"
                 QueryIcon="Find"
-                TextChanged="SearchBar_TextChanged"
-                Text="{x:Bind ViewModel.SearchQuery, Mode=TwoWay}">
+                Text="{x:Bind ViewModel.SearchQuery, Mode=TwoWay}"
+                TextChanged="SearchBar_TextChanged">
                 <i:Interaction.Behaviors>
                     <ic:EventTriggerBehavior EventName="QuerySubmitted">
                         <ic:InvokeCommandAction Command="{x:Bind ViewModel.PerformSearchCommand}" />
@@ -406,10 +405,9 @@
                 </i:Interaction.Behaviors>
             </AutoSuggestBox>
         </Grid>
-
     </wino:BasePage.ShellContent>
 
-    <Grid x:Name="RootGrid">
+    <Grid x:Name="RootGrid" Padding="0,0,0,7">
         <Grid.ColumnDefinitions>
             <ColumnDefinition
                 x:Name="ReaderColumn"
@@ -419,13 +417,15 @@
         </Grid.ColumnDefinitions>
 
         <!--  Mail Items  -->
-        <Grid
-            x:Name="ReaderGrid"
-            Margin="-1,0,0,0"
-            Padding="4,0,0,0"
-            HorizontalAlignment="Stretch"
-            Background="{ThemeResource ReadingPaneBackgroundColorBrush}"
-            CornerRadius="{ThemeResource MailListGridCornerRadius}">
+        <Border
+            x:Name="ReaderGridContainer"
+            Grid.Column="0"
+            Padding="5,0,0,0"
+            Background="{ThemeResource WinoContentZoneBackgroud}"
+            BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+            BorderThickness="1"
+            CornerRadius="7">
+            <Grid x:Name="ReaderGrid">
                 <Grid.RowDefinitions>
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
@@ -466,19 +466,19 @@
                             </Grid.ColumnDefinitions>
 
                             <Button
-                            Style="{StaticResource TopCommandBarButtonStyle}"
                                 Command="{x:Bind ViewModel.SyncFolderCommand}"
-                            IsEnabled="{x:Bind ViewModel.CanSynchronize, Mode=OneWay}">
+                                IsEnabled="{x:Bind ViewModel.CanSynchronize, Mode=OneWay}"
+                                Style="{StaticResource TopCommandBarButtonStyle}">
                                 <Button.Content>
-                                <controls:WinoFontIcon Icon="Sync" FontSize="16" />
+                                    <controls:WinoFontIcon FontSize="16" Icon="Sync" />
                                 </Button.Content>
                             </Button>
 
                             <ToggleButton
                                 x:Name="SelectionModeToggle"
                                 Grid.Column="1"
-                            Style="{StaticResource TopCommandBarToggleButtonStyle}"
                                 Checked="SelectionModeToggleChecked"
+                                Style="{StaticResource TopCommandBarToggleButtonStyle}"
                                 Unchecked="SelectionModeToggleUnchecked">
                                 <ToggleButton.Content>
                                     <controls:WinoFontIcon FontSize="18" Icon="MultiSelect" />
@@ -491,9 +491,9 @@
                                 x:Name="ArchiveAppBarButton"
                                 Grid.Column="3"
                                 x:Load="{x:Bind helpers:XamlHelpers.ReverseBoolConverter(ViewModel.IsArchiveSpecialFolder), Mode=OneWay}"
-                            Style="{StaticResource TopCommandBarButtonStyle}"
                                 Command="{x:Bind ViewModel.MailOperationCommand}"
                                 IsEnabled="{x:Bind ViewModel.HasSelectedItems, Mode=OneWay}"
+                                Style="{StaticResource TopCommandBarButtonStyle}"
                                 ToolTipService.ToolTip="{x:Bind domain:Translator.MailOperation_Archive}">
                                 <Button.Content>
                                     <controls:WinoFontIcon FontSize="18" Icon="Archive" />
@@ -507,9 +507,9 @@
                                 x:Name="UnarchiveAppBarButton"
                                 Grid.Column="3"
                                 x:Load="{x:Bind ViewModel.IsArchiveSpecialFolder, Mode=OneWay}"
-                            Style="{StaticResource TopCommandBarButtonStyle}"
                                 Command="{x:Bind ViewModel.MailOperationCommand}"
                                 IsEnabled="{x:Bind ViewModel.HasSelectedItems, Mode=OneWay}"
+                                Style="{StaticResource TopCommandBarButtonStyle}"
                                 ToolTipService.ToolTip="{x:Bind domain:Translator.MailOperation_Unarchive}">
                                 <Button.Content>
                                     <controls:WinoFontIcon FontSize="18" Icon="UnArchive" />
@@ -521,9 +521,9 @@
 
                             <Button
                                 Grid.Column="4"
-                            Style="{StaticResource TopCommandBarButtonStyle}"
                                 Command="{x:Bind ViewModel.MailOperationCommand}"
                                 IsEnabled="{x:Bind ViewModel.HasSelectedItems, Mode=OneWay}"
+                                Style="{StaticResource TopCommandBarButtonStyle}"
                                 ToolTipService.ToolTip="{x:Bind domain:Translator.MailOperation_Delete}">
                                 <Button.CommandParameter>
                                     <enums:MailOperation>SoftDelete</enums:MailOperation>
@@ -550,8 +550,8 @@
 
                             <Button
                                 Grid.Column="6"
-                            Style="{StaticResource TopCommandBarButtonStyle}"
-                            IsEnabled="{x:Bind ViewModel.HasSelectedItems, Mode=OneWay}">
+                                IsEnabled="{x:Bind ViewModel.HasSelectedItems, Mode=OneWay}"
+                                Style="{StaticResource TopCommandBarButtonStyle}">
                                 <Button.Content>
                                     <controls:WinoFontIcon FontSize="20" Icon="More" />
                                 </Button.Content>
@@ -597,8 +597,8 @@
                         <muxc:ProgressBar
                             x:Name="LoadingProgressBar"
                             Grid.Row="1"
-                        IsIndeterminate="True"
-                        x:Load="{x:Bind ViewModel.IsInitializingFolder, Mode=OneWay}" />
+                            x:Load="{x:Bind ViewModel.IsInitializingFolder, Mode=OneWay}"
+                            IsIndeterminate="True" />
                     </Grid>
 
                     <!--  Pivot + Sync + Multi Select  -->
@@ -681,38 +681,38 @@
                     x:Name="NoItemsPanel"
                     Grid.Row="2"
                     Grid.RowSpan="3"
-                VerticalAlignment="Center"
                     HorizontalAlignment="Stretch"
+                    VerticalAlignment="Center"
                     Spacing="10">
 
                     <Viewbox
                         Width="48"
-                    Visibility="{x:Bind ViewModel.IsEmpty, Mode=OneWay}"
-                    Opacity="0.4">
+                        Opacity="0.4"
+                        Visibility="{x:Bind ViewModel.IsEmpty, Mode=OneWay}">
                         <Path Data="M252,960C227,960 203.083,954.917 180.25,944.75C157.417,934.583 137.417,920.917 120.25,903.75C103.083,886.583 89.4167,866.583 79.25,843.75C69.0833,820.917 64,797 64,772L64,252C64,227 69.0833,203.083 79.25,180.25C89.4167,157.417 103.083,137.417 120.25,120.25C137.417,103.083 157.417,89.4167 180.25,79.25C203.083,69.0834 227,64.0001 252,64L772,64C797,64.0001 820.917,69.0834 843.75,79.25C866.583,89.4167 886.583,103.083 903.75,120.25C920.917,137.417 934.583,157.417 944.75,180.25C954.917,203.083 960,227 960,252L960,772C960,797 954.917,820.917 944.75,843.75C934.583,866.583 920.917,886.583 903.75,903.75C886.583,920.917 866.583,934.583 843.75,944.75C820.917,954.917 797,960 772,960ZM770.5,896C787.167,896 803.083,892.583 818.25,885.75C833.417,878.917 846.75,869.75 858.25,858.25C869.75,846.75 878.917,833.417 885.75,818.25C892.583,803.083 896,787.167 896,770.5L896,253.5C896,236.833 892.583,220.917 885.75,205.75C878.917,190.583 869.75,177.25 858.25,165.75C846.75,154.25 833.417,145.083 818.25,138.25C803.083,131.417 787.167,128 770.5,128L253.5,128C236.833,128 220.917,131.417 205.75,138.25C190.583,145.083 177.25,154.25 165.75,165.75C154.25,177.25 145.083,190.583 138.25,205.75C131.417,220.917 128,236.833 128,253.5L128,770.5C128,787.167 131.417,803.083 138.25,818.25C145.083,833.417 154.25,846.75 165.75,858.25C177.25,869.75 190.583,878.917 205.75,885.75C220.917,892.583 236.833,896 253.5,896ZM559,604.5C541.667,616.833 523.417,625.833 504.25,631.5C485.083,637.167 465,640 444,640C418,640 393.583,634.833 370.75,624.5C347.917,614.167 328,600.167 311,582.5C294,564.833 280.583,544.417 270.75,521.25C260.917,498.083 256,473.667 256,448C256,421.333 261,396.333 271,373C281,349.667 294.667,329.333 312,312C329.333,294.667 349.667,281 373,271C396.333,261 421.333,256 448,256C473.667,256 498.083,260.917 521.25,270.75C544.417,280.583 564.833,294 582.5,311C600.167,328 614.167,347.917 624.5,370.75C634.833,393.583 640,418 640,444C640,465 637.167,485.083 631.5,504.25C625.833,523.417 616.833,541.667 604.5,559L758.5,713.5C764.833,719.833 768,727.333 768,736C768,744.667 764.833,752.167 758.5,758.5C752.167,764.833 744.667,768 736,768C727.333,768 719.833,764.833 713.5,758.5ZM576,448L576,445.5C576,428.167 572.5,411.917 565.5,396.75C558.5,381.583 549.167,368.333 537.5,357C525.833,345.667 512.25,336.667 496.75,330C481.25,323.333 465,320 448,320C430.333,320 413.75,323.417 398.25,330.25C382.75,337.083 369.25,346.25 357.75,357.75C346.25,369.25 337.083,382.833 330.25,398.5C323.417,414.167 320,430.667 320,448C320,465.667 323.417,482.25 330.25,497.75C337.083,513.25 346.25,526.75 357.75,538.25C369.25,549.75 382.75,558.917 398.25,565.75C413.75,572.583 430.333,576 448,576C465.333,576 481.833,572.583 497.5,565.75C513.167,558.917 526.75,549.75 538.25,538.25C549.75,526.75 558.917,513.25 565.75,497.75C572.583,482.25 576,465.667 576,448Z" Fill="{ThemeResource InformationBrush}" />
                     </Viewbox>
 
                     <TextBlock
                         HorizontalAlignment="Center"
-                    Opacity="0.4"
                         FontSize="20"
                         FontWeight="ExtraLight"
                         Foreground="{ThemeResource InformationBrush}"
+                        Opacity="0.4"
                         Text="{x:Bind domain:Translator.NoMessageCrieteria}"
                         Visibility="{x:Bind ViewModel.IsCriteriaFailed, Mode=OneWay}" />
 
                     <TextBlock
                         HorizontalAlignment="Center"
-                    Opacity="0.4"
                         FontSize="20"
                         FontWeight="ExtraLight"
                         Foreground="{ThemeResource InformationBrush}"
+                        Opacity="0.4"
                         Text="{x:Bind domain:Translator.NoMessageEmptyFolder}"
                         Visibility="{x:Bind ViewModel.IsFolderEmpty, Mode=OneWay}" />
 
                     <muxc:ProgressRing
-                    Grid.Row="2"
                         x:Name="LoadingProgressIndicator"
+                        Grid.Row="2"
                         HorizontalAlignment="Center"
                         VerticalAlignment="Center"
                         x:Load="{x:Bind ViewModel.IsProgressRing, Mode=OneWay}"
@@ -730,11 +730,11 @@
                                 x:Name="MailListView"
                                 HorizontalContentAlignment="Stretch"
                                 ui:ListViewExtensions.ItemContainerStretchDirection="Horizontal"
-                            LoadMoreCommand="{x:Bind ViewModel.LoadMoreItemsCommand}"
                                 ItemContainerStyleSelector="{StaticResource WinoContainerSelector}"
+                                ItemDeletedCommand="{x:Bind ViewModel.MailOperationCommand}"
                                 ItemTemplateSelector="{StaticResource MailItemDisplaySelector}"
                                 ItemsSource="{x:Bind MailCollectionViewSource.View, Mode=OneWay}"
-                            ItemDeletedCommand="{x:Bind ViewModel.MailOperationCommand}"
+                                LoadMoreCommand="{x:Bind ViewModel.LoadMoreItemsCommand}"
                                 ProcessKeyboardAccelerators="ProcessMailItemKeyboardAccelerator"
                                 ScrollViewer.VerticalScrollBarVisibility="Auto">
                                 <ListView.ItemContainerTransitions>
@@ -805,6 +805,7 @@
                     Severity="{x:Bind helpers:XamlHelpers.InfoBarSeverityConverter(ViewModel.BarSeverity), Mode=OneWay}" />
 
             </Grid>
+        </Border>
 
         <!--  Mail Rendering Frame  -->
         <Frame
@@ -861,4 +862,3 @@
         </VisualStateManager.VisualStateGroups>
     </Grid>
 </abstract:MailListPageAbstract>
-

Wino.Mail/Views/MailListPage.xaml.cs

@@ -153,18 +153,24 @@ namespace Wino.Views
 
         private void UpdateAdaptiveness()
         {
-            ReaderGrid.Visibility = !(StatePersistanceService.IsReadingMail && StatePersistanceService.IsReaderNarrowed) ? Visibility.Visible : Visibility.Collapsed;
+            var readerGridVisibility = !(StatePersistanceService.IsReadingMail && StatePersistanceService.IsReaderNarrowed) ? Visibility.Visible : Visibility.Collapsed;
+            ReaderGridContainer.Visibility = readerGridVisibility;
+            ReaderGrid.Visibility = readerGridVisibility;
             RenderingFrame.Visibility = StatePersistanceService.IsReadingMail ? Visibility.Visible : (StatePersistanceService.IsReaderNarrowed ? Visibility.Collapsed : Visibility.Visible);
 
             if (RenderingFrame.Visibility == Visibility.Collapsed)
             {
                 Grid.SetColumn(ReaderGrid, 0);
                 Grid.SetColumnSpan(ReaderGrid, 2);
+                Grid.SetColumn(ReaderGridContainer, 0);
+                Grid.SetColumnSpan(ReaderGridContainer, 2);
             }
             else
             {
                 Grid.SetColumn(ReaderGrid, 0);
                 Grid.SetColumnSpan(ReaderGrid, 1);
+                Grid.SetColumn(ReaderGridContainer, 0);
+                Grid.SetColumnSpan(ReaderGridContainer, 1);
             }
 
             if (ReaderGrid.Visibility == Visibility.Collapsed)

Wino.Mail/Views/NewAccountManagementPage.xaml

@@ -4,13 +4,19 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:abstract="using:Wino.Views.Abstract"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:winuiControls="using:Microsoft.UI.Xaml.Controls"
     xmlns:helpers="using:Wino.Helpers"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:viewModelData="using:Wino.Mail.ViewModels.Data"
+    xmlns:winuiControls="using:Microsoft.UI.Xaml.Controls"
     Style="{StaticResource PageStyle}"
     mc:Ignorable="d">
 
+    <Border
+        Margin="0,0,7,7"
+        Background="{ThemeResource WinoContentZoneBackgroud}"
+        BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+        BorderThickness="1"
+        CornerRadius="7">
         <Grid
             MaxWidth="900"
             Padding="20"
@@ -23,8 +29,8 @@
 
             <winuiControls:BreadcrumbBar
                 x:Name="Breadcrumb"
-            ItemsSource="{x:Bind PageHistory, Mode=OneWay}"
-            ItemClicked="BreadItemClicked">
+                ItemClicked="BreadItemClicked"
+                ItemsSource="{x:Bind PageHistory, Mode=OneWay}">
                 <winuiControls:BreadcrumbBar.ItemTemplate>
                     <DataTemplate>
                         <winuiControls:BreadcrumbBarItem Margin="0,0,8,0">
@@ -32,9 +38,9 @@
                                 <DataTemplate x:DataType="viewModelData:BreadcrumbNavigationItemViewModel">
                                     <TextBlock
                                         Margin="0,0,8,10"
-                                    Text="{Binding Title, Mode=OneWay}"
                                         FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightBySyncState(IsActive), Mode=OneWay}"
-                                    Style="{StaticResource TitleTextBlockStyle}" />
+                                        Style="{StaticResource TitleTextBlockStyle}"
+                                        Text="{Binding Title, Mode=OneWay}" />
                                 </DataTemplate>
                             </winuiControls:BreadcrumbBarItem.ContentTemplate>
                         </winuiControls:BreadcrumbBarItem>
@@ -44,4 +50,5 @@
 
             <Frame x:Name="AccountPagesFrame" Grid.Row="1" />
         </Grid>
+    </Border>
 </abstract:NewAccountManagementPageAbstract>

Wino.Mail/Views/SettingsPage.xaml

@@ -4,13 +4,19 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:abstract="using:Wino.Views.Abstract"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:winuiControls="using:Microsoft.UI.Xaml.Controls"
     xmlns:helpers="using:Wino.Helpers"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:viewModelData="using:Wino.Mail.ViewModels.Data"
+    xmlns:winuiControls="using:Microsoft.UI.Xaml.Controls"
     Style="{StaticResource PageStyle}"
     mc:Ignorable="d">
 
+    <Border
+        Margin="0,0,7,7"
+        Background="{ThemeResource WinoContentZoneBackgroud}"
+        BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+        BorderThickness="1"
+        CornerRadius="7">
         <Grid
             MaxWidth="900"
             Padding="20"
@@ -23,8 +29,8 @@
 
             <winuiControls:BreadcrumbBar
                 x:Name="Breadcrumb"
-            ItemsSource="{x:Bind PageHistory, Mode=OneWay}"
-            ItemClicked="BreadItemClicked">
+                ItemClicked="BreadItemClicked"
+                ItemsSource="{x:Bind PageHistory, Mode=OneWay}">
                 <winuiControls:BreadcrumbBar.ItemTemplate>
                     <DataTemplate>
                         <winuiControls:BreadcrumbBarItem Margin="0,0,8,0">
@@ -32,9 +38,9 @@
                                 <DataTemplate x:DataType="viewModelData:BreadcrumbNavigationItemViewModel">
                                     <TextBlock
                                         Margin="0,0,8,10"
-                                    Text="{Binding Title}"
                                         FontWeight="{x:Bind helpers:XamlHelpers.GetFontWeightBySyncState(IsActive), Mode=OneWay}"
-                                    Style="{StaticResource TitleTextBlockStyle}" />
+                                        Style="{StaticResource TitleTextBlockStyle}"
+                                        Text="{Binding Title}" />
                                 </DataTemplate>
                             </winuiControls:BreadcrumbBarItem.ContentTemplate>
                         </winuiControls:BreadcrumbBarItem>
@@ -44,4 +50,5 @@
 
             <Frame x:Name="SettingsFrame" Grid.Row="1" />
         </Grid>
+    </Border>
 </abstract:SettingsPageAbstract>

Wino.Mail/Views/WelcomePage.xaml

@@ -1,28 +1,35 @@
 <abstract:WelcomePageAbstract
-    xmlns:abstract="using:Wino.Views.Abstract"
     x:Class="Wino.Views.WelcomePage"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:local="using:Wino.Views"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:abstract="using:Wino.Views.Abstract"
     xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:local="using:Wino.Views"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d">
 
+    <Border
+        Margin="0,0,7,7"
+        Background="{ThemeResource WinoContentZoneBackgroud}"
+        BorderBrush="{StaticResource CardStrokeColorDefaultBrush}"
+        BorderThickness="1"
+        CornerRadius="7">
         <Grid Padding="24">
             <ScrollViewer>
                 <controls:MarkdownTextBlock
                     x:Name="MarkdownControl"
-                LinkClicked="HyperlinkClicked"
                     Background="Transparent"
-                ImageStretch="UniformToFill"
-                Text="{x:Bind ViewModel.CurrentVersionNotes, Mode=OneWay}"
-                ListBulletSpacing="10"
-                Header1FontSize="30"
                     CharacterSpacing="12"
                     FontSize="16"
-                Header2FontSize="22" />
+                    Header1FontSize="30"
+                    Header2FontSize="22"
+                    ImageStretch="UniformToFill"
+                    LinkClicked="HyperlinkClicked"
+                    ListBulletSpacing="10"
+                    Text="{x:Bind ViewModel.CurrentVersionNotes, Mode=OneWay}" />
             </ScrollViewer>
         </Grid>
+    </Border>
 
 </abstract:WelcomePageAbstract>