From 1c8e88f660552b9e8edd213c1bffeddc99bde938 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 6 Dec 2024 14:35:15 +0100
Subject: [PATCH 1/9] Add button

---
 WinUIGallery/Controls/PageHeader.xaml | 201 +++++++++++++++++---------
 WinUIGallery/ItemPage.xaml            |  85 ++++-------
 2 files changed, 155 insertions(+), 131 deletions(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 8205084a5..7cc937f22 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -17,13 +17,18 @@
             x:Name="collectionConverter"
             EmptyValue="Collapsed"
             NotEmptyValue="Visible" />
+        <Style
+            x:Key="CustomFlyoutPresenterStyle"
+            BasedOn="{StaticResource DefaultFlyoutPresenterStyle}"
+            TargetType="FlyoutPresenter">
+            <Setter Property="MinWidth" Value="420" />
+            <Setter Property="MaxWidth" Value="800" />
+        </Style>
     </UserControl.Resources>
     <Grid x:Name="headerGrid">
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
-            <RowDefinition Height="Auto" />
-            <RowDefinition Height="Auto" />
         </Grid.RowDefinitions>
         <TextBlock
             Grid.Row="0"
@@ -32,17 +37,9 @@
             Text="{x:Bind Item.Title}"
             TextTrimming="CharacterEllipsis"
             TextWrapping="NoWrap" />
-        <TextBlock
-            x:Name="NamespaceTextBlock"
-            Grid.Row="1"
-            Margin="0,4,0,0"
-            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-            IsTextSelectionEnabled="True"
-            Style="{StaticResource CaptionTextBlockStyle}"
-            Text="{x:Bind Item.ApiNamespace}"
-            Visibility="{x:Bind Item.ApiNamespace, Converter={StaticResource emptyStringToVisibilityConverter}}" />
-        <Grid Grid.Row="2" Margin="0,12,0,12">
+        <Grid Grid.Row="1" Margin="0,12,0,12">
             <StackPanel Orientation="Horizontal" Spacing="4">
+
                 <DropDownButton
                     AutomationProperties.Name="Documentation"
                     ToolTipService.ToolTip="Documentation"
@@ -67,9 +64,11 @@
                                 </ItemsControl.ItemsPanel>
                                 <ItemsControl.ItemTemplate>
                                     <DataTemplate x:DataType="data:ControlInfoDocLink">
-                                        <HyperlinkButton HorizontalAlignment="Stretch"
-                                                         HorizontalContentAlignment="Left"
-                                                         NavigateUri="{Binding Uri}" ToolTipService.ToolTip="{Binding Uri}">
+                                        <HyperlinkButton
+                                            HorizontalAlignment="Stretch"
+                                            HorizontalContentAlignment="Left"
+                                            NavigateUri="{Binding Uri}"
+                                            ToolTipService.ToolTip="{Binding Uri}">
                                             <TextBlock Text="{x:Bind Title}" />
                                         </HyperlinkButton>
                                     </DataTemplate>
@@ -78,19 +77,19 @@
                         </Flyout>
                     </DropDownButton.Flyout>
                 </DropDownButton>
-                <DropDownButton AutomationProperties.Name="Source code"
-                                ToolTipService.ToolTip="Source code of this sample page">
+                <DropDownButton AutomationProperties.Name="Source code" ToolTipService.ToolTip="Source code of this sample page">
                     <DropDownButton.Content>
-                        <StackPanel Orientation="Horizontal"
-                                    Spacing="8">
-                            <PathIcon Margin="-3,-3,-16,-3"
-                                      VerticalAlignment="Center"
-                                      Data="{StaticResource GitHubIconPath}">
+                        <StackPanel Orientation="Horizontal" Spacing="8">
+                            <PathIcon
+                                Margin="-3,-3,-16,-3"
+                                VerticalAlignment="Center"
+                                Data="{StaticResource GitHubIconPath}">
                                 <PathIcon.RenderTransform>
-                                    <CompositeTransform ScaleX="0.65"
-                                                        ScaleY="0.65"
-                                                        TranslateX="-5"
-                                                        TranslateY="5" />
+                                    <CompositeTransform
+                                        ScaleX="0.65"
+                                        ScaleY="0.65"
+                                        TranslateX="-5"
+                                        TranslateY="5" />
                                 </PathIcon.RenderTransform>
                             </PathIcon>
                             <TextBlock Text="Source" />
@@ -98,71 +97,129 @@
                     </DropDownButton.Content>
                     <DropDownButton.Flyout>
                         <Flyout Placement="Bottom">
-                            <StackPanel x:Name="SourcePanel"
-                                        Margin="0,-8,0,-12">
-                                <StackPanel x:Name="ControlSourcePanel"
-                                            Margin="0,0,0,4">
-                                    <StackPanel Orientation="Horizontal"
-                                                Spacing="8">
-                                        <TextBlock VerticalAlignment="Center"
-                                                   Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-                                                   Style="{StaticResource CaptionTextBlockStyle}"
-                                                   Text="Control source code" />
-                                        <Button Padding="6,5,6,6"
-                                                Style="{ThemeResource SubtleButtonStyle}"
-                                                ToolTipService.ToolTip="Source code of this control in the WinUI repository. For some controls only the XAML file is available">
-                                            <FontIcon VerticalAlignment="Center"
-                                                      FontSize="14"
-                                                      Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
-                                                      Glyph="&#xE946;" />
+                            <StackPanel x:Name="SourcePanel" Margin="0,-8,0,-12">
+                                <StackPanel x:Name="ControlSourcePanel" Margin="0,0,0,4">
+                                    <StackPanel Orientation="Horizontal" Spacing="8">
+                                        <TextBlock
+                                            VerticalAlignment="Center"
+                                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                            Style="{StaticResource CaptionTextBlockStyle}"
+                                            Text="Control source code" />
+                                        <Button
+                                            Padding="6,5,6,6"
+                                            Style="{ThemeResource SubtleButtonStyle}"
+                                            ToolTipService.ToolTip="Source code of this control in the WinUI repository. For some controls only the XAML file is available">
+                                            <FontIcon
+                                                VerticalAlignment="Center"
+                                                FontSize="14"
+                                                Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
+                                                Glyph="&#xE946;" />
                                         </Button>
                                     </StackPanel>
-                                    <HyperlinkButton x:Name="ControlSourceLink"
-                                                     HorizontalAlignment="Stretch"
-                                                     HorizontalContentAlignment="Left"
-                                                     Margin="-12,4,-12,0"
-                                                     ToolTipService.ToolTip="{x:Bind ControlSourceLink.NavigateUri, Mode=OneWay}">
+                                    <HyperlinkButton
+                                        x:Name="ControlSourceLink"
+                                        Margin="-12,4,-12,0"
+                                        HorizontalAlignment="Stretch"
+                                        HorizontalContentAlignment="Left"
+                                        ToolTipService.ToolTip="{x:Bind ControlSourceLink.NavigateUri, Mode=OneWay}">
                                         <TextBlock Text="{x:Bind Item.Title}" />
                                     </HyperlinkButton>
                                 </StackPanel>
 
                                 <MenuFlyoutSeparator Margin="-12" />
 
-                                <StackPanel Orientation="Horizontal"
-                                            Spacing="8"
-                                            Margin="0,8,0,0">
-                                    <TextBlock VerticalAlignment="Center"
-                                               Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-                                               Style="{StaticResource CaptionTextBlockStyle}"
-                                               Text="Sample page source code" />
-                                    <Button Padding="6,5,6,6"
-                                            Style="{ThemeResource SubtleButtonStyle}"
-                                            ToolTipService.ToolTip="Source code of this sample page in the WinUI Gallery repository">
-                                        <FontIcon VerticalAlignment="Center"
-                                                  FontSize="14"
-                                                  Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
-                                                  Glyph="&#xE946;" />
+                                <StackPanel
+                                    Margin="0,8,0,0"
+                                    Orientation="Horizontal"
+                                    Spacing="8">
+                                    <TextBlock
+                                        VerticalAlignment="Center"
+                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                        Style="{StaticResource CaptionTextBlockStyle}"
+                                        Text="Sample page source code" />
+                                    <Button
+                                        Padding="6,5,6,6"
+                                        Style="{ThemeResource SubtleButtonStyle}"
+                                        ToolTipService.ToolTip="Source code of this sample page in the WinUI Gallery repository">
+                                        <FontIcon
+                                            VerticalAlignment="Center"
+                                            FontSize="14"
+                                            Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
+                                            Glyph="&#xE946;" />
                                     </Button>
 
                                 </StackPanel>
-                                <HyperlinkButton x:Name="PageMarkupGitHubLink"
-                                                 HorizontalAlignment="Stretch"
-                                                 HorizontalContentAlignment="Left"
-                                                 Margin="-12,4,-12,0"
-                                                 ToolTipService.ToolTip="{x:Bind PageMarkupGitHubLink.NavigateUri, Mode=OneWay}">
+                                <HyperlinkButton
+                                    x:Name="PageMarkupGitHubLink"
+                                    Margin="-12,4,-12,0"
+                                    HorizontalAlignment="Stretch"
+                                    HorizontalContentAlignment="Left"
+                                    ToolTipService.ToolTip="{x:Bind PageMarkupGitHubLink.NavigateUri, Mode=OneWay}">
                                     <TextBlock Text="XAML" />
                                 </HyperlinkButton>
-                                <HyperlinkButton x:Name="PageCodeGitHubLink"
-                                                 HorizontalAlignment="Stretch"
-                                                 HorizontalContentAlignment="Left"
-                                                 Margin="-12,4,-12,0"
-                                                 ToolTipService.ToolTip="{x:Bind PageCodeGitHubLink.NavigateUri, Mode=OneWay}">
+                                <HyperlinkButton
+                                    x:Name="PageCodeGitHubLink"
+                                    Margin="-12,4,-12,0"
+                                    HorizontalAlignment="Stretch"
+                                    HorizontalContentAlignment="Left"
+                                    ToolTipService.ToolTip="{x:Bind PageCodeGitHubLink.NavigateUri, Mode=OneWay}">
                                     <TextBlock Text="C#" />
                                 </HyperlinkButton>
                             </StackPanel>
                         </Flyout>
                     </DropDownButton.Flyout>
                 </DropDownButton>
+                <DropDownButton AutomationProperties.Name="API" ToolTipService.ToolTip="Details of the API like inheritance and namespace">
+                    <DropDownButton.Content>
+                        <StackPanel Orientation="Horizontal" Spacing="8">
+                            <FontIcon FontSize="16" Glyph="&#xE946;" />
+                            <TextBlock Text="API" />
+                        </StackPanel>
+                    </DropDownButton.Content>
+                    <DropDownButton.Flyout>
+                        <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
+                            <StackPanel x:Name="APIPanel" Spacing="16">
+                                <StackPanel
+                                    x:Name="APISourcePanel"
+                                    Spacing="8"
+                                    Visibility="{x:Bind Item.ApiNamespace, Converter={StaticResource emptyStringToVisibilityConverter}}">
+                                    <TextBlock
+                                        VerticalAlignment="Center"
+                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                        Style="{StaticResource CaptionTextBlockStyle}"
+                                        Text="Namespace" />
+                                    <TextBlock
+                                        VerticalAlignment="Center"
+                                        FontFamily="Consolas"
+                                        IsTextSelectionEnabled="True"
+                                        Style="{StaticResource CaptionTextBlockStyle}"
+                                        Text="{x:Bind Item.ApiNamespace}" />
+                                </StackPanel>
+                                <MenuFlyoutSeparator Margin="-12,0,-12,0" />
+                                <StackPanel
+                                    x:Name="InheritanceSourcePanel"
+                                    Margin="0,0,0,4"
+                                    Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
+                                    <TextBlock
+                                        VerticalAlignment="Center"
+                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                        Style="{StaticResource CaptionTextBlockStyle}"
+                                        Text="Inheritance" />
+                                    <BreadcrumbBar IsHitTestVisible="False" ItemsSource="{x:Bind Item.BaseClasses}">
+                                        <BreadcrumbBar.ItemTemplate>
+                                            <DataTemplate x:DataType="x:String">
+                                                <TextBlock
+                                                    FontFamily="Consolas"
+                                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                                    Text="{x:Bind}" />
+                                            </DataTemplate>
+                                        </BreadcrumbBar.ItemTemplate>
+                                    </BreadcrumbBar>
+                                </StackPanel>
+                            </StackPanel>
+                        </Flyout>
+                    </DropDownButton.Flyout>
+                </DropDownButton>
             </StackPanel>
             <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                 <Button
diff --git a/WinUIGallery/ItemPage.xaml b/WinUIGallery/ItemPage.xaml
index f1bfc4f64..c172ab707 100644
--- a/WinUIGallery/ItemPage.xaml
+++ b/WinUIGallery/ItemPage.xaml
@@ -34,6 +34,32 @@
             <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />
         </Grid.RowDefinitions>
+        <controls:PageHeader
+            x:Name="pageHeader"
+            Margin="36,24,36,0"
+            Item="{x:Bind Item}" />
+
+        <!--  Content Region  -->
+        <ScrollViewer
+            x:Name="svPanel"
+            Grid.Row="1"
+            VerticalScrollBarVisibility="Auto"
+            VerticalScrollMode="Auto">
+            <Grid x:Name="contentRoot" Padding="36,0,36,36">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto" />
+                    <RowDefinition Height="*" />
+                </Grid.RowDefinitions>
+                <TextBlock
+                    x:Name="descriptionText"
+                    Grid.ColumnSpan="2"
+                    Margin="0,4,24,0"
+                    Style="{ThemeResource BodyTextBlockStyle}"
+                    Text="{x:Bind Item.Description}"
+                    Visibility="{x:Bind Item.Description, Converter={StaticResource stringVisibilityConverter}}" />
+                <Frame x:Name="contentFrame" Grid.Row="2" />
+            </Grid>
+        </ScrollViewer>
 
         <VisualStateManager.VisualStateGroups>
             <VisualStateGroup>
@@ -62,64 +88,5 @@
                 </VisualState>
             </VisualStateGroup>
         </VisualStateManager.VisualStateGroups>
-        <controls:PageHeader
-            x:Name="pageHeader"
-            Margin="36,24,36,0"
-            Item="{x:Bind Item}" />
-
-        <!--  Content Region  -->
-        <ScrollViewer
-            x:Name="svPanel"
-            Grid.Row="1"
-            VerticalScrollBarVisibility="Auto"
-            VerticalScrollMode="Auto">
-            <Grid x:Name="contentRoot" Padding="36,0,36,36">
-
-                <Grid.RowDefinitions>
-                    <RowDefinition Height="Auto" />
-                    <RowDefinition Height="Auto" />
-                    <RowDefinition Height="*" />
-                </Grid.RowDefinitions>
-
-                <TextBlock
-                    x:Name="descriptionText"
-                    Grid.ColumnSpan="2"
-                    Margin="0,4,24,0"
-                    Style="{ThemeResource BodyTextBlockStyle}"
-                    Text="{x:Bind Item.Description}"
-                    Visibility="{x:Bind Item.Description, Converter={StaticResource stringVisibilityConverter}}" />
-
-                <Grid
-                    Grid.Row="1"
-                    ColumnSpacing="8"
-                    Margin="0,8,0,0"
-                    Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
-                    <Grid.ColumnDefinitions>
-                        <ColumnDefinition Width="Auto" />
-                        <ColumnDefinition Width="*" />
-                    </Grid.ColumnDefinitions>
-                    <TextBlock
-                        Grid.Column="0"
-                        Style="{ThemeResource BodyStrongTextBlockStyle}"
-                        VerticalAlignment="Bottom"
-                        Text="Inheritance" />
-                    <BreadcrumbBar
-                        VerticalAlignment="Bottom"
-                        Grid.Column="1"
-                        IsHitTestVisible="False"
-                        ItemsSource="{x:Bind Item.BaseClasses}">
-                        <BreadcrumbBar.ItemTemplate>
-                            <DataTemplate x:DataType="x:String">
-                                <TextBlock
-                                    Style="{StaticResource CaptionTextBlockStyle}"
-                                    Text="{x:Bind}" />
-                            </DataTemplate>
-                        </BreadcrumbBar.ItemTemplate>
-                    </BreadcrumbBar>
-                </Grid>
-
-                <Frame x:Name="contentFrame" Grid.Row="2" />
-            </Grid>
-        </ScrollViewer>
     </Grid>
 </Page>

From eab093a45303d30a12982f49c782e80e7117b071 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 6 Dec 2024 15:35:51 +0100
Subject: [PATCH 2/9] Update PageHeader.xaml

---
 WinUIGallery/Controls/PageHeader.xaml | 119 +++++++++++++-------------
 1 file changed, 60 insertions(+), 59 deletions(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 7cc937f22..a5a6c2b73 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -30,16 +30,68 @@
             <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
         </Grid.RowDefinitions>
-        <TextBlock
-            Grid.Row="0"
-            AutomationProperties.AutomationId="PageHeader"
-            Style="{StaticResource TitleTextBlockStyle}"
-            Text="{x:Bind Item.Title}"
-            TextTrimming="CharacterEllipsis"
-            TextWrapping="NoWrap" />
+        <StackPanel Orientation="Horizontal" Spacing="4">
+            <TextBlock
+                Grid.Row="0"
+                AutomationProperties.AutomationId="PageHeader"
+                Style="{StaticResource TitleTextBlockStyle}"
+                Text="{x:Bind Item.Title}"
+                TextTrimming="CharacterEllipsis"
+                TextWrapping="NoWrap" />
+            <Button
+                Padding="4"
+                VerticalAlignment="Bottom"
+                AutomationProperties.Name="API details"
+                Style="{StaticResource SubtleButtonStyle}"
+                ToolTipService.ToolTip="Details of the API like inheritance and namespace">
+                <FontIcon FontSize="14" Glyph="&#xE946;" />
+                <Button.Flyout>
+                    <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
+                        <StackPanel x:Name="APIPanel" Spacing="16">
+                            <StackPanel
+                                x:Name="APISourcePanel"
+                                Spacing="8"
+                                Visibility="{x:Bind Item.ApiNamespace, Converter={StaticResource emptyStringToVisibilityConverter}}">
+                                <TextBlock
+                                    VerticalAlignment="Center"
+                                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                    Text="Namespace" />
+                                <TextBlock
+                                    VerticalAlignment="Center"
+                                    FontFamily="Consolas"
+                                    IsTextSelectionEnabled="True"
+                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                    Text="{x:Bind Item.ApiNamespace}" />
+                            </StackPanel>
+                            <MenuFlyoutSeparator Margin="-12,0,-12,0" />
+                            <StackPanel
+                                x:Name="InheritanceSourcePanel"
+                                Margin="0,0,0,4"
+                                Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
+                                <TextBlock
+                                    VerticalAlignment="Center"
+                                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                    Style="{StaticResource CaptionTextBlockStyle}"
+                                    Text="Inheritance" />
+                                <BreadcrumbBar IsHitTestVisible="False" ItemsSource="{x:Bind Item.BaseClasses}">
+                                    <BreadcrumbBar.ItemTemplate>
+                                        <DataTemplate x:DataType="x:String">
+                                            <TextBlock
+                                                FontFamily="Consolas"
+                                                Style="{StaticResource CaptionTextBlockStyle}"
+                                                Text="{x:Bind}" />
+                                        </DataTemplate>
+                                    </BreadcrumbBar.ItemTemplate>
+                                </BreadcrumbBar>
+                            </StackPanel>
+                        </StackPanel>
+                    </Flyout>
+                </Button.Flyout>
+            </Button>
+        </StackPanel>
         <Grid Grid.Row="1" Margin="0,12,0,12">
             <StackPanel Orientation="Horizontal" Spacing="4">
-
                 <DropDownButton
                     AutomationProperties.Name="Documentation"
                     ToolTipService.ToolTip="Documentation"
@@ -169,57 +221,6 @@
                         </Flyout>
                     </DropDownButton.Flyout>
                 </DropDownButton>
-                <DropDownButton AutomationProperties.Name="API" ToolTipService.ToolTip="Details of the API like inheritance and namespace">
-                    <DropDownButton.Content>
-                        <StackPanel Orientation="Horizontal" Spacing="8">
-                            <FontIcon FontSize="16" Glyph="&#xE946;" />
-                            <TextBlock Text="API" />
-                        </StackPanel>
-                    </DropDownButton.Content>
-                    <DropDownButton.Flyout>
-                        <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
-                            <StackPanel x:Name="APIPanel" Spacing="16">
-                                <StackPanel
-                                    x:Name="APISourcePanel"
-                                    Spacing="8"
-                                    Visibility="{x:Bind Item.ApiNamespace, Converter={StaticResource emptyStringToVisibilityConverter}}">
-                                    <TextBlock
-                                        VerticalAlignment="Center"
-                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-                                        Style="{StaticResource CaptionTextBlockStyle}"
-                                        Text="Namespace" />
-                                    <TextBlock
-                                        VerticalAlignment="Center"
-                                        FontFamily="Consolas"
-                                        IsTextSelectionEnabled="True"
-                                        Style="{StaticResource CaptionTextBlockStyle}"
-                                        Text="{x:Bind Item.ApiNamespace}" />
-                                </StackPanel>
-                                <MenuFlyoutSeparator Margin="-12,0,-12,0" />
-                                <StackPanel
-                                    x:Name="InheritanceSourcePanel"
-                                    Margin="0,0,0,4"
-                                    Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
-                                    <TextBlock
-                                        VerticalAlignment="Center"
-                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-                                        Style="{StaticResource CaptionTextBlockStyle}"
-                                        Text="Inheritance" />
-                                    <BreadcrumbBar IsHitTestVisible="False" ItemsSource="{x:Bind Item.BaseClasses}">
-                                        <BreadcrumbBar.ItemTemplate>
-                                            <DataTemplate x:DataType="x:String">
-                                                <TextBlock
-                                                    FontFamily="Consolas"
-                                                    Style="{StaticResource CaptionTextBlockStyle}"
-                                                    Text="{x:Bind}" />
-                                            </DataTemplate>
-                                        </BreadcrumbBar.ItemTemplate>
-                                    </BreadcrumbBar>
-                                </StackPanel>
-                            </StackPanel>
-                        </Flyout>
-                    </DropDownButton.Flyout>
-                </DropDownButton>
             </StackPanel>
             <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                 <Button

From ecbe1a7af15036822d94ae60801ced4bd13663ab Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 6 Dec 2024 16:19:20 +0100
Subject: [PATCH 3/9] Alignment fix

---
 WinUIGallery/Controls/PageHeader.xaml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index a5a6c2b73..273b00e18 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -39,6 +39,8 @@
                 TextTrimming="CharacterEllipsis"
                 TextWrapping="NoWrap" />
             <Button
+                x:Name="APIDetailsBtn"
+                Margin="0,0,0,1"
                 Padding="4"
                 VerticalAlignment="Bottom"
                 AutomationProperties.Name="API details"

From fb468117b8383fff61b81b38e1561505dcf8a837 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 6 Dec 2024 16:26:47 +0100
Subject: [PATCH 4/9] Hide button when there's no data

---
 WinUIGallery/Controls/PageHeader.xaml    | 1 +
 WinUIGallery/Controls/PageHeader.xaml.cs | 8 ++++++++
 2 files changed, 9 insertions(+)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 273b00e18..516117954 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -10,6 +10,7 @@
     xmlns:data="using:WinUIGallery.Data"
     xmlns:local="using:WinUIGallery.DesktopWap.Controls"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    Loaded="UserControl_Loaded"
     mc:Ignorable="d">
 
     <UserControl.Resources>
diff --git a/WinUIGallery/Controls/PageHeader.xaml.cs b/WinUIGallery/Controls/PageHeader.xaml.cs
index 9543a56e0..b1d4478e2 100644
--- a/WinUIGallery/Controls/PageHeader.xaml.cs
+++ b/WinUIGallery/Controls/PageHeader.xaml.cs
@@ -91,5 +91,13 @@ public async void OnFeedBackButtonClick(object sender, RoutedEventArgs e)
         {
              await Windows.System.Launcher.LaunchUriAsync(new Uri("https://github.com/microsoft/WinUI-Gallery/issues/new/choose"));
         }
+
+        private void UserControl_Loaded(object sender, RoutedEventArgs e)
+        {
+            if (Item == null || (string.IsNullOrEmpty(Item.ApiNamespace) && Item.BaseClasses == null))
+            {
+                APIDetailsBtn.Visibility = Visibility.Collapsed;
+            }
+        }
     }
 }

