FlyTeam/SkyTeam/HomePage.xaml

<Page x:Class="SkyTeam.NavigationPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
      xmlns:properties="clr-namespace:SkyTeam"
      Title="NavigationPage"
      Background="{DynamicResource PageBackground}">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="180"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Border Grid.Row="0" Grid.ColumnSpan="2" Background="#FF1E88E5" Padding="15">
            <StackPanel Orientation="Horizontal">
                <Ellipse Width="36" Height="36" Fill="White" Margin="0,0,10,0"/>
                <StackPanel>
                    <TextBlock Text="{x:Static properties:Resources.HeaderTitle}" FontSize="20" FontWeight="Bold" Foreground="White"/>
                    <TextBlock Text="{x:Static properties:Resources.HeaderSubtitle}" FontSize="12" Foreground="White"/>
                </StackPanel>
            </StackPanel>
        </Border>

        <StackPanel Grid.Row="1" Grid.Column="0" Background="{DynamicResource SidebarBackground}">

            <Button x:Name="HomeButton" Height="50" Margin="5" Click="HomeButton_Click" Background="{DynamicResource CardBackground}" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Home" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarHome}" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button x:Name="BookingsButton" Height="50" Margin="5" Click="BookingsButton_Click" Background="Transparent" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Airplane" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarBookings}" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button x:Name="SettingsButton" Height="50" Margin="5" Click="SettingsButton_Click" Background="Transparent" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Cog" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarSettings}" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button x:Name="LogoutButton" Height="50" Margin="5" Background="#FFEBEB" BorderBrush="#FFB71C1C" Foreground="#D32F2F" FontWeight="Bold" Click="LogoutButton_Click">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Logout" Width="20" Margin="0,0,10,0"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarLogout}"/>
                </StackPanel>
            </Button>
        </StackPanel>

        <ScrollViewer Grid.Row="1" Grid.Column="1" Margin="30" VerticalScrollBarVisibility="Auto">
            <StackPanel Margin="0,0,0,30">

                <StackPanel Orientation="Horizontal" Margin="0,0,0,30">
                    <iconPacks:PackIconMaterial Kind="AirplaneTakeoff" Width="48" Height="48" Foreground="{DynamicResource PrimaryText}" Margin="0,0,15,0"/>
                    <StackPanel>
                        <TextBlock Text="{x:Static properties:Resources.WelcomeTitle}" FontSize="28" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}"/>
                        <TextBlock Text="{x:Static properties:Resources.WelcomeSubtitle}" FontSize="16" Foreground="{DynamicResource SecondaryText}"/>
                    </StackPanel>
                </StackPanel>

                <Border Background="{DynamicResource CardBackground}" Padding="25" CornerRadius="8" Margin="0,0,0,25">
                    <TextBlock Text="{x:Static properties:Resources.WelcomeDescription}"
                               FontSize="14" LineHeight="22" TextWrapping="Wrap" Foreground="{DynamicResource PrimaryText}"/>
                </Border>

                <TextBlock Text="{x:Static properties:Resources.ServicesTitle}" FontSize="20" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}" Margin="0,0,15,0"/>

                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Border Grid.Column="0" Margin="0,0,15,0" Padding="20" Background="{DynamicResource CardBackground}" CornerRadius="8">
                        <StackPanel>
                            <iconPacks:PackIconMaterial Kind="AccountGroup" Width="32" Height="32" Foreground="#1E88E5"/>
                            <TextBlock Text="{x:Static properties:Resources.ServicePersonalSupport}" FontSize="16" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}" Margin="0,10,0,5"/>
                            <TextBlock Text="{x:Static properties:Resources.ServicePersonalSupportDesc}" FontSize="13" Foreground="{DynamicResource SecondaryText}" TextWrapping="Wrap"/>
                        </StackPanel>
                    </Border>

                    <Border Grid.Column="1" Padding="20" Background="{DynamicResource CardBackground}" CornerRadius="8">
                        <StackPanel>
                            <iconPacks:PackIconMaterial Kind="Database" Width="32" Height="32" Foreground="#388E3C"/>
                            <TextBlock Text="{x:Static properties:Resources.ServiceDataSecurity}" FontSize="16" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}" Margin="0,10,0,5"/>
                            <TextBlock Text="{x:Static properties:Resources.ServiceDataSecurityDesc}" FontSize="13" Foreground="{DynamicResource SecondaryText}" TextWrapping="Wrap"/>
                        </StackPanel>
                    </Border>
                </Grid>

                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,40,0,0">
                    <Button Width="200" Height="50" Background="#FF1E88E5" Foreground="White" FontSize="16" FontWeight="Bold" Click="BookFlightButton_Click">
                        <StackPanel Orientation="Horizontal">
                            <iconPacks:PackIconMaterial Kind="Airplane" Width="24" Height="24" Margin="0,0,12,0"/>
                            <TextBlock Text="{x:Static properties:Resources.BookFlightButton}"/>
                        </StackPanel>
                    </Button>
                </StackPanel>

            </StackPanel>
        </ScrollViewer>
    </Grid>
</Page>