Skip to content

Commit 8495b24

Browse files
Merge pull request #294 from erikdarlingdata/ui/insight-cards
Insights panel: unify section borders into card style
2 parents 909290e + 159b1c7 commit 8495b24

2 files changed

Lines changed: 37 additions & 33 deletions

File tree

src/PlanViewer.App/Controls/PlanViewerControl.axaml

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,22 @@
22
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
33
x:Class="PlanViewer.App.Controls.PlanViewerControl"
44
Background="{DynamicResource BackgroundBrush}">
5+
<UserControl.Styles>
6+
<Style Selector="Border.InsightCard">
7+
<Setter Property="Background" Value="{DynamicResource InsightCardBackgroundBrush}"/>
8+
<Setter Property="BorderBrush" Value="{DynamicResource InsightCardBorderBrush}"/>
9+
<Setter Property="BorderThickness" Value="1"/>
10+
<Setter Property="CornerRadius" Value="8"/>
11+
<Setter Property="BoxShadow" Value="0 4 12 0 #60000000"/>
12+
<Setter Property="Padding" Value="12,8,12,10"/>
13+
<Setter Property="Margin" Value="0,0,8,0"/>
14+
</Style>
15+
<Style Selector="TextBlock.InsightHeader">
16+
<Setter Property="FontSize" Value="14"/>
17+
<Setter Property="FontWeight" Value="SemiBold"/>
18+
<Setter Property="Margin" Value="0,0,0,8"/>
19+
</Style>
20+
</UserControl.Styles>
521
<Grid>
622
<Grid.RowDefinitions>
723
<RowDefinition Height="Auto"/>
@@ -74,7 +90,7 @@
7490
FontWeight="SemiBold"
7591
Foreground="{DynamicResource ForegroundBrush}"/>
7692
</Expander.Header>
77-
<Grid MaxHeight="220" HorizontalAlignment="Stretch">
93+
<Grid MaxHeight="240" Margin="8,4,8,8" HorizontalAlignment="Stretch">
7894
<Grid.ColumnDefinitions>
7995
<ColumnDefinition Width="Auto" MinWidth="0"/>
8096
<ColumnDefinition Width="Auto" MinWidth="180"/>
@@ -84,18 +100,14 @@
84100
</Grid.ColumnDefinitions>
85101

86102
<!-- Server Context (first, placeholder when no metadata) -->
87-
<Border x:Name="ServerContextBorder" Grid.Column="0" Padding="10,4,10,8"
88-
Background="#1A1A2D"
89-
BorderBrush="#3A3A5A" BorderThickness="0,0,1,0"
103+
<Border x:Name="ServerContextBorder" Grid.Column="0" Classes="InsightCard"
90104
IsVisible="False">
91105
<ScrollViewer VerticalScrollBarVisibility="Auto"
92106
HorizontalScrollBarVisibility="Disabled">
93107
<StackPanel>
94-
<TextBlock Text="Server Context"
95-
FontSize="13"
96-
FontWeight="SemiBold"
97-
Foreground="#9B9BFF"
98-
Margin="0,0,0,6"/>
108+
<TextBlock Classes="InsightHeader"
109+
Text="Server Context"
110+
Foreground="#9B9BFF"/>
99111
<StackPanel x:Name="ServerContextContent"/>
100112
<TextBlock x:Name="ServerContextEmpty"
101113
Text="Run Repro Script to capture server context"
@@ -106,16 +118,12 @@
106118
</Border>
107119

108120
<!-- Runtime Summary -->
109-
<Border Grid.Column="1" Padding="10,4,10,8"
110-
Background="{DynamicResource BackgroundDarkBrush}"
111-
BorderBrush="{DynamicResource BorderBrush}" BorderThickness="0,0,1,0">
121+
<Border Grid.Column="1" Classes="InsightCard">
112122
<StackPanel>
113123
<TextBlock x:Name="RuntimeSummaryTitle"
124+
Classes="InsightHeader"
114125
Text="Runtime Summary"
115-
FontSize="13"
116-
FontWeight="SemiBold"
117-
Foreground="{DynamicResource ForegroundBrush}"
118-
Margin="0,0,0,4"/>
126+
Foreground="{DynamicResource ForegroundBrush}"/>
119127
<StackPanel x:Name="RuntimeSummaryContent"/>
120128
<TextBlock x:Name="RuntimeSummaryEmpty"
121129
Text="Estimated plan — no runtime stats"
@@ -125,17 +133,14 @@
125133
</Border>
126134

