From 2d6b5bbaffc522a3d0c13db5b95f0dfe80916592 Mon Sep 17 00:00:00 2001
From: Mika Kuns <mika.kuns@fb-tuning.de>
Date: Tue, 14 Apr 2026 10:27:49 +0200
Subject: [PATCH] style(ui): redesign MainWindow with reactive layout, sidebar
 polish, and list header

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/ClaudeDo.Ui/Views/MainWindow.axaml    | 88 +++++++++++++++--------
 src/ClaudeDo.Ui/Views/MainWindow.axaml.cs |  2 +
 2 files changed, 62 insertions(+), 28 deletions(-)

diff --git a/src/ClaudeDo.Ui/Views/MainWindow.axaml b/src/ClaudeDo.Ui/Views/MainWindow.axaml
index 0fe8f56..0fd43b8 100644
--- a/src/ClaudeDo.Ui/Views/MainWindow.axaml
+++ b/src/ClaudeDo.Ui/Views/MainWindow.axaml
@@ -7,32 +7,49 @@
         mc:Ignorable="d" d:DesignWidth="1200" d:DesignHeight="700"
         x:Class="ClaudeDo.Ui.Views.MainWindow"
         x:DataType="vm:MainWindowViewModel"
-        Title="ClaudeDo" Width="1200" Height="700"
-        MinWidth="800" MinHeight="500">
+        Title="ClaudeDo"
+        MinWidth="800" MinHeight="500"
+        KeyDown="OnGlobalKeyDown">
 
     <DockPanel>
-        <!-- Status Bar at bottom -->
         <v:StatusBarView DockPanel.Dock="Bottom" DataContext="{Binding StatusBar}" />
 
-        <!-- Main 3-column layout -->
-        <Grid ColumnDefinitions="220,Auto,*,Auto,350">
-            <!-- Lists pane -->
-            <DockPanel Grid.Column="0">
-                <StackPanel DockPanel.Dock="Top" Orientation="Horizontal" Margin="4">
-                    <TextBlock Text="Lists" FontWeight="Bold" FontSize="14" VerticalAlignment="Center" Margin="4,0"/>
-                </StackPanel>
-                <StackPanel DockPanel.Dock="Bottom" Orientation="Horizontal" Spacing="4" Margin="4">
-                    <Button Content="+" Command="{Binding AddListCommand}" ToolTip.Tip="Add List" MinWidth="30"/>
-                    <Button Content="E" Command="{Binding EditListCommand}" ToolTip.Tip="Edit List" MinWidth="30"/>
-                    <Button Content="-" Command="{Binding DeleteListCommand}" ToolTip.Tip="Delete List" MinWidth="30"/>
-                </StackPanel>
-                <ListBox ItemsSource="{Binding Lists}"
+        <Grid ColumnDefinitions="1*,Auto,2*,Auto,1.5*">
+
+            <DockPanel Grid.Column="0" MinWidth="180" MaxWidth="320"
+                       Background="{StaticResource SidebarBgBrush}">
+
+                <TextBlock DockPanel.Dock="Top"
+                           Text="Lists" FontWeight="SemiBold" FontSize="13"
+                           Foreground="{StaticResource TextSecondaryBrush}"
+                           Margin="16,14,16,10"/>
+
+                <Border DockPanel.Dock="Bottom" Padding="8,8"
+                        BorderThickness="0,1,0,0" BorderBrush="{StaticResource BorderSubtleBrush}">
+                    <Button Content="+ New List"
+                            Command="{Binding AddListCommand}"
+                            Background="Transparent"
+                            Foreground="{StaticResource AccentBrush}"
+                            BorderThickness="0"
+                            Padding="12,8"
+                            HorizontalAlignment="Stretch"
+                            HorizontalContentAlignment="Left"
+                            FontSize="13"
+                            Cursor="Hand"/>
+                </Border>
+
+                <ListBox x:Name="ListsBox"
+                         ItemsSource="{Binding Lists}"
                          SelectedItem="{Binding SelectedList}"
