fix(ui): filled window icons, boxed task rows, proper explorer button

- Window controls (min/close) were stroke-only paths — PathIcon fills
  geometries, so only max rendered. Swap all three (and BrandCheck) to
  closed filled shapes.
- Task rows now have a 1px LineBrush border + rounded 8px box with
  subtle AccentSoft hover, matching the mock's visible row separation.
- "Open in explorer" button switched from icon-btn to btn class so it
  matches "Open diff" / "Worktree" framing, with a proper Lucide-style
  filled arrow geometry.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
mika kuns
2026-04-20 12:02:08 +02:00
parent 42fb7cee0d
commit e19a9d373e
2 changed files with 22 additions and 12 deletions

View File

@@ -18,12 +18,12 @@
<!-- ICON GEOMETRY RESOURCES --> <!-- ICON GEOMETRY RESOURCES -->
<!-- ============================================================ --> <!-- ============================================================ -->
<Styles.Resources> <Styles.Resources>
<!-- Window control icons (from icons.jsx: min, max, close) --> <!-- Window control icons — filled geometries (PathIcon fills, not strokes) -->
<StreamGeometry x:Key="Icon.WinMin">M5 10h10</StreamGeometry> <StreamGeometry x:Key="Icon.WinMin">M4 9 H16 V11 H4 Z</StreamGeometry>
<StreamGeometry x:Key="Icon.WinMax">M5 5 h10 v10 h-10 z</StreamGeometry> <StreamGeometry x:Key="Icon.WinMax">M4 4 H16 V6 H4 Z M4 14 H16 V16 H4 Z M4 4 H6 V16 H4 Z M14 4 H16 V16 H14 Z</StreamGeometry>
<StreamGeometry x:Key="Icon.WinClose">M5 5l14 14M19 5L5 19</StreamGeometry> <StreamGeometry x:Key="Icon.WinClose">M4 5 L5 4 L16 15 L15 16 Z M15 4 L16 5 L5 16 L4 15 Z</StreamGeometry>
<!-- Brand check glyph (checkbox-style tick inside a rounded square) --> <!-- Brand check glyph — filled rounded square with inset tick -->
<StreamGeometry x:Key="Icon.BrandCheck">M3 3 h18 v18 h-18 z M6 12 l4 4 8-8</StreamGeometry> <StreamGeometry x:Key="Icon.BrandCheck">M3 3 H21 V21 H3 Z M6 12 L7 11 L10 14 L17 7 L18 8 L10 16 Z</StreamGeometry>
<!-- ============================================================ --> <!-- ============================================================ -->
<!-- Icons — central icon library (Phase B) --> <!-- Icons — central icon library (Phase B) -->
@@ -78,6 +78,9 @@
<!-- Icon.Check --> <!-- Icon.Check -->
<StreamGeometry x:Key="Icon.Check">M4 12l5 5 11-11</StreamGeometry> <StreamGeometry x:Key="Icon.Check">M4 12l5 5 11-11</StreamGeometry>
<!-- Icon.ArrowOut — filled arrow for "open external" button -->
<StreamGeometry x:Key="Icon.ArrowOut">M13 4 H20 V11 H18 V7.4 L11.4 14 L10 12.6 L16.6 6 H13 Z M4 6 H10 V8 H6 V18 H16 V14 H18 V20 H4 Z</StreamGeometry>
</Styles.Resources> </Styles.Resources>
<!-- ============================================================ --> <!-- ============================================================ -->
@@ -249,21 +252,25 @@
<Setter Property="Padding" Value="12,10" /> <Setter Property="Padding" Value="12,10" />
<Setter Property="CornerRadius" Value="8" /> <Setter Property="CornerRadius" Value="8" />
<Setter Property="Background" Value="Transparent" /> <Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="{StaticResource LineBrush}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Margin" Value="0,0,0,6" />
<Setter Property="Cursor" Value="Hand" /> <Setter Property="Cursor" Value="Hand" />
<Setter Property="Transitions"> <Setter Property="Transitions">
<Transitions> <Transitions>
<BrushTransition Property="Background" Duration="0:0:0.10"/> <BrushTransition Property="Background" Duration="0:0:0.10"/>
<BrushTransition Property="BorderBrush" Duration="0:0:0.10"/>
</Transitions> </Transitions>
</Setter> </Setter>
</Style> </Style>
<Style Selector="Border.task-row:pointerover"> <Style Selector="Border.task-row:pointerover">
<Setter Property="Background" Value="{StaticResource Surface2Brush}" /> <Setter Property="Background" Value="{StaticResource AccentSoftBrush}" />
<Setter Property="BorderBrush" Value="{StaticResource LineBrightBrush}" />
</Style> </Style>
<Style Selector="Border.task-row.selected"> <Style Selector="Border.task-row.selected">
<Setter Property="Background" Value="{StaticResource Surface3Brush}" /> <Setter Property="Background" Value="{StaticResource Surface3Brush}" />
<Setter Property="BorderBrush" Value="{StaticResource AccentBrush}" /> <Setter Property="BorderBrush" Value="{StaticResource AccentBrush}" />
<Setter Property="BorderThickness" Value="0,0,0,0" /> <Setter Property="BorderThickness" Value="1" />
<!-- Left-edge accent bar: use a nested Border child with Width=2 instead of inset shadow -->
</Style> </Style>
<!-- Checkbox indicator (the 18px circle that replaces the native CheckBox template) --> <!-- Checkbox indicator (the 18px circle that replaces the native CheckBox template) -->

View File

@@ -124,9 +124,12 @@
<StackPanel Orientation="Horizontal" Spacing="6" Margin="0,4,0,0"> <StackPanel Orientation="Horizontal" Spacing="6" Margin="0,4,0,0">
<Button Classes="btn" Content="Open diff" Command="{Binding OpenDiffCommand}"/> <Button Classes="btn" Content="Open diff" Command="{Binding OpenDiffCommand}"/>
<Button Classes="btn" Content="Worktree" Command="{Binding OpenWorktreeCommand}"/> <Button Classes="btn" Content="Worktree" Command="{Binding OpenWorktreeCommand}"/>
<Button Classes="icon-btn" ToolTip.Tip="Open in file explorer" <Button Classes="btn" ToolTip.Tip="Open in file explorer"
Command="{Binding OpenInExplorerCommand}"> Command="{Binding OpenInExplorerCommand}"
<TextBlock Text="→" FontFamily="{DynamicResource MonoFont}" FontSize="13"/> Padding="8,6">
<PathIcon Data="{StaticResource Icon.ArrowOut}"
Width="12" Height="12"
Foreground="{DynamicResource TextDimBrush}"/>
</Button> </Button>
</StackPanel> </StackPanel>