From 9f4d103ac1ad1d499871377fe575a78ea9b8f414 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Fri, 6 Dec 2024 16:43:11 +0100
Subject: [PATCH 5/9] Address feedback

---
 WinUIGallery/Controls/PageHeader.xaml | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 516117954..dca065e73 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -33,7 +33,6 @@
         </Grid.RowDefinitions>
         <StackPanel Orientation="Horizontal" Spacing="4">
             <TextBlock
-                Grid.Row="0"
                 AutomationProperties.AutomationId="PageHeader"
                 Style="{StaticResource TitleTextBlockStyle}"
                 Text="{x:Bind Item.Title}"
@@ -46,8 +45,8 @@
                 VerticalAlignment="Bottom"
                 AutomationProperties.Name="API details"
                 Style="{StaticResource SubtleButtonStyle}"
-                ToolTipService.ToolTip="Details of the API like inheritance and namespace">
-                <FontIcon FontSize="14" Glyph="&#xE946;" />
+                ToolTipService.ToolTip="API details like inheritance and namespace">
+                <FontIcon FontSize="16" Glyph="&#xE946;" />
                 <Button.Flyout>
                     <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
                         <StackPanel x:Name="APIPanel" Spacing="16">
@@ -68,10 +67,7 @@
                                     Text="{x:Bind Item.ApiNamespace}" />
                             </StackPanel>
                             <MenuFlyoutSeparator Margin="-12,0,-12,0" />