-                         Margin="4">
+                         Background="Transparent"
+                         Margin="4,0">
                     <ListBox.ItemTemplate>
                         <DataTemplate x:DataType="vm:ListItemViewModel">
-                            <StackPanel Margin="4,2" Background="Transparent" HorizontalAlignment="Stretch" DoubleTapped="OnListItemDoubleTapped" PointerPressed="OnListItemPointerPressed">
-                                <StackPanel.ContextFlyout>
+                            <Grid ColumnDefinitions="Auto,*" Margin="8,6"
+                                  Background="Transparent"
+                                  DoubleTapped="OnListItemDoubleTapped"
+                                  PointerPressed="OnListItemPointerPressed">
+                                <Grid.ContextFlyout>
                                     <MenuFlyout>
                                         <MenuItem Header="Edit"
                                                   Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).EditListCommand}"/>
@@ -42,11 +59,20 @@
                                         <MenuItem Header="New Task"
                                                   Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).TaskList.AddTaskCommand}"/>
                                     </MenuFlyout>
-                                </StackPanel.ContextFlyout>
-                                <TextBlock Text="{Binding Name}" FontWeight="SemiBold"/>
-                                <TextBlock Text="{Binding WorkingDir}" FontSize="10" Foreground="Gray"
-                                           IsVisible="{Binding WorkingDir, Converter={x:Static ObjectConverters.IsNotNull}}"/>
-                            </StackPanel>
+                                </Grid.ContextFlyout>
+
+                                <Ellipse Grid.Column="0" Width="8" Height="8"
+                                         Fill="{Binding DotBrush}"
+                                         VerticalAlignment="Center" Margin="0,0,10,0"/>
+
+                                <StackPanel Grid.Column="1">
+                                    <TextBlock Text="{Binding Name}" FontWeight="Medium"
+                                               Foreground="{StaticResource TextSecondaryBrush}"/>
+                                    <TextBlock Text="{Binding WorkingDir}" FontSize="10"
+                                               Foreground="{StaticResource TextDimBrush}"
+                                               IsVisible="{Binding WorkingDir, Converter={x:Static ObjectConverters.IsNotNull}}"/>
+                                </StackPanel>
+                            </Grid>
                         </DataTemplate>
                     </ListBox.ItemTemplate>
                 </ListBox>
@@ -54,13 +80,19 @@
 
             <GridSplitter Grid.Column="1" Width="4" ResizeDirection="Columns"/>
 
-            <!-- Tasks pane -->
-            <v:TaskListView Grid.Column="2" DataContext="{Binding TaskList}" />
+            <DockPanel Grid.Column="2" Background="{StaticResource ContentBgBrush}">
+                <TextBlock DockPanel.Dock="Top"
+                           Text="{Binding TaskList.ListName, FallbackValue='Tasks'}"
+                           FontWeight="SemiBold" FontSize="16"
+                           Foreground="{StaticResource TextPrimaryBrush}"
+                           Margin="16,14,16,10"/>
+                <v:TaskListView DataContext="{Binding TaskList}" />
+            </DockPanel>
 
             <GridSplitter Grid.Column="3" Width="4" ResizeDirection="Columns"/>
 
-            <!-- Detail pane -->
-            <v:TaskDetailView Grid.Column="4" DataContext="{Binding TaskDetail}" />
+            <v:TaskDetailView Grid.Column="4" DataContext="{Binding TaskDetail}"
+                              MinWidth="280" MaxWidth="500" />
         </Grid>
     </DockPanel>
 </Window>
diff --git a/src/ClaudeDo.Ui/Views/MainWindow.axaml.cs b/src/ClaudeDo.Ui/Views/MainWindow.axaml.cs
index fcd8c80..741c20c 100644
--- a/src/ClaudeDo.Ui/Views/MainWindow.axaml.cs
+++ b/src/ClaudeDo.Ui/Views/MainWindow.axaml.cs
@@ -38,4 +38,6 @@ public partial class MainWindow : Window
             e.Handled = true;
         }
     }
+
+    private void OnGlobalKeyDown(object? sender, KeyEventArgs e) { }
 }