<ResourceDictionary
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
    x:CompileBindings="True">
    <ControlTheme x:Key="{x:Type controls:ColorDetailControl}" TargetType="controls:ColorDetailControl">
        <Setter Property="Template">
            <ControlTemplate TargetType="controls:ColorDetailControl">
                <StackPanel>
                    <TextBlock
                        Margin="0,0,0,8"
                        Classes="H5"
                        Text="{TemplateBinding ResourceName}"
                        Theme="{DynamicResource TitleTextBlock}" />
                    <Border
                        Height="100"
                        HorizontalAlignment="Stretch"
                        Background="{TemplateBinding Background}"
                        CornerRadius="6" />
                    <Grid ColumnDefinitions="*, Auto" RowDefinitions="*, *, *, *, *, *, *, *">
                        <!--  Row 0-1-2 ResourceKey  -->
                        <TextBlock
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Margin="4,8,0,0"
                            VerticalAlignment="Center"
                            Classes="Tertiary"
                            Text="ResourceKey" />
                        <SelectableTextBlock
                            Grid.Row="1"
                            Grid.Column="0"
                            VerticalAlignment="Center"
                            Text="{TemplateBinding ResourceKey}" />
                        <Button
                            Grid.Row="1"
                            Grid.Column="1"
                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_ResourceKey}"
                            Theme="{DynamicResource  IconBorderlessButton}"
                            Content="{StaticResource SemiIconCopy}" />
                        <SelectableTextBlock
                            Grid.Row="2"
                            Grid.Column="0"
                            VerticalAlignment="Center"
                            IsVisible="{TemplateBinding ColorResourceKey, Converter={x:Static ObjectConverters.IsNotNull}}"
                            Text="{TemplateBinding ColorResourceKey}" />
                        <Button
                            Grid.Row="2"
                            Grid.Column="1"
                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_ColorResourceKey}"
                            IsVisible="{TemplateBinding ColorResourceKey, Converter={x:Static ObjectConverters.IsNotNull}}"
                            Theme="{DynamicResource  IconBorderlessButton}"
                            Content="{StaticResource SemiIconCopy}" />

                        <!--  Row 3-4-5 HEX  -->
                        <TextBlock
                            Grid.Row="3"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Margin="4,8,0,0"
                            VerticalAlignment="Center"
                            Classes="Tertiary"
                            Text="Hex" />
                        <SelectableTextBlock
                            Grid.Row="4"
                            Grid.Column="0"
                            VerticalAlignment="Center"
                            Text="{TemplateBinding Hex}" />
                        <Button
                            Grid.Row="4"
                            Grid.Column="1"
                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_Hex}"
                            Theme="{DynamicResource  IconBorderlessButton}"
                            Content="{StaticResource SemiIconCopy}" />
                        <SelectableTextBlock
                            Grid.Row="5"
                            Grid.Column="0"
                            VerticalAlignment="Center"
                            Text="{TemplateBinding Hex2}" />
                        <Button
                            Grid.Row="5"
                            Grid.Column="1"
                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_Hex2}"
                            Theme="{DynamicResource  IconBorderlessButton}"
                            Content="{StaticResource SemiIconCopy}" />

                        <!--  Row 6-7 Opacity  -->
                        <TextBlock
                            Grid.Row="6"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Margin="4,8,0,0"
                            VerticalAlignment="Center"
                            Classes="Tertiary"
                            Text="Opacity" />
                        <SelectableTextBlock
                            Grid.Row="7"
                            Grid.Column="0"
                            VerticalAlignment="Center"
                            Text="{TemplateBinding OpacityNumber}" />
                        <Button
                            Grid.Row="7"
                            Grid.Column="1"
                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_Opacity}"
                            Theme="{DynamicResource  IconBorderlessButton}"
                            Content="{StaticResource SemiIconCopy}" />

                    </Grid>
                </StackPanel>
            </ControlTemplate>
        </Setter>
    </ControlTheme>
</ResourceDictionary>