releases/ClaudeDo
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

style(ui): island layout with Warm Charcoal theme (Rider-style)

Browse Source 
Replace flat columns with rounded island panels on a dark base.
Remove GridSplitters, add gap-based spacing between islands.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Mika Kuns
2026-04-14 10:52:52 +02:00
parent 5f51fe9621
commit c3fed45481
2 changed files with 83 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/ClaudeDo.App/App.axaml
View File

@@ -18,9 +18,11 @@
<SolidColorBrush x:Key="TextDimBrush" Color="#475569"/>
<!-- Borders & Backgrounds -->
<SolidColorBrush x:Key="BorderSubtleBrush" Color="#3a4560"/>
<SolidColorBrush x:Key="SidebarBgBrush" Color="#1a1a2e"/>
<SolidColorBrush x:Key="ContentBgBrush" Color="#16162a"/>
<SolidColorBrush x:Key="BorderSubtleBrush" Color="#3a3f46"/>
<SolidColorBrush x:Key="WindowBgBrush" Color="#1c1e21"/>
<SolidColorBrush x:Key="IslandBgBrush" Color="#272a2e"/>
<SolidColorBrush x:Key="SidebarBgBrush" Color="#272a2e"/>
<SolidColorBrush x:Key="ContentBgBrush" Color="#272a2e"/>
<!-- Status colors (for checkboxes) -->
<SolidColorBrush x:Key="StatusGrayBrush" Color="#475569"/>

151
src/ClaudeDo.Ui/Views/MainWindow.axaml
View File

@@ -11,88 +11,93 @@
MinWidth="800" MinHeight="500"
KeyDown="OnGlobalKeyDown">
<DockPanel>
<DockPanel Background="{StaticResource WindowBgBrush}">
<v:StatusBarView DockPanel.Dock="Bottom" DataContext="{Binding StatusBar}" />
<Grid ColumnDefinitions="1*,Auto,2*,Auto,1.5*">
<Grid ColumnDefinitions="1*,2*,1.5*" Margin="8,8,8,0">
<DockPanel Grid.Column="0" MinWidth="180" MaxWidth="320"
Background="{StaticResource SidebarBgBrush}">
<!-- Lists island -->
<Border Grid.Column="0" CornerRadius="12" Background="{StaticResource IslandBgBrush}"
MinWidth="180" MaxWidth="320" Margin="0,0,4,8" ClipToBounds="True">
<DockPanel>
<TextBlock DockPanel.Dock="Top"
Text="Lists" FontWeight="SemiBold" FontSize="13"
Foreground="{StaticResource TextSecondaryBrush}"
Margin="16,14,16,10"/>
<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>
<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}"
Background="Transparent"
Margin="4,0">
<ListBox.ItemTemplate>
<DataTemplate x:DataType="vm:ListItemViewModel">
<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}"/>
<MenuItem Header="Delete"
Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).DeleteListCommand}"/>
<Separator/>
<MenuItem Header="New Task"
Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).TaskList.AddTaskCommand}"/>
</MenuFlyout>
</Grid.ContextFlyout>
<ListBox x:Name="ListsBox"
ItemsSource="{Binding Lists}"
SelectedItem="{Binding SelectedList}"
Background="Transparent"
Margin="4,0">
<ListBox.ItemTemplate>
<DataTemplate x:DataType="vm:ListItemViewModel">
<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}"/>
<MenuItem Header="Delete"
Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).DeleteListCommand}"/>
<Separator/>
<MenuItem Header="New Task"
Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).TaskList.AddTaskCommand}"/>
</MenuFlyout>
</Grid.ContextFlyout>
<Ellipse Grid.Column="0" Width="8" Height="8"
Fill="{Binding DotBrush}"
VerticalAlignment="Center" Margin="0,0,10,0"/>
<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>
</DockPanel>
</Border>
<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>
</DockPanel>
<!-- Tasks island -->
<Border Grid.Column="1" CornerRadius="12" Background="{StaticResource IslandBgBrush}"
Margin="4,0,4,8" ClipToBounds="True">
<DockPanel>
<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>
</Border>
<GridSplitter Grid.Column="1" Width="4" ResizeDirection="Columns"/>
<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"/>
<v:TaskDetailView Grid.Column="4" DataContext="{Binding TaskDetail}"
MinWidth="280" MaxWidth="500" />
<!-- Detail island -->
<Border Grid.Column="2" CornerRadius="12" Background="{StaticResource IslandBgBrush}"
MinWidth="280" MaxWidth="500" Margin="4,0,0,8" ClipToBounds="True">
<v:TaskDetailView DataContext="{Binding TaskDetail}" />
</Border>
</Grid>
</DockPanel>
</Window>