149 lines
6.6 KiB
XML
149 lines
6.6 KiB
XML
<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
|
<Design.PreviewWith>
|
|
<Panel Background="CornflowerBlue">
|
|
<StackPanel Margin="10" Spacing="15">
|
|
<StackPanel
|
|
HorizontalAlignment="Center"
|
|
Orientation="Horizontal"
|
|
Spacing="5">
|
|
<ThemeVariantScope RequestedThemeVariant="Light">
|
|
<Border Background="White" Padding="5">
|
|
<CheckBox>Light</CheckBox>
|
|
</Border>
|
|
</ThemeVariantScope>
|
|
<ThemeVariantScope RequestedThemeVariant="Dark">
|
|
<Border Background="Black" Padding="5">
|
|
<CheckBox Foreground="White" IsChecked="True">Dark</CheckBox>
|
|
</Border>
|
|
</ThemeVariantScope>
|
|
</StackPanel>
|
|
<StackPanel
|
|
HorizontalAlignment="Center"
|
|
Orientation="Horizontal"
|
|
Spacing="5">
|
|
<ThemeVariantScope RequestedThemeVariant="Light">
|
|
<StackPanel Background="White" Spacing="5">
|
|
<Border>
|
|
<CheckBox Classes="switch" />
|
|
</Border>
|
|
<Border>
|
|
<CheckBox Classes="switch" IsChecked="True" />
|
|
</Border>
|
|
</StackPanel>
|
|
</ThemeVariantScope>
|
|
<ThemeVariantScope RequestedThemeVariant="Dark">
|
|
<StackPanel Background="Black" Spacing="5">
|
|
<Border>
|
|
<CheckBox Classes="switch" />
|
|
</Border>
|
|
<Border>
|
|
<CheckBox Classes="switch" IsChecked="True" />
|
|
</Border>
|
|
</StackPanel>
|
|
</ThemeVariantScope>
|
|
</StackPanel>
|
|
</StackPanel>
|
|
</Panel>
|
|
</Design.PreviewWith>
|
|
|
|
<Style Selector="CheckBox.switch">
|
|
<Setter Property="Background" Value="{DynamicResource BrandCheckboxBackground}" />
|
|
<Setter Property="CornerRadius" Value="15" />
|
|
<Setter Property="Height" Value="30" />
|
|
<Setter Property="Width" Value="54" />
|
|
<Setter Property="Transitions">
|
|
<Transitions>
|
|
<TransformOperationsTransition Duration="0:0:.075" Property="RenderTransform" />
|
|
<DoubleTransition Duration="0:0:0.15" Property="Opacity" />
|
|
<ThicknessTransition Duration="0:0:0.1" Property="Margin" />
|
|
</Transitions>
|
|
</Setter>
|
|
|
|
<Setter Property="Template">
|
|
<ControlTemplate>
|
|
<Grid x:Name="RootGrid">
|
|
<Border
|
|
Background="{TemplateBinding Background}"
|
|
CornerRadius="{TemplateBinding CornerRadius}"
|
|
Padding="4"
|
|
x:Name="PART_Border">
|
|
<Viewbox HorizontalAlignment="Left" x:Name="SlidingIconViewbox">
|
|
<Border
|
|
Background="{TemplateBinding Foreground}"
|
|
CornerRadius="15"
|
|
Height="24"
|
|
Width="24"
|
|
x:Name="SlidingIcon">
|
|
<Border.Styles>
|
|
<Style Selector="Border">
|
|
<Setter Property="Transitions">
|
|
<Transitions>
|
|
<TransformOperationsTransition Duration="0:0:.075" Property="RenderTransform" />
|
|
<ThicknessTransition Duration="0:0:0.1" Property="Margin" />
|
|
</Transitions>
|
|
</Setter>
|
|
</Style>
|
|
</Border.Styles>
|
|
</Border>
|
|
</Viewbox>
|
|
</Border>
|
|
</Grid>
|
|
</ControlTemplate>
|
|
</Setter>
|
|
|
|
<!-- Unchecked PointerOver State -->
|
|
<Style Selector="^:pointerover">
|
|
<Setter Property="Cursor" Value="Hand" />
|
|
<Setter Property="Opacity" Value=".75" />
|
|
|
|
<Style Selector="^ /template/ Border#PART_Border">
|
|
<Setter Property="Background" Value="{TemplateBinding Background}" />
|
|
</Style>
|
|
</Style>
|
|
|
|
<!-- Unchecked Pressed State -->
|
|
<Style Selector="^:pressed">
|
|
<Setter Property="RenderTransform" Value="scale(0.95)" />
|
|
|
|
<Style Selector="^ /template/ Border#PART_Border">
|
|
<Setter Property="Background" Value="{TemplateBinding Background}" />
|
|
</Style>
|
|
</Style>
|
|
|
|
<!-- Disabled State -->
|
|
<Style Selector="^:disabled /template/ Border#PART_Border">
|
|
<Setter Property="Background" Value="{TemplateBinding Background}" />
|
|
</Style>
|
|
|
|
<Style Selector="^:checked">
|
|
<!-- Checked Normal State -->
|
|
<Setter Property="Background" Value="{DynamicResource BrandCheckboxBackground}" />
|
|
<Setter Property="Foreground" Value="{DynamicResource BrandControlBackground}" />
|
|
|
|
<Style Selector="^ /template/ Border#SlidingIcon">
|
|
<Setter Property="Background" Value="{DynamicResource BrandPrimary}" />
|
|
<Setter Property="Margin" Value="22 0 0 0" />
|
|
</Style>
|
|
|
|
<!-- Checked PointerOver State -->
|
|
<Style Selector="^:pointerover">
|
|
<Setter Property="Cursor" Value="Hand" />
|
|
<Setter Property="Opacity" Value=".75" />
|
|
|
|
<Style Selector="^ /template/ Border#PART_Border">
|
|
<Setter Property="Background" Value="{TemplateBinding Background}" />
|
|
</Style>
|
|
</Style>
|
|
|
|
<!-- Checked Pressed State -->
|
|
<Style Selector="^:pressed">
|
|
<Setter Property="RenderTransform" Value="scale(0.95)" />
|
|
|
|
<Style Selector="^ /template/ Border#PART_Border">
|
|
<Setter Property="Background" Value="{TemplateBinding Background}" />
|
|
</Style>
|
|
</Style>
|
|
</Style>
|
|
</Style>
|
|
</Styles>
|