refactor: move Color Panel into Adjustments tab
Reorganize the panel dock to use tabs more efficiently by moving the Color Panel from the always-visible section into the Adjustments tab. Changes: - **Panel Dock Layout**: * Always visible: Layers Panel only (50% height, min 300px) * Tabbed section: Takes up remaining 50% of dock space - **Adjustments Tab**: Now contains (in order): 1. Colors (collapsible, default open) 2. Filters (collapsible, default open) 3. Selection (collapsible, default open) 4. Transform (collapsible, default open) - **Tools Tab**: Contains: 1. Shape Settings (collapsible, default open) - **History Tab**: Contains: 1. History Panel (full height, not collapsible) Benefits: - More flexible space allocation - Layers Panel gets 50% of vertical space (was 400px fixed) - All adjustment features grouped together in one tab - Cleaner organization with collapsible sections - More canvas workspace visible by default - Consistent with professional image editor patterns Build Status: ✓ Successful (1330ms) 🤖 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -42,15 +42,11 @@ export function PanelDock() {
|
||||
|
||||
return (
|
||||
<div className="w-[280px] border-l border-border bg-card flex flex-col overflow-hidden">
|
||||
{/* Always visible panels */}
|
||||
<div className="border-b border-border" style={{ height: '400px' }}>
|
||||
{/* Always visible: Layers Panel */}
|
||||
<div className="border-b border-border" style={{ height: '50%', minHeight: '300px' }}>
|
||||
<LayersPanel />
|
||||
</div>
|
||||
|
||||
<div className="border-b border-border" style={{ height: '200px' }}>
|
||||
<ColorPanel />
|
||||
</div>
|
||||
|
||||
{/* Tabbed section */}
|
||||
<div className="flex-1 flex flex-col overflow-hidden">
|
||||
{/* Tab buttons */}
|
||||
@@ -91,6 +87,9 @@ export function PanelDock() {
|
||||
<div className="flex-1 overflow-y-auto">
|
||||
{activeTab === 'adjustments' && (
|
||||
<div>
|
||||
<CollapsibleSection title="Colors">
|
||||
<ColorPanel />
|
||||
</CollapsibleSection>
|
||||
<CollapsibleSection title="Filters">
|
||||
<FilterPanel />
|
||||
</CollapsibleSection>
|
||||
|
||||
Reference in New Issue
Block a user