Groups left collapsed menu now has a tooltip

Groups design changes: border now only around icon
Entry password reveal checkbox now works with XAML and converters

ModernKeePass/App.xaml

@@ -2,7 +2,7 @@
     x:Class="ModernKeePass.App"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    RequestedTheme="Dark">
+    RequestedTheme="Light">
     <Application.Resources>
         <Style TargetType="ToggleButton" x:Name="HamburgerToggleButton">
             <Setter Property="Template">

ModernKeePass/Converters/InverseBooleanToVisibilityConverter.cs

@@ -0,0 +1,28 @@
+using System;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Data;
+
+namespace ModernKeePass.Converters
+{
+    public class InverseBooleanToVisibilityConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, string language)
+        {
+            var boolean = value is bool ? (bool)value : false;
+            return boolean ? Visibility.Collapsed : Visibility.Visible;
+        }
+
+        // No need to implement this
+        public object ConvertBack(object value, Type targetType, object parameter, string language)
+        {
+            var visibility = value is Visibility ? (Visibility)value : Visibility.Visible;
+            switch (visibility)
+            {
+                case Visibility.Visible: return false;
+                case Visibility.Collapsed: return true;
+                default:
+                    throw new ArgumentOutOfRangeException();
+            }
+        }
+    }
+}

ModernKeePass/MainPage.xaml

@@ -26,7 +26,7 @@
         </Grid.ColumnDefinitions>
         <controls:ListViewWithDisable Grid.Column="0" 
             x:Name="MenuListView"
-            RequestedTheme="Light"
+            RequestedTheme="Dark"
             SelectionChanged="ListView_SelectionChanged" 
             Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
             ItemsSource="{Binding Source={StaticResource MenuItemsSource}}"
@@ -45,6 +45,7 @@
             <ListView.ItemContainerStyle>
                 <Style TargetType="ListViewItem">
                     <Setter Property="Padding" Value="20,5,0,0" />
+                    <Setter Property="Margin" Value="0" />
                 </Style>
             </ListView.ItemContainerStyle>
             <ListView.GroupStyle>

ModernKeePass/Mappings/PwIconToSegoeMapping.cs

@@ -33,7 +33,7 @@ namespace ModernKeePass.Mappings
                 case PwIcon.Configuration: return Symbol.Setting;
                 case PwIcon.ClipboardReady: return Symbol.Paste;
                 case PwIcon.PaperNew: return Symbol.Page2;
-                //case PwIcon.Screen: return Symbol.Document;
+                case PwIcon.Screen: return Symbol.GoToStart;
                 case PwIcon.EnergyCareful: return Symbol.FourBars;
                 case PwIcon.Disk: return Symbol.Save;
                 //case PwIcon.Drive: return Symbol.;

ModernKeePass/ModernKeePass.csproj

@@ -123,6 +123,7 @@
     </Compile>
     <Compile Include="Converters\BooleanToVisibilityConverter.cs" />
     <Compile Include="Converters\ColorToBrushConverter.cs" />
+    <Compile Include="Converters\InverseBooleanToVisibilityConverter.cs" />
     <Compile Include="Converters\PluralizationConverter.cs" />
     <Compile Include="Interfaces\IIsEnabled.cs" />
     <Compile Include="MainPage.xaml.cs">

ModernKeePass/Pages/EntryDetailPage.xaml

@@ -6,10 +6,16 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:ViewModels="using:ModernKeePass.ViewModels"
+    xmlns:Converters="using:ModernKeePass.Converters"
     x:Name="pageRoot"
     x:Class="ModernKeePass.Pages.EntryDetailPage"
     mc:Ignorable="d">
 
+    <Page.Resources>
+        <Converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
+        <Converters:InverseBooleanToVisibilityConverter x:Key="InverseBooleanToVisibilityConverter"/>
+    </Page.Resources>
+
     <Page.DataContext>
         <ViewModels:EntryVm/>
     </Page.DataContext>
@@ -34,9 +40,9 @@
             <TextBlock x:Name="userTextBlock"  TextWrapping="Wrap" Text="User name or login" FontSize="18"/>
             <TextBox x:Name="userTextBox" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding UserName, Mode=TwoWay}" Width="350" />
             <TextBlock x:Name="passwordTextBlock" TextWrapping="Wrap" Text="Password"  FontSize="18"/>
