bloxstrap/Bloxstrap/UI/Elements/Settings/Pages/ModsPage.xaml

<ui:UiPage x:Class="Bloxstrap.UI.Elements.Settings.Pages.ModsPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:models="clr-namespace:Bloxstrap.UI.ViewModels"
      xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
      xmlns:resources="clr-namespace:Bloxstrap.Resources"
      xmlns:controls="clr-namespace:Bloxstrap.UI.Elements.Controls"
      xmlns:dmodels="clr-namespace:Bloxstrap.UI.ViewModels.Settings"
      mc:Ignorable="d"
      d:DataContext="{d:DesignInstance dmodels:ModsViewModel, IsDesignTimeCreatable=True}"
      d:DesignHeight="800" d:DesignWidth="800"
      Title="ModsPage"
      Scrollable="True">
    <StackPanel Margin="0,0,14,14">
        <TextBlock Text="{x:Static resources:Strings.Menu_Mods_Description}" FontSize="14" Foreground="{DynamicResource TextFillColorSecondaryBrush}" />

        <Grid Margin="0,16,0,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            
            <ui:CardAction Grid.Row="0" Grid.Column="0" x:Name="OpenModFolderCardAction" Margin="0,0,4,0" Icon="Folder24" Command="{Binding OpenModsFolderCommand}">
                <StackPanel>
                    <TextBlock FontSize="14" Text="{x:Static resources:Strings.Menu_Mods_OpenModsFolder_Title}" TextWrapping="Wrap" />
                    <TextBlock Margin="0,2,0,0" FontSize="12" Text="{x:Static resources:Strings.Menu_Mods_OpenModsFolder_Description}" Foreground="{DynamicResource TextFillColorTertiaryBrush}" TextWrapping="Wrap" />
                </StackPanel>
            </ui:CardAction>
            
            <ui:CardAction Grid.Row="0" Grid.Column="1" Margin="4,0,0,0" Icon="BookQuestionMark24" Command="models:GlobalViewModel.OpenWebpageCommand" CommandParameter="https://github.com/pizzaboxer/bloxstrap/wiki/Adding-custom-mods">
                <StackPanel>
                    <TextBlock FontSize="14" Text="{x:Static resources:Strings.Common_Help}" />
                    <TextBlock Margin="0,2,0,0" FontSize="12" Text="{x:Static resources:Strings.Menu_Mods_Help_Description}" Padding="0,0,16,0"  Foreground="{DynamicResource TextFillColorTertiaryBrush}" />
                </StackPanel>
            </ui:CardAction>

            <ui:CardAction Grid.Row="1" Grid.ColumnSpan="2" Margin="0,8,0,0" Icon="WindowWrench24" Command="{Binding OpenCompatSettingsCommand}">
                <StackPanel>
                    <TextBlock FontSize="14" Text="{x:Static resources:Strings.Menu_Mods_Misc_CompatibilitySettings_Title}" TextWrapping="Wrap" />
                    <controls:MarkdownTextBlock Margin="0,2,0,0" FontSize="12" MarkdownText="{Binding Source={x:Static resources:Strings.Menu_Mods_Misc_CompatibilitySettings_Description}, Converter={StaticResource StringFormatConverter}, ConverterParameter='https://devblogs.microsoft.com/directx/demystifying-full-screen-optimizations/'}" Foreground="{DynamicResource TextFillColorTertiaryBrush}" TextWrapping="Wrap" />
                </StackPanel>
            </ui:CardAction>
        </Grid>

        <TextBlock Text="{x:Static resources:Strings.Common_Presets}" FontSize="20" FontWeight="Medium" Margin="0,16,0,0" />

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Presets_OldDeathSound_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Presets_OldDeathSound_Description}">
            <ui:ToggleSwitch IsChecked="{Binding OldDeathSoundTask.NewState, Mode=TwoWay}" />
        </controls:OptionControl>

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Presets_MouseCursor_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Presets_MouseCursor_Description}">
            <ComboBox Margin="5,0,0,0" Padding="10,5,10,5" Width="200" ItemsSource="{Binding CursorTypeTask.Selections, Mode=OneTime}" Text="{Binding CursorTypeTask.NewState, Mode=TwoWay}">
                <ComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=., Converter={StaticResource EnumNameConverter}}" />
                    </DataTemplate>
                </ComboBox.ItemTemplate>
            </ComboBox>
        </controls:OptionControl>

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Presets_OldAvatarEditor_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Presets_OldAvatarEditor_Description}">
            <ui:ToggleSwitch IsChecked="{Binding OldAvatarBackgroundTask.NewState, Mode=TwoWay}" />
        </controls:OptionControl>

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Presets_OldCharacterSounds_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Presets_OldCharacterSounds_Description}">
            <ui:ToggleSwitch IsChecked="{Binding OldCharacterSoundsTask.NewState, Mode=TwoWay}" />
        </controls:OptionControl>

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Presets_EmojiType_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Presets_EmojiType_Description}">
            <ComboBox Margin="5,0,0,0" Padding="10,5,10,5" Width="220" ItemsSource="{Binding EmojiFontTask.Selections, Mode=OneTime}" Text="{Binding EmojiFontTask.NewState, Mode=TwoWay}">
                <ComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=., Converter={StaticResource EnumNameConverter}}" />
                    </DataTemplate>
                </ComboBox.ItemTemplate>
            </ComboBox>
        </controls:OptionControl>

        <TextBlock Text="{x:Static resources:Strings.Common_Miscellaneous}" FontSize="20" FontWeight="Medium" Margin="0,16,0,0" />

        <controls:OptionControl 
            Header="{x:Static resources:Strings.Menu_Mods_Misc_CustomFont_Title}" 
            Description="{x:Static resources:Strings.Menu_Mods_Misc_CustomFont_Description}">
            <StackPanel>
                <ui:Button Icon="DocumentAdd16" Content="{x:Static resources:Strings.Menu_Mods_Misc_CustomFont_Choose}" Command="{Binding ManageCustomFontCommand}" Visibility="{Binding ChooseCustomFontVisibility, Mode=OneWay}" />
                <ui:Button Icon="Delete16" Content="{x:Static resources:Strings.Menu_Mods_Misc_CustomFont_Remove}" Appearance="Danger" Command="{Binding ManageCustomFontCommand}" Visibility="{Binding DeleteCustomFontVisibility, Mode=OneWay}" />
            </StackPanel>
        </controls:OptionControl>
    </StackPanel>
</ui:UiPage>