Skip to content
This repository was archived by the owner on Jun 21, 2023. It is now read-only.

Commit b827b2e

Browse files
committed
Style X button and error icon
1 parent 4f13637 commit b827b2e

File tree

3 files changed

+90
-25
lines changed

3 files changed

+90
-25
lines changed

src/GitHub.App/SampleData/SampleViewModels.cs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -496,6 +496,6 @@ public bool OpenRepository()
496496

497497
public class InfoPanelDesigner
498498
{
499-
public string Message => "This is an informational message for the info panel to test things in design mode. This is not meant to be run in release.";
499+
public string Message => "This is an informational message for the info panel to test things in design mode.";
500500
}
501501
}

src/GitHub.UI/Controls/Buttons/OcticonButton.xaml

Lines changed: 75 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,32 +5,97 @@
55
<Setter Property="Foreground" Value="Black"/>
66
<Setter Property="Height" Value="16"/>
77
<Setter Property="Width" Value="16"/>
8+
<Setter Property="Margin" Value="0"/>
9+
<Setter Property="Padding" Value="0"/>
810
<Setter Property="HorizontalAlignment" Value="Center"/>
911
<Setter Property="VerticalAlignment" Value="Center"/>
12+
<Setter Property="BorderBrush" Value="Transparent"/>
1013
<Setter Property="Template">
1114
<Setter.Value>
1215
<ControlTemplate TargetType="ui:OcticonButton">
13-
<Grid x:Name="content" Background="Transparent">
16+
<Grid x:Name="content" Margin="{TemplateBinding Margin}" Background="Transparent">
17+
<VisualStateManager.VisualStateGroups>
18+
<VisualStateGroup x:Name="CommonStates">
19+
<VisualState x:Name="Normal"/>
20+
<VisualState x:Name="MouseOver">
21+
<Storyboard>
22+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverBorder" Storyboard.TargetProperty="(UIElement.Opacity)">
23+
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
24+
</DoubleAnimationUsingKeyFrames>
25+
</Storyboard>
26+
</VisualState>
27+
<VisualState x:Name="Pressed">
28+
<Storyboard>
29+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder" Storyboard.TargetProperty="(UIElement.Opacity)">
30+
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
31+
</DoubleAnimationUsingKeyFrames>
32+
</Storyboard>
33+
</VisualState>
34+
<VisualState x:Name="Disabled">
35+
<Storyboard>
36+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
37+
<SplineDoubleKeyFrame KeyTime="0" Value="0.5"/>
38+
</DoubleAnimationUsingKeyFrames>
39+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="(UIElement.Opacity)">
40+
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
41+
</DoubleAnimationUsingKeyFrames>
42+
</Storyboard>
43+
</VisualState>
44+
</VisualStateGroup>
45+
<VisualStateGroup x:Name="FocusStates">
46+
<VisualState x:Name="Focused"/>
47+
<VisualState x:Name="Unfocused"/>
48+
</VisualStateGroup>
49+
</VisualStateManager.VisualStateGroups>
1450
<Grid.ColumnDefinitions>
1551
<ColumnDefinition Width="Auto"/>
1652
</Grid.ColumnDefinitions>
17-
<ui:FixedAspectRatioPanel HorizontalContentAlignment="Center" VerticalContentAlignment="Center" IsHitTestVisible="False">
18-
<Viewbox>
53+
<Border x:Name="Background"
54+
Background="{TemplateBinding Background}"
55+
BorderBrush="{TemplateBinding BorderBrush}"
56+
BorderThickness="1"
57+
SnapsToDevicePixels="True"/>
58+
<Rectangle x:Name="DisabledVisualElement"
59+
Fill="#FFFCFCFC"
60+
IsHitTestVisible="False"
61+
Opacity="0"
62+
SnapsToDevicePixels="True"/>
63+
<Border x:Name="MouseOverBorder"
64+
Background="#FFDDDDE6"
65+
BorderBrush="{TemplateBinding BorderBrush}"
66+
BorderThickness="1"
67+
Opacity="0"
68+
SnapsToDevicePixels="True"/>
69+
<Border x:Name="PressedBorder"
70+
Background="#FFCFCFDB"
71+
BorderBrush="{TemplateBinding BorderBrush}"
72+
BorderThickness="1"
73+
Opacity="0"
74+
SnapsToDevicePixels="True"/>
75+
<Border x:Name="DefaultVisualElement"
76+
Background="Transparent"
77+
BorderBrush="{TemplateBinding BorderBrush}"
78+
BorderThickness="1"
79+
Opacity="0"
80+
SnapsToDevicePixels="True"/>
81+
<Viewbox xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="16" Height="16">
82+
<Border BorderBrush="Transparent" BorderThickness="1">
83+
1984
<ui:OcticonPath Height="16"
2085
Fill="{TemplateBinding Foreground}"
2186
Icon="{TemplateBinding Icon}"
2287
SnapsToDevicePixels="True"/>
23-
</Viewbox>
24-
</ui:FixedAspectRatioPanel>
88+
</Border>
89+
</Viewbox>
2590
</Grid>
2691
<ControlTemplate.Triggers>
27-
<Trigger Property="IsMouseOver" Value="True">
28-
<Setter TargetName="content" Property="Background" Value="#11FFFFFF"/>
92+
<Trigger Property="IsDefaulted" Value="True">
93+
<Setter TargetName="DefaultVisualElement" Property="Opacity" Value="1"/>
2994
</Trigger>
30-
<Trigger Property="IsPressed" Value="True">
31-
<Setter TargetName="content" Property="Background" Value="#11FFFFFF"/>
95+
<Trigger Property="IsKeyboardFocused" Value="True">
96+
<Setter TargetName="DefaultVisualElement" Property="Opacity" Value="1"/>
3297
</Trigger>
33-
</ControlTemplate.Triggers>
98+
</ControlTemplate.Triggers>
3499
</ControlTemplate>
35100
</Setter.Value>
36101
</Setter>