-            <PasswordBox x:Name="passwordBox" HorizontalAlignment="Left" Password="{Binding Password, Mode=TwoWay}" Width="350" IsPasswordRevealButtonEnabled="True" />
+            <PasswordBox x:Name="passwordBox" HorizontalAlignment="Left" Password="{Binding Password, Mode=TwoWay}" Width="350" IsPasswordRevealButtonEnabled="True" Visibility="{Binding IsRevealPassword, Converter={StaticResource InverseBooleanToVisibilityConverter}}" />
-            <TextBox x:Name="passwordTextBox" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Password, Mode=TwoWay}" Width="350" Visibility="Collapsed"/>
+            <TextBox x:Name="passwordTextBox" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Password, Mode=TwoWay}" Width="350" Visibility="{Binding IsRevealPassword, Converter={StaticResource BooleanToVisibilityConverter}}" />
-            <CheckBox x:Name="checkBox" HorizontalAlignment="Left" Margin="-3,0,0,0" Content="Show password" Checked="checkBox_Checked" Unchecked="checkBox_Unchecked" />
+            <CheckBox x:Name="checkBox" HorizontalAlignment="Left" Margin="-3,0,0,0" Content="Show password" IsChecked="{Binding IsRevealPassword, Mode=TwoWay}"/>
             <TextBlock x:Name="urlTextBlock" TextWrapping="Wrap" Text="URL" FontSize="18"/>
             <TextBox x:Name="urlTextBox" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Url, Mode=TwoWay}" Width="350" MaxLength="256" />
             <TextBlock x:Name="notesTextBlock" TextWrapping="Wrap" Text="Notes" FontSize="18"/>
@@ -65,7 +71,7 @@
                 TextWrapping="NoWrap" 
                 VerticalAlignment="Center" 
                 Margin="0,0,30,0"/>
-            <CommandBar Grid.Column="2" Margin="0,40,0,0" Background="Transparent" IsOpen="True">
+            <CommandBar Grid.Column="2" Background="Transparent" IsOpen="True" VerticalAlignment="Center" Margin="0,20,0,0">
                 <AppBarToggleButton Icon="Edit" Label="Edit" IsChecked="{Binding IsEditMode, Mode=TwoWay}" />
                 <AppBarButton Icon="Delete" Label="Delete" Click="AppBarButton_Click" />
             </CommandBar>

ModernKeePass/Pages/EntryDetailPage.xaml.cs

@@ -70,18 +70,6 @@ namespace ModernKeePass.Pages
 
         #endregion
         
