salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update dashboard and automation colors to new module scheme

Browse Source 
Dashboard widgets:
- WorkflowPipelineWidget: Sites now has transparent bg with colored icon
- Tasks stage uses navy (gray-700/800), Content/Drafts use blue (brand)
- AIOperationsWidget: Content now uses blue (brand) instead of green
- RecentActivityWidget: Content activity now uses blue (brand)
- QuickActionsWidget: Tasks step uses navy, Content uses blue

Automation components:
- AutomationPage STAGE_CONFIG: Tasks→Content now navy, Content→Prompts blue
- GlobalProgressBar: Updated stage colors to match new scheme
- CurrentProcessingCard: Stage colors match new module scheme

Color scheme:
- Planner Pipeline (Blue → Pink → Amber): Keywords, Clusters, Ideas
- Writer Pipeline (Navy → Blue → Pink → Green): Tasks, Content, Images, Published
This commit is contained in:
IGNY8 VPS (Salman)
2026-01-03 00:52:18 +00:00
parent 16dfc56ba0
commit e2d462d8b6
7 changed files with 82 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/pages/Automation/AutomationPage.tsx
View File

@@ -39,21 +39,23 @@ import {
} from '../../icons';
/**
* Pipeline stage configuration with consistent design system colors:
* - Keywords → Clusters: brand/primary (keywords side) to purple (clusters side)
* - Clusters → Ideas: purple to warning/amber
* - Ideas → Tasks: warning/amber to brand/primary
* - Tasks → Content: brand/primary to success/green
* - Content → Image Prompts: success to purple
* - Image Prompts → Images: purple
* - Review Gate: warning/amber
* Stage config with colors for visual distinction matching module color scheme:
* PLANNER PIPELINE (Blue → Pink → Amber):
* - Keywords→Clusters: brand/blue
* - Clusters→Ideas: purple/pink
* - Ideas→Tasks: warning/amber
* WRITER PIPELINE (Navy → Blue → Pink → Green):
* - Tasks→Content: gray-dark (navy) - entry point to Writer
* - Content→Prompts: brand/blue
* - Prompts→Images: purple/pink
* - Images→Publish: success/green
*/
const STAGE_CONFIG = [
{ icon: ListIcon, color: 'from-brand-500 to-brand-600', textColor: 'text-brand-600 dark:text-brand-400', bgColor: 'bg-brand-100 dark:bg-brand-900/30', hoverColor: 'hover:border-brand-500', name: 'Keywords → Clusters' },
{ icon: GroupIcon, color: 'from-purple-500 to-purple-600', textColor: 'text-purple-600 dark:text-purple-400', bgColor: 'bg-purple-100 dark:bg-purple-900/30', hoverColor: 'hover:border-purple-500', name: 'Clusters → Ideas' },
{ icon: BoltIcon, color: 'from-warning-500 to-warning-600', textColor: 'text-warning-600 dark:text-warning-400', bgColor: 'bg-warning-100 dark:bg-warning-900/30', hoverColor: 'hover:border-warning-500', name: 'Ideas → Tasks' },
{ icon: CheckCircleIcon, color: 'from-brand-500 to-brand-600', textColor: 'text-brand-600 dark:text-brand-400', bgColor: 'bg-brand-100 dark:bg-brand-900/30', hoverColor: 'hover:border-brand-500', name: 'Tasks → Content' },
{ icon: PencilIcon, color: 'from-success-500 to-success-600', textColor: 'text-success-600 dark:text-success-400', bgColor: 'bg-success-100 dark:bg-success-900/30', hoverColor: 'hover:border-success-500', name: 'Content → Image Prompts' },
{ icon: CheckCircleIcon, color: 'from-gray-700 to-gray-800', textColor: 'text-gray-700 dark:text-gray-300', bgColor: 'bg-gray-100 dark:bg-gray-800/30', hoverColor: 'hover:border-gray-500', name: 'Tasks → Content' },
{ icon: PencilIcon, color: 'from-brand-500 to-brand-600', textColor: 'text-brand-600 dark:text-brand-400', bgColor: 'bg-brand-100 dark:bg-brand-900/30', hoverColor: 'hover:border-brand-500', name: 'Content → Image Prompts' },
{ icon: FileIcon, color: 'from-purple-500 to-purple-600', textColor: 'text-purple-600 dark:text-purple-400', bgColor: 'bg-purple-100 dark:bg-purple-900/30', hoverColor: 'hover:border-purple-500', name: 'Image Prompts → Images' },
{ icon: PaperPlaneIcon, color: 'from-success-500 to-success-600', textColor: 'text-success-600 dark:text-success-400', bgColor: 'bg-success-100 dark:bg-success-900/30', hoverColor: 'hover:border-success-500', name: 'Review → Published' },
];