Updated section

Author: yaira2

src/Files.App.Controls/Sidebar/SidebarView.Properties.cs

@@ -21,6 +21,14 @@ public UIElement InnerContent
 		public static readonly DependencyProperty InnerContentProperty =
 			DependencyProperty.Register(nameof(InnerContent), typeof(UIElement), typeof(SidebarView), new PropertyMetadata(null));
 
+		public UIElement SidebarContent
+		{
+			get { return (UIElement)GetValue(SidebarContentProperty); }
+			set { SetValue(SidebarContentProperty, value); }
+		}
+		public static readonly DependencyProperty SidebarContentProperty =
+			DependencyProperty.Register("SidebarContent", typeof(UIElement), typeof(SidebarView), new PropertyMetadata(null));
+
 		public UIElement Footer
 		{
 			get { return (UIElement)GetValue(FooterProperty); }

src/Files.App.Controls/Sidebar/SidebarView.xaml

@@ -57,6 +57,15 @@
 				<CompositeTransform x:Name="PaneColumnGridTransform" />
 			</Grid.RenderTransform>
 
+			<!--  Content  -->
+			<ContentPresenter
+				Grid.RowSpan="2"
+				HorizontalAlignment="Stretch"
+				VerticalAlignment="Stretch"
+				HorizontalContentAlignment="Stretch"
+				VerticalContentAlignment="Stretch"
+				Content="{x:Bind SidebarContent, Mode=OneWay}" />
+
 			<!--  Menu Items  -->
 			<ItemsRepeaterScrollHost HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
 				<ScrollViewer

src/Files.App/Assets/Sidebar/EmptySidebar_100_ThemeDark.svg

@@ -4193,10 +4193,7 @@
   <data name="EnableOmnibar" xml:space="preserve">
     <value>Enable Omnibar</value>
   </data>
-  <data name="SectionsHidden" xml:space="preserve">
-    <value>Sections hidden</value>
-  </data>  
   <data name="SectionsHiddenMessage" xml:space="preserve">
-    <value>You can add the sections back by right-clicking the sidebar area and selecting the sections you want to add.</value>
+    <value>You can add sections to the sidebar by right-clicking and selecting the sections you want to add.</value>
   </data>
 </root>

src/Files.App/Assets/Sidebar/EmptySidebar_100_ThemeLight.svg

@@ -31,6 +31,24 @@
 				<ResourceDictionary Source="ms-appx:///Styles/DefaultGridSplitterStyle.xaml" />
 			</ResourceDictionary.MergedDictionaries>
 
+			<ResourceDictionary.ThemeDictionaries>
+				<ResourceDictionary x:Key="Light">
+					<ImageSource x:Key="EmptySidebar.48">ms-appx:///Assets/Sidebar/EmptySidebar_48_ThemeLight.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.100">ms-appx:///Assets/Sidebar/EmptySidebar_100_ThemeLight.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.200">ms-appx:///Assets/Sidebar/EmptySidebar_200_ThemeLight.svg</ImageSource>
+				</ResourceDictionary>
+				<ResourceDictionary x:Key="Dark">
+					<ImageSource x:Key="EmptySidebar.48">ms-appx:///Assets/Sidebar/EmptySidebar_48_ThemeDark.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.100">ms-appx:///Assets/Sidebar/EmptySidebar_100_ThemeDark.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.200">ms-appx:///Assets/Sidebar/EmptySidebar_200_ThemeDark.svg</ImageSource>
+				</ResourceDictionary>
+				<ResourceDictionary x:Key="HighContrast">
+					<ImageSource x:Key="EmptySidebar.48">ms-appx:///Assets/Sidebar/EmptySidebar_48_ThemeDark.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.100">ms-appx:///Assets/Sidebar/EmptySidebar_100_ThemeDark.svg</ImageSource>
+					<ImageSource x:Key="EmptySidebar.200">ms-appx:///Assets/Sidebar/EmptySidebar_200_ThemeDark.svg</ImageSource>
+				</ResourceDictionary>
+			</ResourceDictionary.ThemeDictionaries>
+
 			<x:Boolean x:Key="True">True</x:Boolean>
 			<x:Boolean x:Key="False">False</x:Boolean>
 
@@ -259,14 +277,33 @@
 				</Grid>
 			</controls:SidebarView.InnerContent>
 
+			<!--  Sidebar Content  -->
+			<controls:SidebarView.SidebarContent>
+				<StackPanel
+					x:Name="SidebarContent"
+					Padding="16,0,16,0"
+					VerticalAlignment="Center"
+					Orientation="Vertical"
+					Spacing="16"
+					Visibility="{x:Bind SidebarAdaptiveViewModel.AreSectionsHidden, Mode=OneWay}">
+
+					<Image
+						x:Name="EmptySidebarImage"
+						MaxHeight="48"
+						Source="{ThemeResource EmptySidebar.48}" />
+
+					<TextBlock
+						Foreground="{ThemeResource TextFillColorTertiaryBrush}"
+						Style="{StaticResource App.Theme.CaptionTextBlockStyle}"
+						Text="{helpers:ResourceString Name=SectionsHiddenMessage}"
+						TextAlignment="Center" />
+
+				</StackPanel>
+			</controls:SidebarView.SidebarContent>
+
+			<!--  Footer  -->
 			<controls:SidebarView.Footer>
 				<StackPanel Padding="4" Spacing="4">
-					<InfoBar
-						Title="{helpers:ResourceString Name=SectionsHidden}"
-						IsClosable="False"
-						IsOpen="{x:Bind SidebarAdaptiveViewModel.AreSectionsHidden, Mode=OneWay}"
-						Message="{helpers:ResourceString Name=SectionsHiddenMessage}" />
-
 					<Border
 						Height="1"
 						HorizontalAlignment="Stretch"
@@ -328,6 +365,21 @@
 		</controls:SidebarView>
 
 		<VisualStateManager.VisualStateGroups>
+			<VisualStateGroup x:Name="SidebarWidthStates">
+				<VisualState x:Name="NarrowSidebarWidthState">
+					<VisualState.Setters>
+						<Setter Target="EmptySidebarImage.MaxHeight" Value="48" />
+						<Setter Target="EmptySidebarImage.Source" Value="{ThemeResource EmptySidebar.48}" />
+					</VisualState.Setters>
+				</VisualState>
+				<VisualState x:Name="WideSidebarWidthState">
+					<VisualState.Setters>
+						<Setter Target="EmptySidebarImage.MaxHeight" Value="100" />
+						<Setter Target="EmptySidebarImage.Source" Value="{ThemeResource EmptySidebar.100}" />
+					</VisualState.Setters>
+				</VisualState>
+			</VisualStateGroup>
+			
 			<VisualStateGroup>
 				<VisualState>
 					<VisualState.StateTriggers>
@@ -343,6 +395,7 @@
 					</VisualState.Setters>
 				</VisualState>
 			</VisualStateGroup>
+			
 			<VisualStateGroup>
 				<VisualState x:Name="NormalSidebarState">
 					<VisualState.StateTriggers>