LanMountainDesktop/LanMountainDesktop/Views/SettingsPages/AboutSettingsPage.axaml

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:vm="using:LanMountainDesktop.ViewModels"
             xmlns:controls="using:LanMountainDesktop.Controls"
             xmlns:ui="using:FluentAvalonia.UI.Controls"
             xmlns:fi="using:FluentIcons.Avalonia.Fluent"
             x:Class="LanMountainDesktop.Views.SettingsPages.AboutSettingsPage"
             x:DataType="vm:AboutSettingsPageViewModel">
    <UserControl.Styles>
        <Style Selector="StackPanel.about-page-container">
            <Setter Property="HorizontalAlignment" Value="Stretch" />
            <Setter Property="Spacing" Value="0" />
            <Setter Property="Margin" Value="0,12,0,24" />
        </Style>

        <Style Selector="Border.about-hero-card">
            <Setter Property="Background" Value="{DynamicResource AdaptiveSurfaceRaisedBrush}" />
            <Setter Property="BorderBrush" Value="{DynamicResource AdaptiveGlassPanelBorderBrush}" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="CornerRadius" Value="24" />
            <Setter Property="ClipToBounds" Value="True" />
            <Setter Property="Margin" Value="0,0,0,18" />
            <Setter Property="HorizontalAlignment" Value="Stretch" />
        </Style>

        <Style Selector="ui|InfoBar.about-static-info">
            <Setter Property="IsOpen" Value="True" />
            <Setter Property="IsClosable" Value="False" />
            <Setter Property="Severity" Value="Informational" />
            <Setter Property="Margin" Value="0,0,0,12" />
        </Style>
    </UserControl.Styles>

    <ScrollViewer HorizontalScrollBarVisibility="Disabled"
                  VerticalScrollBarVisibility="Auto">
        <StackPanel Classes="about-page-container">
            <Border x:Name="AboutHeroCard"
                    Classes="about-hero-card"
                    Height="240">
                <Image Source="/Assets/about_banner.png"
                       Stretch="Uniform"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center" />
            </Border>

            <TextBlock Classes="settings-subsection-title"
                       Text="{Binding AppInfoHeader}" />

            <ui:InfoBar Classes="about-static-info"
                        Title="{Binding VersionLabel}"
                        Message="{Binding VersionText}">
                <ui:InfoBar.IconSource>
                    <fi:SymbolIconSource Symbol="Info" />
                </ui:InfoBar.IconSource>
            </ui:InfoBar>

            <ui:InfoBar Classes="about-static-info"
                        Title="{Binding CodenameLabel}"
                        Message="{Binding CodenameText}">
                <ui:InfoBar.IconSource>
                    <fi:SymbolIconSource Symbol="Bookmark" />
                </ui:InfoBar.IconSource>
            </ui:InfoBar>

            <Border Classes="settings-section-card">
                <StackPanel Spacing="12">
                    <controls:IconText Icon="WindowConsole"
                                       Text="{Binding RenderBackendLabel}" />
                    <TextBlock Classes="settings-item-description"
                               Text="{Binding RenderBackendText}"
                               TextWrapping="Wrap" />
                </StackPanel>
            </Border>
        </StackPanel>
    </ScrollViewer>
</UserControl>