-        private void checkBox_Checked(object sender, RoutedEventArgs e)
-        {
-            passwordBox.Visibility = Visibility.Collapsed;
-            passwordTextBox.Visibility = Visibility.Visible;
-        }
-
-        private void checkBox_Unchecked(object sender, RoutedEventArgs e)
-        {
-            passwordBox.Visibility = Visibility.Visible;
-            passwordTextBox.Visibility = Visibility.Collapsed;
-        }
-
         private void AppBarButton_Click(object sender, RoutedEventArgs e)
         {
             var entry = DataContext as EntryVm;

ModernKeePass/Pages/GroupDetailPage.xaml

@@ -54,31 +54,39 @@
                             <Border 
                                 BorderThickness="2" 
                                 BorderBrush="{StaticResource SystemColor}" 
-                                Background="{StaticResource HubSectionHeaderPressedForegroundThemeBrush}" 
+                                Background="{StaticResource HubSectionHeaderPressedForegroundThemeBrush}">
-                                Margin="0,10,0,0" >
                                 <Grid Height="110" Width="480">
                                     <Grid.ColumnDefinitions>
                                         <ColumnDefinition Width="Auto"/>
                                         <ColumnDefinition Width="*"/>
                                     </Grid.ColumnDefinitions>
-                                    <SymbolIcon Grid.Column="0" Symbol="{Binding IconSymbol}" Width="100" Height="100" />
+                                    <SymbolIcon Grid.Column="0" Symbol="{Binding IconSymbol}" Width="100" Height="100" RenderTransformOrigin="0.5,0.5" >
+                                        <SymbolIcon.RenderTransform>
+                                            <CompositeTransform ScaleX="2" TranslateX="0" TranslateY="0" ScaleY="2"/>
+                                        </SymbolIcon.RenderTransform>
+                                    </SymbolIcon>
                                     <TextBlock Grid.Column="1" Text="{Binding Title}" FontWeight="Bold" Style="{ThemeResource TitleTextBlockStyle}" TextWrapping="NoWrap" VerticalAlignment="Center" Margin="13,0,0,5"/>
                                 </Grid>
                             </Border>
                         </DataTemplate>
                         <DataTemplate x:Name="GroupOtherItem">
-                            <Border 
-                                BorderThickness="2" 
-                                BorderBrush="{StaticResource SystemColor}"
-                                Background="{Binding BackgroundColor, ConverterParameter={StaticResource Transparent}, Converter={StaticResource ColorToBrushConverter}}" 
-                                Margin="0,10,0,0" >
                             <Grid Height="110" Width="480" >
                                 <Grid.ColumnDefinitions>
                                     <ColumnDefinition Width="Auto"/>
                                     <ColumnDefinition Width="*"/>
                                 </Grid.ColumnDefinitions>
-                                    <SymbolIcon Grid.Column="0" Symbol="{Binding IconSymbol}" Width="100" Height="100" />
+                                <Border 
-                                    <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="10,0,0,0" >
+                                    Grid.Column="0" 
+                                    BorderThickness="2" 
+                                    BorderBrush="{StaticResource SystemColor}"
+                                    Background="{Binding BackgroundColor, ConverterParameter={StaticResource Transparent}, Converter={StaticResource ColorToBrushConverter}}">
+                                    <SymbolIcon Symbol="{Binding IconSymbol}" Width="100" Height="100" RenderTransformOrigin="0.5,0.5" >
+                                        <SymbolIcon.RenderTransform>
+                                            <CompositeTransform ScaleX="2" TranslateX="0" TranslateY="0" ScaleY="2"/>
+                                        </SymbolIcon.RenderTransform>
+                                    </SymbolIcon>
+                                </Border>
+                                <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="10,10,0,0" >
                                         <TextBlock Text="{Binding Title}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="NoWrap" Foreground="{Binding ForegroundColor, ConverterParameter={StaticResource TextBoxForegroundThemeBrush}, Converter={StaticResource ColorToBrushConverter}}"/>
                                         <TextBlock Style="{StaticResource CaptionTextBlockStyle}" TextWrapping="NoWrap"/>
                                         <!--<TextBlock Text="{Binding EntryCount, ConverterParameter=entry\,entries, Converter={StaticResource PluralizationConverter}}" Style="{StaticResource BodyTextBlockStyle}" MaxHeight="60" />
@@ -87,7 +95,6 @@
                                         <TextBlock Text="{Binding Url}" Style="{StaticResource BodyTextBlockStyle}" MaxHeight="60" />
                                     </StackPanel>
                                 </Grid>
-                            </Border>
                         </DataTemplate>
                     </GridView.Resources>
                     <GridView.ItemsSource>
@@ -113,15 +120,16 @@
                             IsSwipeEnabled="false"
                             IsSynchronizedWithCurrentItem="False"
                             DataContext="{Binding DataContext, ElementName=PageRoot}" 
-                            RequestedTheme="Light"
+                            RequestedTheme="Dark"
                             Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
                             Foreground="{ThemeResource DefaultTextForegroundThemeBrush}">
                             <ListView.Resources>
                                 <DataTemplate x:Name="Collapsed">
-                                    <SymbolIcon Symbol="{Binding IconSymbol}" />
+                                    <SymbolIcon Symbol="{Binding IconSymbol}">
                                         <ToolTipService.ToolTip>
                                             <ToolTip Content="{Binding Name}" />
                                         </ToolTipService.ToolTip>
+                                    </SymbolIcon>
                                 </DataTemplate>
                                 <DataTemplate x:Name="Expanded">
                                     <StackPanel Orientation="Horizontal">
@@ -136,9 +144,6 @@
                             </ListView.ItemsSource>
                             <ListView.ItemContainerStyle>
                                 <Style TargetType="ListViewItem">
-                                    <!--<Setter Property="HorizontalContentAlignment" Value="Stretch" />
-                                    <Setter Property="Padding" Value="0"/>
-                                    <Setter Property="BorderThickness" Value="0"/>-->
                                     <Setter Property="VerticalContentAlignment" Value="Stretch" />
                                     <Setter Property="Padding" Value="20,0,0,0"/>
                                     <Setter Property="Margin" Value="0"/>
@@ -201,11 +206,7 @@
                 TextWrapping="NoWrap" 
                 VerticalAlignment="Center" 
                 Margin="0,0,30,0"/>
-            <CommandBar 
+            <CommandBar Grid.Column="2" Background="Transparent" IsOpen="True" VerticalAlignment="Center" Margin="0,20,0,0">
-                Grid.Column="2" 
-                Margin="0,40,0,0" 
-                Background="Transparent" 
-                IsOpen="True">
                 <AppBarToggleButton Icon="Edit" Label="Edit" IsChecked="{Binding IsEditMode, Mode=TwoWay}" />
                 <AppBarButton Icon="Delete" Label="Delete" IsEnabled="{Binding IsNotRoot}" Click="AppBarButton_Click" />
             </CommandBar>

ModernKeePass/Pages/RecentDatabasesPage.xaml

@@ -25,7 +25,7 @@
         SelectedItem="{Binding SelectedItem, Mode=TwoWay}">
         <ListView.ItemTemplate>
             <DataTemplate>
-                <StackPanel>
+                <StackPanel Margin="10,0,10,0">
                     <TextBlock Text="{Binding Name}" Width="350" Padding="5" />
                     <local:OpenDatabaseUserControl Visibility="{Binding IsSelected, Converter={StaticResource BooleanToVisibilityConverter}}" ValidationChecked="PasswordUserControl_PasswordChecked" />
                 </StackPanel>

ModernKeePass/ViewModels/EntryVm.cs

@@ -61,7 +61,14 @@ namespace ModernKeePass.ViewModels
             set { SetProperty(ref _isEditMode, value); }
         }
 
+        public bool IsRevealPassword
+        {
+            get { return _isRevealPassword; }
+            set { SetProperty(ref _isRevealPassword, value); }
+        }
+
         private bool _isEditMode;
+        private bool _isRevealPassword;
 
         public EntryVm() { }
         public EntryVm(PwEntry entry, GroupVm parent)