Skip to content

Commit

Permalink
chips
Browse files Browse the repository at this point in the history
  • Loading branch information
@kikipoulet
kikipoulet committed Sep 9, 2024
1 parent ac659f4 commit 4be2c81
Showing 1 changed file with 67 additions and 63 deletions.
130 changes: 67 additions & 63 deletions SukiUI/Theme/RadioButtonStyles.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,13 @@
<Design.PreviewWith>
<Border Padding="20" Background="White">
<StackPanel Orientation="Horizontal">
<RadioButton Margin="5">
<RadioButton Margin="5" Classes="GigaChips">
<TextBlock>test 2</TextBlock>
</RadioButton>
<RadioButton Margin="5">
<RadioButton Margin="5" Classes="GigaChips">
<TextBlock>test 2</TextBlock>
</RadioButton>
<RadioButton Margin="5" Classes="Chips">
<RadioButton Margin="5" Classes="GigaChips">
<TextBlock>test 3</TextBlock>
</RadioButton>

Expand All @@ -23,52 +23,65 @@
<Setter Property="Foreground" Value="{DynamicResource SukiText}" />
</Style>

<Style Selector="RadioButton.Chips">
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="#77555555" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="CornerRadius" Value="50" />
<Setter Property="Template">
<ControlTemplate>
<Panel>
<Border Margin="0,0,0,0"
Padding="10"
<Style Selector="RadioButton.Chips">
<Setter Property="Background" Value="{DynamicResource SukiPrimaryColor0}" />
<Setter Property="BorderBrush" Value="{DynamicResource SukiBorderBrush}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="CornerRadius" Value="50" />
<Setter Property="Template">
<ControlTemplate>
<Grid>
<Border
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center"
Orientation="Horizontal">

<ContentPresenter Name="PART_ContentPresenter"
Margin="15,0,15,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
HorizontalContentAlignment="Center"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
RecognizesAccessKey="True" />
</StackPanel>
</Border>
</Panel>
</ControlTemplate>
</Setter>
</Style>

<Style Selector="RadioButton.Chips TextBlock">
<Setter Property="Foreground" Value="#77555555" />
</Style>


<Style Selector="RadioButton.Chips:checked TextBlock">
<Setter Property="Foreground" Value="{DynamicResource SukiPrimaryColor}" />
</Style>

<Style Selector="RadioButton.Chips:checked Border">
<Setter Property="BorderBrush" Value="{DynamicResource SukiPrimaryColor}" />
<Setter Property="BorderThickness" Value="1.5" />
</Style>
CornerRadius="{TemplateBinding CornerRadius}"
Margin="0,0,0,0"
Padding="10">
<Border.Transitions>
<Transitions>
<BrushTransition Property="Background" Duration="0:0:0.15"></BrushTransition>
<ThicknessTransition Duration="0:0:0.2" Property="Margin" />
</Transitions>
</Border.Transitions>
<StackPanel
HorizontalAlignment="Center"
Orientation="Horizontal"
VerticalAlignment="Center">

<ContentPresenter
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
HorizontalAlignment="Center"
HorizontalContentAlignment="Center"
Margin="15,0,15,0"
Name="PART_ContentPresenter"
RecognizesAccessKey="True"
VerticalAlignment="Center" />
</StackPanel>
</Border>
</Grid>
</ControlTemplate>
</Setter>
</Style>

<Style Selector="RadioButton.Chips TextBlock">
<Setter Property="Foreground" Value="{DynamicResource SukiLowText}" />

</Style>


<Style Selector="RadioButton.Chips:checked TextBlock">
<Setter Property="Foreground" Value="White" />
<Setter Property="FontWeight" Value="DemiBold"></Setter>
</Style>

<Style Selector="RadioButton.Chips:checked Border">
<Setter Property="BorderBrush" Value="{DynamicResource SukiPrimaryColor}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Background" Value="{DynamicResource SukiPrimaryColor}" />

</Style>

<Style Selector="RadioButton.GigaChips">
<Setter Property="Background" Value="Transparent" />
Expand All @@ -80,22 +93,14 @@
<Setter Property="Template">
<ControlTemplate>
<Panel>
<Border Name="BigBorder"
<suki:GlassCard Name="BigBorder" IsInteractive="True"

Margin="4"
Padding="15,15,30,15"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"

ClipToBounds="True"
CornerRadius="{TemplateBinding CornerRadius}">
<Border.Transitions>
<Transitions>
<ThicknessTransition Property="BorderThickness" Duration="00:00:0.2" />
<TransformOperationsTransition Property="RenderTransform" Duration="00:00:0.1" />
<BrushTransition Property="BorderBrush" Duration="00:00:0.2" />
<ThicknessTransition Property="Margin" Duration="0:0:0.1" />
</Transitions>
</Border.Transitions>



<ContentPresenter Name="PART_ContentPresenter"
Expand All @@ -105,7 +110,7 @@
RecognizesAccessKey="True" />


</Border>
</suki:GlassCard>
<PathIcon Width="20"
Height="20"
Margin="12"
Expand All @@ -122,7 +127,8 @@
<Border Name="SelectedBorder"
Margin="3"
BorderBrush="{DynamicResource SukiPrimaryColor}"
BorderThickness="2"
Background="{DynamicResource SukiPrimaryColor5}"
BorderThickness="1.5"
CornerRadius="{TemplateBinding CornerRadius}"
Opacity="0">
<Border.Transitions>
Expand All @@ -137,9 +143,7 @@
</Setter>
</Style>

<Style Selector="RadioButton.GigaChips:checked Border#BigBorder">
<Setter Property="Background" Value="{DynamicResource SukiPrimaryColor5}" />
</Style>

<Style Selector="RadioButton.GigaChips:checked Border#SelectedBorder">
<Setter Property="Opacity" Value="1" />
</Style>
Expand Down

0 comments on commit 4be2c81

Please sign in to comment.