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

phase 3 complete

Browse Source
This commit is contained in:
Desktop
2025-11-14 15:07:01 +05:00
parent 27465457d5
commit 00301c2ae8
7 changed files with 77 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/marketing/pages/Partners.tsx
View File

@@ -112,7 +112,7 @@ const Partners: React.FC = () => {
<p className="text-sm text-slate-600 font-medium">{tier.description}</p> <p className="text-sm text-slate-600 font-medium">{tier.description}</p>
<ul className="space-y-4 text-sm text-slate-700 flex-1"> <ul className="space-y-4 text-sm text-slate-700 flex-1">
{tier.benefits.map((benefit, benefitIdx) => { {tier.benefits.map((benefit, benefitIdx) => {
const dotColors = ["bg-[var(--color-primary)]", "bg-[var(--color-success)]", "igny8-bg-amber", "igny8-bg-purple"]; const dotColors = ["bg-[var(--color-primary)]", "bg-[var(--color-success)]", "bg-[var(--color-warning)]", "bg-[var(--color-purple)]"];
return ( return (
<li key={benefit} className="flex gap-3"> <li key={benefit} className="flex gap-3">
<span className={`mt-1.5 size-2 rounded-full ${dotColors[benefitIdx % dotColors.length]} shadow-sm flex-shrink-0`} /> <span className={`mt-1.5 size-2 rounded-full ${dotColors[benefitIdx % dotColors.length]} shadow-sm flex-shrink-0`} />
@@ -169,7 +169,7 @@ const Partners: React.FC = () => {
{[ {[
{ text: "Sales playbooks, ROI calculators, and demo environments.", color: "bg-[var(--color-primary)]" }, { text: "Sales playbooks, ROI calculators, and demo environments.", color: "bg-[var(--color-primary)]" },
{ text: "Shared Slack channels with Igny8 product and marketing teams.", color: "bg-[var(--color-success)]" }, { text: "Shared Slack channels with Igny8 product and marketing teams.", color: "bg-[var(--color-success)]" },
{ text: "Quarterly partner labs to showcase launches and integrations.", color: "igny8-bg-amber" }, { text: "Quarterly partner labs to showcase launches and integrations.", color: "bg-[var(--color-warning)]" },
].map((item, index) => ( ].map((item, index) => (
<li key={item.text} className="flex gap-3"> <li key={item.text} className="flex gap-3">
<span className={`mt-1.5 size-2 rounded-full ${item.color} shadow-sm flex-shrink-0`} /> <span className={`mt-1.5 size-2 rounded-full ${item.color} shadow-sm flex-shrink-0`} />

6
frontend/src/marketing/pages/Solutions.tsx
View File

@@ -99,7 +99,7 @@ const Solutions: React.FC = () => {
borderColor: "border-[var(--color-purple)]/20", borderColor: "border-[var(--color-purple)]/20",
iconColor: "from-[var(--color-purple)] to-[var(--color-purple-dark)]", iconColor: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
painColor: "bg-rose-500", painColor: "bg-rose-500",
outcomeColor: "igny8-bg-purple", outcomeColor: "bg-[var(--color-purple)]",
}, },
]; ];
@@ -215,8 +215,8 @@ const Solutions: React.FC = () => {
{/* Right: IGNY8 Outcomes */} {/* Right: IGNY8 Outcomes */}
<div className="bg-white rounded-2xl border-2 border-slate-200 p-8 shadow-sm"> <div className="bg-white rounded-2xl border-2 border-slate-200 p-8 shadow-sm">
<div className="flex items-center gap-2 mb-6"> <div className="flex items-center gap-2 mb-6">
<CheckCircleIcon className={`h-5 w-5 ${persona.outcomeColor === 'bg-[var(--color-primary)]' ? 'text-[var(--color-primary)]' : persona.outcomeColor === 'bg-[var(--color-success)]' ? 'igny8-text-green' : 'igny8-text-purple'}`} /> <CheckCircleIcon className={`h-5 w-5 ${persona.outcomeColor === 'bg-[var(--color-primary)]' ? 'text-[var(--color-primary)]' : persona.outcomeColor === 'bg-[var(--color-success)]' ? 'text-[var(--color-success)]' : 'text-[var(--color-purple)]'}`} />
<h4 className={`text-sm uppercase tracking-[0.2em] font-semibold ${persona.outcomeColor === 'bg-[var(--color-primary)]' ? 'text-[var(--color-primary)]' : persona.outcomeColor === 'bg-[var(--color-success)]' ? 'igny8-text-green' : 'igny8-text-purple'}`}> <h4 className={`text-sm uppercase tracking-[0.2em] font-semibold ${persona.outcomeColor === 'bg-[var(--color-primary)]' ? 'text-[var(--color-primary)]' : persona.outcomeColor === 'bg-[var(--color-success)]' ? 'text-[var(--color-success)]' : 'text-[var(--color-purple)]'}`}>
IGNY8 Outcomes IGNY8 Outcomes
</h4> </h4>
</div> </div>

28
frontend/src/pages/Automation/Dashboard.tsx
View File

@@ -123,7 +123,7 @@ export default function AutomationDashboard() {
nextRun: "4 hours", nextRun: "4 hours",
coverage: 85, coverage: 85,
icon: PaperPlaneIcon, icon: PaperPlaneIcon,
color: "from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)]", color: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
}, },
{ {
id: 2, id: 2,
@@ -135,7 +135,7 @@ export default function AutomationDashboard() {
nextRun: "2 hours", nextRun: "2 hours",
coverage: 92, coverage: 92,
icon: FileTextIcon, icon: FileTextIcon,
color: "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]", color: "from-[var(--color-success)] to-[var(--color-success-dark)]",
}, },
{ {
id: 3, id: 3,
@@ -147,7 +147,7 @@ export default function AutomationDashboard() {
nextRun: "3 hours", nextRun: "3 hours",
coverage: 78, coverage: 78,
icon: ListIcon, icon: ListIcon,
color: "from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)]", color: "from-[var(--color-primary)] to-[var(--color-primary-dark)]",
}, },
]; ];
@@ -225,7 +225,7 @@ export default function AutomationDashboard() {
position: "top", position: "top",
labels: { colors: "#6b7280" }, labels: { colors: "#6b7280" },
}, },
colors: ["var(--igny8-blue)", "var(--igny8-green)", "var(--igny8-purple)"], colors: ["var(--color-primary)", "var(--color-success)", "var(--color-purple)"],
grid: { grid: {
borderColor: "#e5e7eb", borderColor: "#e5e7eb",
}, },
@@ -319,7 +319,7 @@ export default function AutomationDashboard() {
</div> </div>
<div className="flex items-center justify-between text-xs text-slate-600"> <div className="flex items-center justify-between text-xs text-slate-600">
<span>Next Run:</span> <span>Next Run:</span>
<span className="font-semibold text-[var(--igny8-blue)]">{workflow.nextRun}</span> <span className="font-semibold text-[var(--color-primary)]">{workflow.nextRun}</span>
</div> </div>
</div> </div>
<div className="mb-4"> <div className="mb-4">
@@ -334,7 +334,7 @@ export default function AutomationDashboard() {
<CloseIcon className="h-4 w-4" /> <CloseIcon className="h-4 w-4" />
Pause Pause
</button> </button>
<button className="flex-1 inline-flex items-center justify-center gap-2 rounded-lg bg-gradient-to-r from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] text-white px-4 py-2 text-sm font-semibold hover:shadow-lg transition"> <button className="flex-1 inline-flex items-center justify-center gap-2 rounded-lg bg-gradient-to-r from-[var(--color-primary)] to-[var(--color-primary-dark)] text-white px-4 py-2 text-sm font-semibold hover:shadow-lg transition">
<PaperPlaneIcon className="h-4 w-4" /> <PaperPlaneIcon className="h-4 w-4" />
Run Now Run Now
</button> </button>
@@ -360,14 +360,14 @@ export default function AutomationDashboard() {
<div className="flex items-center justify-between mb-3"> <div className="flex items-center justify-between mb-3">
<div className={`inline-flex size-10 rounded-lg bg-gradient-to-br ${ <div className={`inline-flex size-10 rounded-lg bg-gradient-to-br ${
isEnabled isEnabled
? "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]" ? "from-[var(--color-success)] to-[var(--color-success-dark)]"
: "from-slate-300 to-slate-400" : "from-slate-300 to-slate-400"
} items-center justify-center text-white shadow-md`}> } items-center justify-center text-white shadow-md`}>
<Icon className="h-5 w-5" /> <Icon className="h-5 w-5" />
</div> </div>
<div className={`size-5 rounded-full border-2 flex items-center justify-center ${ <div className={`size-5 rounded-full border-2 flex items-center justify-center ${
isEnabled isEnabled
? "border-[var(--igny8-green)] bg-[var(--igny8-green)]" ? "border-[var(--color-success)] bg-[var(--color-success)]"
: "border-slate-300 bg-white" : "border-slate-300 bg-white"
}`}> }`}>
{isEnabled && <CheckCircleIcon className="h-3 w-3 text-white" />} {isEnabled && <CheckCircleIcon className="h-3 w-3 text-white" />}
@@ -375,7 +375,7 @@ export default function AutomationDashboard() {
</div> </div>
<h4 className="font-semibold text-slate-900 mb-1">{step.step}</h4> <h4 className="font-semibold text-slate-900 mb-1">{step.step}</h4>
<p className="text-xs text-slate-600">{step.description}</p> <p className="text-xs text-slate-600">{step.description}</p>
<div className="mt-3 flex items-center gap-1 text-xs text-[var(--igny8-blue)] opacity-0 group-hover:opacity-100 transition"> <div className="mt-3 flex items-center gap-1 text-xs text-[var(--color-primary)] opacity-0 group-hover:opacity-100 transition">
<span>Configure</span> <span>Configure</span>
<ArrowRightIcon className="h-3 w-3" /> <ArrowRightIcon className="h-3 w-3" />
</div> </div>
@@ -401,7 +401,7 @@ export default function AutomationDashboard() {
key={activity.id} key={activity.id}
className="flex items-center gap-4 p-4 rounded-lg border border-slate-200 bg-white" className="flex items-center gap-4 p-4 rounded-lg border border-slate-200 bg-white"
> >
<div className="size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-md"> <div className="size-10 rounded-lg bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-md">
<BoltIcon className="h-5 w-5" /> <BoltIcon className="h-5 w-5" />
</div> </div>
<div className="flex-1"> <div className="flex-1">
@@ -434,21 +434,21 @@ export default function AutomationDashboard() {
onClick={() => navigate("/planner/keyword-opportunities")} onClick={() => navigate("/planner/keyword-opportunities")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0693e3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0693e3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-lg">
<ListIcon className="h-6 w-6" /> <ListIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Run Planner Workflow</h4> <h4 className="font-semibold text-slate-900 mb-1">Run Planner Workflow</h4>
<p className="text-sm text-slate-600">Keywords → Clusters → Ideas</p> <p className="text-sm text-slate-600">Keywords → Clusters → Ideas</p>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
</button> </button>
<button <button
onClick={() => navigate("/writer/tasks")} onClick={() => navigate("/writer/tasks")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-lg">
<FileTextIcon className="h-6 w-6" /> <FileTextIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -462,7 +462,7 @@ export default function AutomationDashboard() {
onClick={() => navigate("/writer/published")} onClick={() => navigate("/writer/published")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-purple)] to-[var(--color-purple-dark)] flex items-center justify-center text-white shadow-lg">
<PaperPlaneIcon className="h-6 w-6" /> <PaperPlaneIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">

24
frontend/src/pages/Dashboard/Home.tsx
View File

@@ -125,7 +125,7 @@ export default function Home() {
title: "Planner", title: "Planner",
description: "Keyword research, clustering, and content planning", description: "Keyword research, clustering, and content planning",
icon: PieChartIcon, icon: PieChartIcon,
color: "from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)]", color: "from-[var(--color-primary)] to-[var(--color-primary-dark)]",
path: "/planner", path: "/planner",
count: insights?.totalClusters || 0, count: insights?.totalClusters || 0,
status: "active", status: "active",
@@ -135,7 +135,7 @@ export default function Home() {
title: "Writer", title: "Writer",
description: "AI content generation, editing, and publishing", description: "AI content generation, editing, and publishing",
icon: PencilIcon, icon: PencilIcon,
color: "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]", color: "from-[var(--color-success)] to-[var(--color-success-dark)]",
path: "/writer", path: "/writer",
count: insights?.totalContent || 0, count: insights?.totalContent || 0,
status: "active", status: "active",
@@ -145,7 +145,7 @@ export default function Home() {
title: "Thinker", title: "Thinker",
description: "Prompts, author profiles, and content strategies", description: "Prompts, author profiles, and content strategies",
icon: BoltIcon, icon: BoltIcon,
color: "from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)]", color: "from-[var(--color-warning)] to-[var(--color-warning-dark)]",
path: "/thinker", path: "/thinker",
count: 0, count: 0,
status: "active", status: "active",
@@ -155,7 +155,7 @@ export default function Home() {
title: "Automation", title: "Automation",
description: "Workflow automation and scheduled tasks", description: "Workflow automation and scheduled tasks",
icon: PlugInIcon, icon: PlugInIcon,
color: "from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)]", color: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
path: "/automation", path: "/automation",
count: 0, count: 0,
status: "active", status: "active",
@@ -272,7 +272,7 @@ export default function Home() {
position: "top", position: "top",
labels: { colors: "#6b7280" }, labels: { colors: "#6b7280" },
}, },
colors: ["var(--igny8-blue)", "var(--igny8-green)", "var(--igny8-purple)"], colors: ["var(--color-primary)", "var(--color-success)", "var(--color-purple)"],
grid: { grid: {
borderColor: "#e5e7eb", borderColor: "#e5e7eb",
}, },
@@ -421,7 +421,7 @@ export default function Home() {
<div className="text-2xl font-bold text-slate-900">{module.count}</div> <div className="text-2xl font-bold text-slate-900">{module.count}</div>
<div className="text-xs text-slate-500">{module.metric}</div> <div className="text-xs text-slate-500">{module.metric}</div>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] group-hover:translate-x-1 transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
</div> </div>
</Link> </Link>
); );
@@ -510,23 +510,23 @@ export default function Home() {
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<Link <Link
to="/planner/keyword-opportunities" to="/planner/keyword-opportunities"
className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[var(--igny8-blue)] hover:shadow-md transition group" className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[var(--color-primary)] hover:shadow-md transition group"
> >
<div className="size-12 rounded-lg bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white"> <div className="size-12 rounded-lg bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white">
<ListIcon className="h-6 w-6" /> <ListIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1"> <div className="flex-1">
<h4 className="font-semibold text-slate-900">Add Keywords</h4> <h4 className="font-semibold text-slate-900">Add Keywords</h4>
<p className="text-xs text-slate-600">Discover new opportunities</p> <p className="text-xs text-slate-600">Discover new opportunities</p>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
</Link> </Link>
<Link <Link
to="/writer/tasks" to="/writer/tasks"
className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-md transition group" className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-md transition group"
> >
<div className="size-12 rounded-lg bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white"> <div className="size-12 rounded-lg bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white">
<FileTextIcon className="h-6 w-6" /> <FileTextIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1"> <div className="flex-1">
@@ -540,7 +540,7 @@ export default function Home() {
to="/automation" to="/automation"
className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-md transition group" className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-md transition group"
> >
<div className="size-12 rounded-lg bg-gradient-to-br from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)] flex items-center justify-center text-white"> <div className="size-12 rounded-lg bg-gradient-to-br from-[var(--color-purple)] to-[var(--color-purple-dark)] flex items-center justify-center text-white">
<PlugInIcon className="h-6 w-6" /> <PlugInIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1"> <div className="flex-1">
@@ -554,7 +554,7 @@ export default function Home() {
to="/thinker/prompts" to="/thinker/prompts"
className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-md transition group" className="flex items-center gap-4 p-4 rounded-lg border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-md transition group"
> >
<div className="size-12 rounded-lg bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white"> <div className="size-12 rounded-lg bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white">
<BoltIcon className="h-6 w-6" /> <BoltIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1"> <div className="flex-1">

30
frontend/src/pages/Planner/Dashboard.tsx
View File

@@ -192,7 +192,7 @@ export default function PlannerDashboard() {
title: "Keywords", title: "Keywords",
description: "Manage and discover keywords", description: "Manage and discover keywords",
icon: ListIcon, icon: ListIcon,
color: "from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)]", color: "from-[var(--color-primary)] to-[var(--color-primary-dark)]",
path: "/planner/keywords", path: "/planner/keywords",
count: stats?.keywords.total || 0, count: stats?.keywords.total || 0,
metric: `${stats?.keywords.mapped || 0} mapped`, metric: `${stats?.keywords.mapped || 0} mapped`,
@@ -201,7 +201,7 @@ export default function PlannerDashboard() {
title: "Clusters", title: "Clusters",
description: "Keyword clusters and groups", description: "Keyword clusters and groups",
icon: GroupIcon, icon: GroupIcon,
color: "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]", color: "from-[var(--color-success)] to-[var(--color-success-dark)]",
path: "/planner/clusters", path: "/planner/clusters",
count: stats?.clusters.total || 0, count: stats?.clusters.total || 0,
metric: `${stats?.clusters.totalVolume.toLocaleString() || 0} volume`, metric: `${stats?.clusters.totalVolume.toLocaleString() || 0} volume`,
@@ -210,7 +210,7 @@ export default function PlannerDashboard() {
title: "Ideas", title: "Ideas",
description: "Content ideas and concepts", description: "Content ideas and concepts",
icon: BoltIcon, icon: BoltIcon,
color: "from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)]", color: "from-[var(--color-warning)] to-[var(--color-warning-dark)]",
path: "/planner/ideas", path: "/planner/ideas",
count: stats?.ideas.total || 0, count: stats?.ideas.total || 0,
metric: `${stats?.ideas.queued || 0} queued`, metric: `${stats?.ideas.queued || 0} queued`,
@@ -219,7 +219,7 @@ export default function PlannerDashboard() {
title: "Keyword Opportunities", title: "Keyword Opportunities",
description: "Discover new keyword opportunities", description: "Discover new keyword opportunities",
icon: PieChartIcon, icon: PieChartIcon,
color: "from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)]", color: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
path: "/planner/keyword-opportunities", path: "/planner/keyword-opportunities",
count: 0, count: 0,
metric: "Discover new keywords", metric: "Discover new keywords",
@@ -275,7 +275,7 @@ export default function PlannerDashboard() {
position: "top", position: "top",
labels: { colors: "#6b7280" }, labels: { colors: "#6b7280" },
}, },
colors: ["var(--igny8-blue)", "var(--igny8-green)", "var(--igny8-amber)"], colors: ["var(--color-primary)", "var(--color-success)", "var(--color-warning)"],
grid: { grid: {
borderColor: "#e5e7eb", borderColor: "#e5e7eb",
}, },
@@ -522,7 +522,7 @@ export default function PlannerDashboard() {
<div className="text-2xl font-bold text-slate-900">{module.count}</div> <div className="text-2xl font-bold text-slate-900">{module.count}</div>
<div className="text-xs text-slate-500">{module.metric}</div> <div className="text-xs text-slate-500">{module.metric}</div>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] group-hover:translate-x-1 transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
</div> </div>
</Link> </Link>
); );
@@ -636,23 +636,23 @@ export default function PlannerDashboard() {
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<Link <Link
to="/planner/keyword-opportunities" to="/planner/keyword-opportunities"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--igny8-blue)] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--color-primary)] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-lg">
<ListIcon className="h-6 w-6" /> <ListIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Add Keywords</h4> <h4 className="font-semibold text-slate-900 mb-1">Add Keywords</h4>
<p className="text-sm text-slate-600">Discover opportunities</p> <p className="text-sm text-slate-600">Discover opportunities</p>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
</Link> </Link>
<Link <Link
to="/planner/clusters" to="/planner/clusters"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-lg">
<GroupIcon className="h-6 w-6" /> <GroupIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -666,7 +666,7 @@ export default function PlannerDashboard() {
to="/planner/ideas" to="/planner/ideas"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-lg">
<BoltIcon className="h-6 w-6" /> <BoltIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -680,7 +680,7 @@ export default function PlannerDashboard() {
to="/automation" to="/automation"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-purple)] to-[var(--color-purple-dark)] flex items-center justify-center text-white shadow-lg">
<PlugInIcon className="h-6 w-6" /> <PlugInIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -697,7 +697,7 @@ export default function PlannerDashboard() {
<ComponentCard title="How Planner Works" desc="Understanding the planning workflow"> <ComponentCard title="How Planner Works" desc="Understanding the planning workflow">
<div className="space-y-4"> <div className="space-y-4">
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-md">
<ListIcon className="h-5 w-5" /> <ListIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -708,7 +708,7 @@ export default function PlannerDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-md">
<GroupIcon className="h-5 w-5" /> <GroupIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -719,7 +719,7 @@ export default function PlannerDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-md">
<BoltIcon className="h-5 w-5" /> <BoltIcon className="h-5 w-5" />
</div> </div>
<div> <div>

32
frontend/src/pages/Thinker/Dashboard.tsx
View File

@@ -67,7 +67,7 @@ export default function ThinkerDashboard() {
title: "Prompt Library", title: "Prompt Library",
description: "Centralized prompt templates and AI instructions", description: "Centralized prompt templates and AI instructions",
icon: FileTextIcon, icon: FileTextIcon,
color: "from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)]", color: "from-[var(--color-warning)] to-[var(--color-warning-dark)]",
path: "/thinker/prompts", path: "/thinker/prompts",
count: stats?.totalPrompts || 0, count: stats?.totalPrompts || 0,
status: "active", status: "active",
@@ -76,7 +76,7 @@ export default function ThinkerDashboard() {
title: "Author Profiles", title: "Author Profiles",
description: "Voice templates and writing style guides", description: "Voice templates and writing style guides",
icon: UserIcon, icon: UserIcon,
color: "from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)]", color: "from-[var(--color-primary)] to-[var(--color-primary-dark)]",
path: "/thinker/profiles", path: "/thinker/profiles",
count: stats?.activeProfiles || 0, count: stats?.activeProfiles || 0,
status: "active", status: "active",
@@ -85,7 +85,7 @@ export default function ThinkerDashboard() {
title: "Content Strategies", title: "Content Strategies",
description: "Brand playbooks and content frameworks", description: "Brand playbooks and content frameworks",
icon: ShootingStarIcon, icon: ShootingStarIcon,
color: "from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)]", color: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
path: "/thinker/strategies", path: "/thinker/strategies",
count: stats?.strategies || 0, count: stats?.strategies || 0,
status: "active", status: "active",
@@ -94,7 +94,7 @@ export default function ThinkerDashboard() {
title: "Governance", title: "Governance",
description: "Track AI usage, compliance, and version control", description: "Track AI usage, compliance, and version control",
icon: PieChartIcon, icon: PieChartIcon,
color: "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]", color: "from-[var(--color-success)] to-[var(--color-success-dark)]",
path: "/thinker/governance", path: "/thinker/governance",
count: 0, count: 0,
status: "coming-soon", status: "coming-soon",
@@ -131,7 +131,7 @@ export default function ThinkerDashboard() {
height: 300, height: 300,
}, },
labels: ["Content Generation", "Content Planning", "Image Prompts", "Other"], labels: ["Content Generation", "Content Planning", "Image Prompts", "Other"],
colors: ["var(--igny8-amber)", "var(--igny8-blue)", "var(--igny8-purple)", "var(--igny8-green)"], colors: ["var(--color-warning)", "var(--color-primary)", "var(--color-purple)", "var(--color-success)"],
legend: { legend: {
position: "bottom", position: "bottom",
labels: { colors: "#6b7280" }, labels: { colors: "#6b7280" },
@@ -208,7 +208,7 @@ export default function ThinkerDashboard() {
{module.count > 0 && ( {module.count > 0 && (
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<span className="text-2xl font-bold text-slate-900">{module.count}</span> <span className="text-2xl font-bold text-slate-900">{module.count}</span>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] group-hover:translate-x-1 transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
</div> </div>
)} )}
{module.status === "coming-soon" && ( {module.status === "coming-soon" && (
@@ -237,13 +237,13 @@ export default function ThinkerDashboard() {
key={prompt.id} key={prompt.id}
className="flex items-center gap-4 p-4 rounded-lg border border-slate-200 bg-white hover:shadow-md transition" className="flex items-center gap-4 p-4 rounded-lg border border-slate-200 bg-white hover:shadow-md transition"
> >
<div className="size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-md"> <div className="size-10 rounded-lg bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-md">
<FileTextIcon className="h-5 w-5" /> <FileTextIcon className="h-5 w-5" />
</div> </div>
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center justify-between mb-1"> <div className="flex items-center justify-between mb-1">
<h4 className="font-semibold text-slate-900">{prompt.name}</h4> <h4 className="font-semibold text-slate-900">{prompt.name}</h4>
<span className="text-xs font-semibold text-[var(--igny8-blue)]">{prompt.usage} uses</span> <span className="text-xs font-semibold text-[var(--color-primary)]">{prompt.usage} uses</span>
</div> </div>
<div className="flex items-center gap-3 text-xs text-slate-600"> <div className="flex items-center gap-3 text-xs text-slate-600">
<span>{prompt.category}</span> <span>{prompt.category}</span>
@@ -262,9 +262,9 @@ export default function ThinkerDashboard() {
<div className="grid grid-cols-1 md:grid-cols-3 gap-4"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<button <button
onClick={() => navigate("/thinker/prompts")} onClick={() => navigate("/thinker/prompts")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--igny8-amber)] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--color-warning)] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-lg">
<PlusIcon className="h-6 w-6" /> <PlusIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -278,21 +278,21 @@ export default function ThinkerDashboard() {
onClick={() => navigate("/thinker/profiles")} onClick={() => navigate("/thinker/profiles")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0693e3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0693e3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-lg">
<PlusIcon className="h-6 w-6" /> <PlusIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">New Author Profile</h4> <h4 className="font-semibold text-slate-900 mb-1">New Author Profile</h4>
<p className="text-sm text-slate-600">Define a writing voice and style</p> <p className="text-sm text-slate-600">Define a writing voice and style</p>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
</button> </button>
<button <button
onClick={() => navigate("/thinker/strategies")} onClick={() => navigate("/thinker/strategies")}
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-purple)] to-[var(--color-purple-dark)] flex items-center justify-center text-white shadow-lg">
<PlusIcon className="h-6 w-6" /> <PlusIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -309,7 +309,7 @@ export default function ThinkerDashboard() {
<ComponentCard title="How Thinker Works" desc="Understanding the strategic OS"> <ComponentCard title="How Thinker Works" desc="Understanding the strategic OS">
<div className="space-y-4"> <div className="space-y-4">
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-md">
<BoltIcon className="h-5 w-5" /> <BoltIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -320,7 +320,7 @@ export default function ThinkerDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-md">
<CheckCircleIcon className="h-5 w-5" /> <CheckCircleIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -331,7 +331,7 @@ export default function ThinkerDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-md">
<ShootingStarIcon className="h-5 w-5" /> <ShootingStarIcon className="h-5 w-5" />
</div> </div>
<div> <div>

30
frontend/src/pages/Writer/Dashboard.tsx
View File

@@ -207,7 +207,7 @@ export default function WriterDashboard() {
title: "Tasks", title: "Tasks",
description: "Content writing tasks and assignments", description: "Content writing tasks and assignments",
icon: FileTextIcon, icon: FileTextIcon,
color: "from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)]", color: "from-[var(--color-primary)] to-[var(--color-primary-dark)]",
path: "/writer/tasks", path: "/writer/tasks",
count: stats?.tasks.total || 0, count: stats?.tasks.total || 0,
metric: `${stats?.tasks.completed || 0} completed`, metric: `${stats?.tasks.completed || 0} completed`,
@@ -216,7 +216,7 @@ export default function WriterDashboard() {
title: "Content", title: "Content",
description: "Generated content and drafts", description: "Generated content and drafts",
icon: PencilIcon, icon: PencilIcon,
color: "from-[var(--igny8-green)] to-[var(--igny8-green-dark)]", color: "from-[var(--color-success)] to-[var(--color-success-dark)]",
path: "/writer/content", path: "/writer/content",
count: stats?.content.total || 0, count: stats?.content.total || 0,
metric: `${stats?.content.published || 0} published`, metric: `${stats?.content.published || 0} published`,
@@ -225,7 +225,7 @@ export default function WriterDashboard() {
title: "Images", title: "Images",
description: "Generated images and assets", description: "Generated images and assets",
icon: BoxIcon, icon: BoxIcon,
color: "from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)]", color: "from-[var(--color-warning)] to-[var(--color-warning-dark)]",
path: "/writer/images", path: "/writer/images",
count: stats?.images.generated || 0, count: stats?.images.generated || 0,
metric: `${stats?.images.pending || 0} pending`, metric: `${stats?.images.pending || 0} pending`,
@@ -234,7 +234,7 @@ export default function WriterDashboard() {
title: "Published", title: "Published",
description: "Published content and posts", description: "Published content and posts",
icon: PaperPlaneIcon, icon: PaperPlaneIcon,
color: "from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)]", color: "from-[var(--color-purple)] to-[var(--color-purple-dark)]",
path: "/writer/published", path: "/writer/published",
count: stats?.content.published || 0, count: stats?.content.published || 0,
metric: "View all published", metric: "View all published",
@@ -290,7 +290,7 @@ export default function WriterDashboard() {
position: "top", position: "top",
labels: { colors: "#6b7280" }, labels: { colors: "#6b7280" },
}, },
colors: ["var(--igny8-blue)", "var(--igny8-green)", "var(--igny8-amber)"], colors: ["var(--color-primary)", "var(--color-success)", "var(--color-warning)"],
grid: { grid: {
borderColor: "#e5e7eb", borderColor: "#e5e7eb",
}, },
@@ -530,7 +530,7 @@ export default function WriterDashboard() {
<div className="text-2xl font-bold text-slate-900">{module.count}</div> <div className="text-2xl font-bold text-slate-900">{module.count}</div>
<div className="text-xs text-slate-500">{module.metric}</div> <div className="text-xs text-slate-500">{module.metric}</div>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] group-hover:translate-x-1 transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
</div> </div>
</Link> </Link>
); );
@@ -650,23 +650,23 @@ export default function WriterDashboard() {
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<Link <Link
to="/writer/tasks" to="/writer/tasks"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--igny8-blue)] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[var(--color-primary)] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-lg">
<FileTextIcon className="h-6 w-6" /> <FileTextIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Create Task</h4> <h4 className="font-semibold text-slate-900 mb-1">Create Task</h4>
<p className="text-sm text-slate-600">New writing task</p> <p className="text-sm text-slate-600">New writing task</p>
</div> </div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--igny8-blue)] transition" /> <ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
</Link> </Link>
<Link <Link
to="/writer/content" to="/writer/content"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#0bbf87] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-lg">
<PencilIcon className="h-6 w-6" /> <PencilIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -680,7 +680,7 @@ export default function WriterDashboard() {
to="/writer/images" to="/writer/images"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#ff7a00] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-lg">
<BoxIcon className="h-6 w-6" /> <BoxIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -694,7 +694,7 @@ export default function WriterDashboard() {
to="/writer/published" to="/writer/published"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group" className="flex items-center gap-4 p-6 rounded-xl border-2 border-slate-200 bg-white hover:border-[#5d4ae3] hover:shadow-lg transition-all group"
> >
<div className="size-12 rounded-xl bg-gradient-to-br from-[var(--igny8-purple)] to-[var(--igny8-purple-dark)] flex items-center justify-center text-white shadow-lg"> <div className="size-12 rounded-xl bg-gradient-to-br from-[var(--color-purple)] to-[var(--color-purple-dark)] flex items-center justify-center text-white shadow-lg">
<PaperPlaneIcon className="h-6 w-6" /> <PaperPlaneIcon className="h-6 w-6" />
</div> </div>
<div className="flex-1 text-left"> <div className="flex-1 text-left">
@@ -711,7 +711,7 @@ export default function WriterDashboard() {
<ComponentCard title="How Writer Works" desc="Understanding the content creation workflow"> <ComponentCard title="How Writer Works" desc="Understanding the content creation workflow">
<div className="space-y-4"> <div className="space-y-4">
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-blue)] to-[var(--igny8-blue-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-md">
<FileTextIcon className="h-5 w-5" /> <FileTextIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -722,7 +722,7 @@ export default function WriterDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-green)] to-[var(--igny8-green-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-success)] to-[var(--color-success-dark)] flex items-center justify-center text-white shadow-md">
<PencilIcon className="h-5 w-5" /> <PencilIcon className="h-5 w-5" />
</div> </div>
<div> <div>
@@ -733,7 +733,7 @@ export default function WriterDashboard() {
</div> </div>
</div> </div>
<div className="flex gap-4"> <div className="flex gap-4">
<div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--igny8-amber)] to-[var(--igny8-amber-dark)] flex items-center justify-center text-white shadow-md"> <div className="flex-shrink-0 size-10 rounded-lg bg-gradient-to-br from-[var(--color-warning)] to-[var(--color-warning-dark)] flex items-center justify-center text-white shadow-md">
<BoxIcon className="h-5 w-5" /> <BoxIcon className="h-5 w-5" />
</div> </div>
<div> <div>