-                            <StackPanel
-                                x:Name="InheritanceSourcePanel"
-                                Margin="0,0,0,4"
-                                Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
+                            <StackPanel x:Name="InheritanceSourcePanel" Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
                                 <TextBlock
                                     VerticalAlignment="Center"
                                     Foreground="{ThemeResource TextFillColorSecondaryBrush}"

From f31a21ff2fc39082e238639e28c5f34700006893 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Sat, 7 Dec 2024 21:41:10 +0100
Subject: [PATCH 6/9] Update WinUIGallery/Controls/PageHeader.xaml

Co-authored-by: Jay <65828559+Jay-o-Way@users.noreply.github.com>
---
 WinUIGallery/Controls/PageHeader.xaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index dca065e73..6e9957b6c 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -45,7 +45,7 @@
                 VerticalAlignment="Bottom"
                 AutomationProperties.Name="API details"
                 Style="{StaticResource SubtleButtonStyle}"
-                ToolTipService.ToolTip="API details like inheritance and namespace">
+                ToolTipService.ToolTip="API namespace and inheritance">
                 <FontIcon FontSize="16" Glyph="&#xE946;" />
                 <Button.Flyout>
                     <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">

From 8532ade603b50887fe65ff9e7bbb2858c3d63618 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Sun, 8 Dec 2024 22:00:41 +0100
Subject: [PATCH 7/9] Margin tweak

