LanMountainDesktop/LanMountainDesktop/Views/Components/StudyEnvironmentWidget.axaml

<UserControl xmlns="https://github.com/avaloniaui"
             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"
             d:DesignWidth="300"
             d:DesignHeight="150"
             x:Class="LanMountainDesktop.Views.Components.StudyEnvironmentWidget">
    <Border x:Name="RootBorder"
            Background="{DynamicResource AdaptiveSurfaceRaisedBrush}"
            BorderBrush="{DynamicResource AdaptiveButtonBorderBrush}"
            BorderThickness="1"
            CornerRadius="18"
            Padding="14,10">
        <Grid x:Name="LayoutGrid"
              ColumnDefinitions="*,Auto"
              ColumnSpacing="10">
            <StackPanel x:Name="LeftStatusStack"
                        Spacing="2"
                        VerticalAlignment="Center">
                <TextBlock x:Name="StatusTitleTextBlock"
                           Text="Environment"
                           FontSize="11"
                           MaxLines="1"
                           TextTrimming="CharacterEllipsis"
                           Foreground="{DynamicResource AdaptiveTextSecondaryBrush}" />
                <TextBlock x:Name="StatusValueTextBlock"
                           Text="Quiet"
                           FontSize="20"
                           FontWeight="SemiBold"
                           MaxLines="1"
                           TextTrimming="CharacterEllipsis"
                           Foreground="{DynamicResource AdaptiveTextPrimaryBrush}" />
            </StackPanel>

            <StackPanel Grid.Column="1"
                        Spacing="1"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Center">
                <TextBlock x:Name="NoiseValueTextBlock"
                           Text="--"
                           FontSize="22"
                           FontWeight="SemiBold"
                           MaxLines="1"
                           TextTrimming="CharacterEllipsis"
                           TextAlignment="Right"
                           HorizontalAlignment="Right"
                           Foreground="{DynamicResource AdaptiveTextPrimaryBrush}" />
                <TextBlock x:Name="NoiseSubValueTextBlock"
                           Text=""
                           FontSize="12"
                           MaxLines="1"
                           TextTrimming="CharacterEllipsis"
                           TextAlignment="Right"
                           HorizontalAlignment="Right"
                           Foreground="{DynamicResource AdaptiveTextSecondaryBrush}"
                           IsVisible="False" />
            </StackPanel>
        </Grid>
    </Border>
</UserControl>