127135
<!-- Missing Indexes (center) -->
128-
<Border Grid.Column="2" Padding="10,4,10,8"
129-
Background="#3D2A0E"
130-
BorderBrush="#7A5A1E" BorderThickness="0,0,1,0">
136+
<Border Grid.Column="2" Classes="InsightCard">
131137
<ScrollViewer VerticalScrollBarVisibility="Auto"
132138
HorizontalScrollBarVisibility="Disabled">
133139
<StackPanel>
134140
<TextBlock x:Name="MissingIndexHeader"
141+
Classes="InsightHeader"
135142
Text="Missing Index Suggestions"
136-
FontSize="13"
137-
FontWeight="SemiBold" Foreground="#FFB347"
138-
Margin="0,0,0,6"/>
143+
Foreground="#FFB347"/>
139144
<StackPanel x:Name="MissingIndexContent"/>
140145
<TextBlock x:Name="MissingIndexEmpty"
141146
Text="No missing index suggestions"
@@ -146,17 +151,14 @@
146151
</Border>
147152

148153
<!-- Parameters -->
149-
<Border Grid.Column="3" Padding="10,4,10,8"
150-
Background="#1A2D1A"
151-
BorderBrush="#3A5A3A" BorderThickness="0,0,1,0">
154+
<Border Grid.Column="3" Classes="InsightCard">
152155
<ScrollViewer VerticalScrollBarVisibility="Auto"
153156
HorizontalScrollBarVisibility="Disabled">
154157
<StackPanel>
155158
<TextBlock x:Name="ParametersHeader"
159+
Classes="InsightHeader"
156160
Text="Parameters"
157-
FontSize="13"
158-
FontWeight="SemiBold" Foreground="#7BCF7B"
159-
Margin="0,0,0,6"/>
161+
Foreground="#7BCF7B"/>
160162
<StackPanel x:Name="ParametersContent"/>
161163
<TextBlock x:Name="ParametersEmpty"
162164
Text="No parameters"
@@ -167,16 +169,14 @@
167169
</Border>
168170

169171
<!-- Wait Stats (right, fills remaining space) -->
170-
<Border Grid.Column="4" Padding="10,4,10,8"
171-
Background="#1A2A3D">
172+
<Border Grid.Column="4" Classes="InsightCard" Margin="0">
172173
<ScrollViewer VerticalScrollBarVisibility="Auto"
173174
HorizontalScrollBarVisibility="Auto">
174175
<StackPanel>
175176
<TextBlock x:Name="WaitStatsHeader"
177+
Classes="InsightHeader"
176178
Text="Wait Stats"
177-
FontSize="13"
178-
FontWeight="SemiBold" Foreground="#4FA3FF"
179-
Margin="0,0,0,6"/>
179+
Foreground="#4FA3FF"/>
180180
<StackPanel x:Name="WaitStatsContent"/>
181181
<TextBlock x:Name="WaitStatsEmpty"
182182
Text="No wait stats (estimated plan)"

src/PlanViewer.App/Themes/DarkTheme.axaml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,10 @@
88
<SolidColorBrush x:Key="BorderBrush" Color="#3A3D45"/>
99
<SolidColorBrush x:Key="AccentBrush" Color="#2eaef1"/>
1010

11+
<!-- Insight card surfaces (lifted from BackgroundDarkBrush so cards visibly float) -->
12+
<SolidColorBrush x:Key="InsightCardBackgroundBrush" Color="#1E2228"/>
13+
<SolidColorBrush x:Key="InsightCardBorderBrush" Color="#353942"/>
14+
1115
<!-- Fluent theme accent override: TabItem selected underline, focus rings, etc. -->
1216
<Color x:Key="SystemAccentColor">#2eaef1</Color>
1317
<Color x:Key="SystemAccentColorDark1">#2596d4</Color>

0 commit comments

Comments
 (0)