---
 WinUIGallery/Controls/PageHeader.xaml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 6e9957b6c..4554f483a 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -46,7 +46,7 @@
                 AutomationProperties.Name="API details"
                 Style="{StaticResource SubtleButtonStyle}"
                 ToolTipService.ToolTip="API namespace and inheritance">
-                <FontIcon FontSize="16" Glyph="&#xE946;" />
+                <FontIcon FontSize="14" Glyph="&#xE946;" />
                 <Button.Flyout>
                     <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
                         <StackPanel x:Name="APIPanel" Spacing="16">
@@ -66,7 +66,7 @@
                                     Style="{StaticResource CaptionTextBlockStyle}"
                                     Text="{x:Bind Item.ApiNamespace}" />
                             </StackPanel>
-                            <MenuFlyoutSeparator Margin="-12,0,-12,0" />
+                            <MenuFlyoutSeparator Margin="-12" />
                             <StackPanel x:Name="InheritanceSourcePanel" Visibility="{x:Bind Item.BaseClasses, Converter={StaticResource collectionConverter}}">
                                 <TextBlock
                                     VerticalAlignment="Center"

From eb5d0cdc6692a375c0deb12b6820feaa3ad65cbe Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Thu, 12 Dec 2024 14:59:17 +0100
Subject: [PATCH 8/9] Update PageHeader.xaml

