SettingsDisplayControl.xaml

<UserControl
    x:Class="USBFunctionMode.SettingsDisplayControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:USBFunctionMode"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    SizeChanged="MainPanel_SizeChanged"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">

    <UserControl.Resources>
        <local:InverseBooleanConverter x:Key="InverseBooleanConverter" />
        <local:NullToTrueConverter x:Key="NullToFalseConverter" Inverse="True" />
        <local:NullToTrueConverter x:Key="NullToTrueConverter" Inverse="False" />
        <local:StringNullOrWhiteSpaceToTrueConverter x:Key="StringNullOrWhiteSpaceToFalseConverter" Inverse="True" />
        <local:StringNullOrWhiteSpaceToTrueConverter x:Key="StringNullOrWhiteSpaceToTrueConverter" Inverse="False" />

        <Style x:Key="TextBlockSettingDescriptionStyle" TargetType="TextBlock">
            <Setter Property="TextWrapping" Value="Wrap" />
            <Setter Property="FontSize" Value="12" />
            <Setter Property="Opacity" Value="0.75" />
        </Style>
    </UserControl.Resources>

    <Grid x:Name="MainPanel" HorizontalAlignment="Stretch" VerticalAlignment="Center">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:Name="NormalState">
                    <VisualState.Setters>
                        <Setter Target="ActionableElement.(Grid.Row)" Value="0" />
                        <Setter Target="ActionableElement.(Grid.Column)" Value="2" />
                        <Setter Target="ActionableElement.Margin" Value="24,0,0,0" />
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="CompactState">
                    <VisualState.Setters>
                        <Setter Target="ActionableElement.(Grid.Row)" Value="1" />
                        <Setter Target="ActionableElement.(Grid.Column)" Value="1" />
                        <Setter Target="ActionableElement.Margin" Value="0,4,0,0" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

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

        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <ContentPresenter x:Name="SettingsIconElement"
                          x:Load="{x:Bind Icon, Mode=OneWay, Converter={StaticResource NullToFalseConverter}}"
                          Content="{x:Bind Icon, Mode=OneWay}"
                          Margin="2,0,20,0"/>

        <Grid x:Name="DescriptionPanel"
              Grid.Column="1"
              VerticalAlignment="Center"
              HorizontalAlignment="Left">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <TextBlock x:Name="TitleBlock"
                       x:Load="{x:Bind Title, Mode=OneWay, Converter={StaticResource StringNullOrWhiteSpaceToFalseConverter}}"
                       Text="{x:Bind Title, Mode=OneWay}"
                       TextWrapping="Wrap"/>

            <TextBlock x:Name="DescriptionBlock"
                       x:Load="{x:Bind Description, Mode=OneWay, Converter={StaticResource StringNullOrWhiteSpaceToFalseConverter}}"
                       Grid.Row="1"
                       Style="{StaticResource TextBlockSettingDescriptionStyle}"
                       Text="{x:Bind Description, Mode=OneWay}"/>

            <ContentPresenter x:Name="AdditionalContentPanel"
                              x:Load="{x:Bind AdditionalDescriptionContent, Mode=OneWay, Converter={StaticResource NullToFalseConverter}}"
                              Grid.Row="2"
                              Content="{x:Bind AdditionalDescriptionContent, Mode=OneWay}"/>
        </Grid>

        <ContentPresenter x:Name="ActionableElement"
                          x:Load="{x:Bind SettingsActionableElement, Mode=OneWay, Converter={StaticResource NullToFalseConverter}}"
                          Grid.Column="2"
                          Margin="24,0,0,0"
                          HorizontalAlignment="Left"
                          VerticalAlignment="Center"
                          Content="{x:Bind SettingsActionableElement, Mode=OneWay}" />
    </Grid>
</UserControl>