[Windows 10] Fix layout in New Tab Menu page (#18424)

There's an existing WinUI bug where a nested Grid has it's star-sizing
ignored on Windows 10. This resulted in the New Tab Menu page looking
weird on Windows 10. This PR fixes the layout issue by applying a max
width to the first column, which will be clipped as necessary to make
space for the second column.

Part of #18281

## Validation Steps Performed
Validated the page looks good on Windows 10 and Windows 11, even after
resizing the window.
This commit is contained in:
Carlos Zamora 2025-01-21 18:22:20 -08:00 committed by GitHub
parent 3e969d53ee
commit 51e21dd86a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -31,7 +31,17 @@
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<!--
BODGY: We want two columns of content:
1. the identifier (e.g. profile name), aligned left
2. the buttons (e.g. reorder, delete), aligned right
There's a bug in WinUI 2 for Windows 10 where these nested columns are treated as "auto" instead
of *-sized. To work around this, we can set the width of the first column's content to
StandardControlMaxWidth. The first column will be clipped as necessary to make space for the second column,
resulting in the desired layout.
-->
<ContentPresenter Grid.Column="0"
Width="{StaticResource StandardControlMaxWidth}"
Content="{TemplateBinding Content}" />
<StackPanel Grid.Column="1"
Orientation="Horizontal"
@ -127,7 +137,17 @@
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<!--
BODGY: We want two columns of content:
1. the identifier (e.g. profile name), aligned left
2. the buttons (e.g. reorder, delete), aligned right
There's a bug in WinUI 2 for Windows 10 where these nested columns are treated as "auto" instead
of *-sized. To work around this, we can set the width of the first column's content to
StandardControlMaxWidth. The first column will be clipped as necessary to make space for the second column,
resulting in the desired layout.
-->
<StackPanel Grid.Column="0"
Width="{StaticResource StandardControlMaxWidth}"
Orientation="Horizontal">
<IconSourceElement Width="16"
Height="16"