---
 WinUIGallery/Controls/PageHeader.xaml | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 4554f483a..471bf488a 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -40,13 +40,16 @@
                 TextWrapping="NoWrap" />
             <Button
                 x:Name="APIDetailsBtn"
-                Margin="0,0,0,1"
+                Margin="0,0,0,2"
                 Padding="4"
                 VerticalAlignment="Bottom"
                 AutomationProperties.Name="API details"
                 Style="{StaticResource SubtleButtonStyle}"
                 ToolTipService.ToolTip="API namespace and inheritance">
-                <FontIcon FontSize="14" Glyph="&#xE946;" />
+                <FontIcon
+                    FontSize="14"
+                    Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
+                    Glyph="&#xE946;" />
                 <Button.Flyout>
                     <Flyout FlyoutPresenterStyle="{StaticResource CustomFlyoutPresenterStyle}" Placement="Bottom">
                         <StackPanel x:Name="APIPanel" Spacing="16">

From 216814f3c6c25185c7e955864f0f67a673411e77 Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Thu, 12 Dec 2024 16:56:12 +0100
Subject: [PATCH 9/9] Update PageHeader.xaml

---
 WinUIGallery/Controls/PageHeader.xaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/WinUIGallery/Controls/PageHeader.xaml b/WinUIGallery/Controls/PageHeader.xaml
index 471bf488a..666e08d54 100644
--- a/WinUIGallery/Controls/PageHeader.xaml
+++ b/WinUIGallery/Controls/PageHeader.xaml
@@ -40,7 +40,7 @@
                 TextWrapping="NoWrap" />
             <Button
                 x:Name="APIDetailsBtn"
-                Margin="0,0,0,2"
+                Margin="0,0,0,3"
                 Padding="4"
                 VerticalAlignment="Bottom"
                 AutomationProperties.Name="API details"