src/GitHub.VisualStudio.UI/UI/Controls/InfoPanel.xaml

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@
1212
d:DesignHeight="300"
1313
d:DesignWidth="300"
1414
mc:Ignorable="d">
15-
15+
1616
<UserControl.Resources>
1717
<ResourceDictionary>
1818
<ResourceDictionary.MergedDictionaries>
19-
<cache:SharedDictionaryManager Source="pack://application:,,,/GitHub.UI;component/SharedDictionary.xaml"/>
19+
<cache:SharedDictionaryManager Source="pack://application:,,,/GitHub.UI;component/SharedDictionary.xaml" />
2020
</ResourceDictionary.MergedDictionaries>
2121
</ResourceDictionary>
2222
</UserControl.Resources>
@@ -27,21 +27,21 @@
2727
Margin="0,0,8,0"
2828
VerticalAlignment="Top"
2929
DockPanel.Dock="Left"
30+
Foreground="DarkRed"
31+
Icon="alert" />
32+
<ui:OcticonButton Width="16"
33+
Height="16"
34+
Margin="0"
35+
VerticalAlignment="Top"
36+
DockPanel.Dock="Right"
3037
Foreground="Black"
31-
Icon="x"
32-
/>
33-
<ui:OcticonButton Width="32"
34-
Height="32"
35-
36-
VerticalAlignment="Top"
37-
DockPanel.Dock="Right"
38-
Foreground="Black"
39-
Icon="x"
40-
/>
38+
Background="Transparent"
39+
Click="Button_Click"
40+
Icon="x" />
4141
<TextBlock Margin="8,0"
4242
DockPanel.Dock="Top"
43-
Text="{Binding Message}"
4443
Foreground="Black"
45-
TextWrapping="Wrap"/>
44+
Text="{Binding Message}"
45+
TextWrapping="Wrap" />
4646
</DockPanel>
4747
</UserControl>

0 commit comments

Comments
 (0)