ShrlAlgoToolkit/Melskin/Controls/CodeBox.xaml

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:assists="clr-namespace:Melskin.Assists"
    xmlns:controls="clr-namespace:Melskin.Controls"
    xmlns:internal="clr-namespace:Melskin.Converters.Internal">
    <Style x:Key="CodeSwitchStyle" TargetType="{x:Type ToggleButton}">
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="Opacity" Value="0.55" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ToggleButton}">
                    <Border
                        Padding="{TemplateBinding Padding}"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                        <ContentPresenter />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Opacity" Value="1" />
            </Trigger>
        </Style.Triggers>
    </Style>

    <Style TargetType="{x:Type controls:CodeBox}">
        <!--<Setter Property="FontFamily" Value="Chinese Quote" />-->
        <Setter Property="Foreground" Value="{DynamicResource TextPrimaryBrush}" />
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundNormalBrush}" />
        <Setter Property="BorderBrush" Value="{DynamicResource BorderNormalBrush}" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="Margin" Value="0,0,0,16" />
        <Setter Property="Padding" Value="24,42,24,50" />
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="assists:ControlAssist.CornerRadius" Value="2" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type controls:CodeBox}">
                    <Grid UseLayoutRounding="True">
                        <Grid.RowDefinitions>
                            <!--  Content  -->
                            <RowDefinition Height="Auto" />
                            <!--  Title  -->
                            <RowDefinition Height="Auto" />
                            <!--  Description  -->
                            <RowDefinition Height="Auto" />
                            <!--  Code  -->
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <!--  Border  -->
                        <Border
                            Grid.Row="0"
                            Grid.RowSpan="4"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="{Binding Path=(assists:ControlAssist.CornerRadius), Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                        <!--  Content  -->
                        <ContentControl
                            Grid.Row="0"
                            Margin="{TemplateBinding Padding}"
                            Content="{TemplateBinding Content}"
                            ContentStringFormat="{TemplateBinding ContentStringFormat}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}" />
                        <!--  Title  -->
                        <ContentControl
                            Grid.Row="1"
                            Content="{TemplateBinding Title}"
                            ContentTemplate="{TemplateBinding TitleTemplate}"
                            Focusable="False" />

                        <!--  Description  -->
                        <ToggleButton
                            x:Name="CodeSwitch"
                            Grid.Row="2"
                            Margin="0,0,8,8"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Bottom"
                            Style="{StaticResource CodeSwitchStyle}"
                            ToolTip="Show Code">
                            <controls:IconElement
                                x:Name="CodeSwitchPath"
                                Width="16"
                                Height="16"
                                Foreground="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type ToggleButton}}}"
                                Symbol="CodeOff" />
                        </ToggleButton>
                        <ContentControl
                            Grid.Row="2"
                            Content="{TemplateBinding Description}"
                            ContentTemplate="{TemplateBinding DescriptionTemplate}"
                            Focusable="False" />
                        <!--  Code  -->
                        <ContentControl
                            x:Name="Code"
                            Grid.Row="3"
                            Content="{TemplateBinding Code}"
                            ContentTemplate="{TemplateBinding CodeTemplate}"
                            Focusable="False"
                            Visibility="Collapsed" />
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger SourceName="CodeSwitch" Property="IsChecked" Value="True">
                            <Setter TargetName="CodeSwitch" Property="ToolTip" Value="Hide Code" />
                            <Setter TargetName="CodeSwitchPath" Property="Symbol" Value="Code" />
                            <Setter TargetName="Code" Property="Visibility" Value="Visible" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="TitleTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Canvas>
                        <Border
                            Canvas.Left="0"
                            Canvas.Top="0"
                            Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type controls:CodeBox}}}"
                            BorderBrush="{Binding BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type controls:CodeBox}}}"
                            BorderThickness="0,1,0,0" />
                        <TextBlock
                            Canvas.Left="32"
                            Canvas.Top="-10"
                            Padding="8,1"
                            Panel.ZIndex="1"
                            Background="{DynamicResource ControlBackgroundNormalBrush}"
                            FontWeight="Medium"
                            Text="{TemplateBinding Content}" />
                    </Canvas>
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="DescriptionTemplate">
            <Setter.Value>
                <DataTemplate>
                    <ContentPresenter
                        Margin="32,18"
                        Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static internal:StringToMarkDownConverter.Instance}}"
                        TextBlock.LineHeight="28" />
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="CodeTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Border
                        Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type controls:CodeBox}}}"
                        Padding="32,16"
                        BorderBrush="{Binding BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type controls:CodeBox}}}"
                        BorderThickness="0,1,0,0">
                        <ContentPresenter Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static internal:StringToCodeConverter.Instance}}" />
                    </Border>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--<Style BasedOn="{StaticResource Antd.CodeBox}" TargetType="controls:CodeBox" />-->

</ResourceDictionary>