<Styles
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c="clr-namespace:Plpext.UI"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:vm="clr-namespace:Plpext.UI.ViewModels">
    <Design.PreviewWith>
        <Border
            Padding="20"
            Background="RoyalBlue"
            BorderBrush="Black"
            BorderThickness="1">
            <StackPanel>
                <Border
                    Background="Navy"
                    BorderBrush="White"
                    BorderThickness="1">
                    <c:AudioPlayerControl
                        x:DataType="vm:AudioPlayerViewModel"
                        CurrentDuration="0:15"
                        IsPlaying="{Binding IsPlaying}"
                        PlayCommand="{Binding PlayCommand}"
                        PlaybackState="{Binding PlaybackState}"
                        Progress="44.8"
                        StopCommand="{Binding StopCommand}"
                        TotalDuration="0:22">
                        <c:AudioPlayerControl.DataContext>
                            <vm:AudioPlayerViewModel />
                        </c:AudioPlayerControl.DataContext>
                    </c:AudioPlayerControl>
                </Border>
                <c:AudioPlayerControl
                    x:DataType="vm:AudioPlayerViewModel"
                    CurrentDuration="15"
                    IsPlaying="True"
                    PlayCommand="{Binding PlayCommand}"
                    Progress="44.8"
                    TotalDuration="22">
                    <c:AudioPlayerControl.DataContext>
                        <vm:AudioPlayerViewModel />
                    </c:AudioPlayerControl.DataContext>
                </c:AudioPlayerControl>
            </StackPanel>
        </Border>
    </Design.PreviewWith>

    <Style Selector="c|AudioPlayerControl">
        <Setter Property="FontSize" Value="14" />
        <Setter Property="Margin" Value="0,0,0,0" />
        <Setter Property="Width" Value="176" />
        <Setter Property="Height" Value="36" />
    </Style>
    <Style Selector="c|AudioPlayerControl Button">
        <Setter Property="Foreground" Value="{StaticResource SecondaryLightest}" />
        <Setter Property="Background" Value="{StaticResource SecondaryDarkest}" />
        <Setter Property="BorderThickness" Value="2" />
        <Setter Property="BorderBrush" Value="{StaticResource SecondaryDark}" />
    </Style>
    <Style Selector="c|AudioPlayerControl Button:pointerover">
        <Setter Property="Foreground" Value="{StaticResource SecondaryMiddle}" />
    </Style>
    <Style Selector="c|AudioPlayerControl Button:pointerover /template/ ContentPresenter">
        <Setter Property="Background" Value="{StaticResource SecondaryDark}" />
        <Setter Property="BorderThickness" Value="2" />
        <Setter Property="BorderBrush" Value="{StaticResource SecondaryDarkest}" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=False] /template/ Grid#ButtonGrid">
        <Setter Property="Margin" Value="142,0,-32,0" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=True] /template/ Grid#ButtonGrid">
        <Setter Property="Margin" Value="0,0,0,0" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=False] /template/ StackPanel#ProgressPanel">
        <Setter Property="Width" Value="0" />
        <Setter Property="Opacity" Value="0" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=True] /template/ StackPanel#ProgressPanel">
        <Setter Property="UseLayoutRounding" Value="True" />
        <Setter Property="Opacity" Value="1" />
        <Setter Property="Margin" Value="6,10,0,0" />
        <Setter Property="VerticalAlignment" Value="Center" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=False] /template/ ProgressBar:horizontal">
        <Setter Property="MinWidth" Value="0" />
        <Setter Property="Width" Value="0" />
    </Style>
    <Style Selector="c|AudioPlayerControl[IsPlaying=True] /template/ ProgressBar:horizontal">
        <Setter Property="MinWidth" Value="0" />
        <Setter Property="Width" Value="100" />
    </Style>

</Styles>
