FoxTube/FoxTube/Pages/MainPage.xaml

<Page
    x:Class="FoxTube.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    xmlns:ui="using:Microsoft.UI.Xaml.Controls"
    xmlns:controls="using:FoxTube.Controls">

	<Page.Resources>


		<Style x:Key="HeaderActionButton" TargetType="Button" BasedOn="{StaticResource ButtonRevealStyle}">
			<Setter Property="Background" Value="Transparent" />
			<Setter Property="CornerRadius" Value="0" />
			<Setter Property="VerticalAlignment" Value="Top" />
			<Setter Property="Height" Value="32" />
			<Setter Property="Width" Value="40" />
			<Setter Property="Padding" Value="0" />
			<Setter Property="FontFamily" Value="Segoe MDL2 Assets" />
			<Setter Property="FontSize" Value="15" />
			<Setter Property="HorizontalContentAlignment" Value="Center" />
			<Setter Property="VerticalContentAlignment" Value="Center" />
		</Style>
	</Page.Resources>

    <Grid Name="grid">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState>
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{x:Bind nav.CompactModeThresholdWidth}"/>
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="Title.Margin" Value="0"/>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

		<Button VerticalAlignment="Top" HorizontalAlignment="Left" Margin="40,0,0,0" Width="40" Height="40" Padding="0" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" Canvas.ZIndex="2" Background="Transparent" CornerRadius="0" Click="PaneToggle"/>

		<Border x:Name="AppTitleBar"
				Margin="80,0,500,0"
				Height="40"
                IsHitTestVisible="True"
                VerticalAlignment="Top"
                Background="Transparent"
                Canvas.ZIndex="1">

            <TextBlock x:Name="AppTitle"
                       Text="FoxTube (v2.0 Preview 1)"
                       VerticalAlignment="Center"
                           Margin="12,0"
                       Style="{StaticResource CaptionTextBlockStyle}" />
        </Border>

		<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,350,0">
			<Button Style="{StaticResource HeaderActionButton}" x:Uid="/Main/feedback" Name="feedback" Click="Feedback_Click" Visibility="Visible" FontFamily="Segoe MDL2 Assets" Content="&#xED15;"/>
			<Button Style="{StaticResource HeaderActionButton}" x:Uid="/Main/signIn" Name="account" Click="SignIn_Click" Visibility="Collapsed" FontFamily="Segoe MDL2 Assets" Content="&#xE8FA;" />
			<Button Style="{StaticResource HeaderActionButton}" Background="Transparent" Visibility="Collapsed" Name="avatar" Padding="0">
				<Button.Flyout>
					<Flyout>
						<Grid>
							<Grid.ColumnDefinitions>
								<ColumnDefinition Width="auto"/>
								<ColumnDefinition/>
							</Grid.ColumnDefinitions>
							<PersonPicture Width="65" Name="avatarFlyout" VerticalAlignment="Top"/>
							<StackPanel Grid.Column="1" Margin="5">
								<TextBlock Name="myNameFlyout"/>
								<TextBlock Style="{StaticResource CaptionTextBlockStyle}" Name="myEmail"/>
								<HyperlinkButton x:Uid="/Main/signOut" Content="Log out" Click="Logout_Click"/>
								<ToggleSwitch OnContent="Incognito mode" OffContent="Incognito mode" Toggled="IncognitoToggle"/>
							</StackPanel>
						</Grid>
					</Flyout>
				</Button.Flyout>
				<Ellipse Width="25" Height="25">
					<Ellipse.Fill>
						<ImageBrush ImageSource="/Assets/Icons/profile.png"/>
					</Ellipse.Fill>
				</Ellipse>
			</Button>
		</StackPanel>

		<ui:NavigationView IsTitleBarAutoPaddingEnabled="False" IsPaneToggleButtonVisible="False" SelectedItem="toHome" BackRequested="Nav_BackRequested" PaneClosing="Nav_PaneClosing" PaneOpened="Nav_PaneOpened" OpenPaneLength="350" Name="nav" SelectionChanged="Nav_SelectionChanged">
			<ui:NavigationView.Header>
				<Grid Visibility="Collapsed">
					<TextBlock Name="Title" Style="{StaticResource TitleTextBlockStyle}"/>
				</Grid>
			</ui:NavigationView.Header>

			<ui:NavigationView.MenuItems>
				<ui:NavigationViewItem x:Uid="/Main/home" Icon="Home" Content="Home" Name="toHome"/>
                <ui:NavigationViewItem x:Uid="/Main/myChannel" Icon="Contact" Content="My channel" Name="toChannel" Visibility="Collapsed"/>
                <!--<ui:NavigationViewItem x:Uid="/Main/subscriptions" Icon="People" Content="Subscriptions" Name="toSubscriptions" Visibility="Collapsed"/>-->
                <ui:NavigationViewItemHeader x:Uid="/Main/myLibrary" FontSize="14" Content="My library" Name="libHeader" Visibility="Collapsed"/>
                <ui:NavigationViewItem x:Uid="/Main/history" Content="History" Name="toHistory" Visibility="Collapsed">
                    <ui:NavigationViewItem.Icon>
                        <FontIcon Glyph="&#xE81C;"/>
                    </ui:NavigationViewItem.Icon>
                </ui:NavigationViewItem>
                <ui:NavigationViewItem x:Uid="/Main/liked" Icon="Like" Content="Liked videos" Name="toLiked" Visibility="Collapsed"/>
                <ui:NavigationViewItem x:Uid="/Main/later" Icon="Clock" Content="Watch later" Name="toLater" Visibility="Collapsed"/>
                <ui:NavigationViewItem x:Uid="/Main/downloads" Icon="Download" Content="Downloads" Name="toDownloads"/>
				<ui:NavigationViewItem x:Uid="/Main/subscriptions" Icon="People" FontSize="14" Content="Subscriptions" Name="subsHeader" Visibility="Collapsed"/>
			</ui:NavigationView.MenuItems>

            <ui:NavigationView.PaneFooter>
                <ui:NavigationViewItem Content="Remove ads" Visibility="Collapsed" Tapped="RemoveAds_Tapped" Name="removeAds">
                    <ui:NavigationViewItem.Icon>
                        <FontIcon Glyph="&#xE14D;"/>
                    </ui:NavigationViewItem.Icon>
                </ui:NavigationViewItem>
            </ui:NavigationView.PaneFooter>

            <ui:NavigationView.AutoSuggestBox>
                <AutoSuggestBox x:Name="search" QueryIcon="Find" QuerySubmitted="Search_QuerySubmitted" TextChanged="Search_TextChanged" x:Uid="/Main/searchPlaceholder" PlaceholderText="Search"/>
            </ui:NavigationView.AutoSuggestBox>

            <Grid Margin="0,-24,0,0">
                <controls:ContentFrame x:Name="content" Navigated="Content_Navigated"/>
                <controls:ContentFrame x:Name="videoPlaceholder"/>
            </Grid>

        </ui:NavigationView>
    </Grid>
</Page>