style(ui): redesign MainWindow with reactive layout, sidebar polish, and list header

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Mika Kuns
2026-04-14 10:27:49 +02:00
parent 5b6c095a89
commit 2d6b5bbaff
2 changed files with 62 additions and 28 deletions

View File

@@ -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>

View File

@@ -38,4 +38,6 @@ public partial class MainWindow : Window
e.Handled = true;
}
}
private void OnGlobalKeyDown(object? sender, KeyEventArgs e) { }
}