stlyes fixes

This commit is contained in:
IGNY8 VPS (Salman)
2025-12-29 19:52:51 +00:00
parent c91175fdcb
commit 4f7ab9c606
155 changed files with 1576 additions and 2489 deletions

View File

@@ -272,7 +272,7 @@ export default function WriterDashboard() {
description: `${stats?.content.published || 0} pieces published to WordPress`,
timestamp: new Date(Date.now() - 30 * 60 * 1000),
icon: PaperPlaneIcon,
color: "text-green-600",
color: "text-success-600",
},
{
id: 2,
@@ -280,7 +280,7 @@ export default function WriterDashboard() {
description: `${stats?.content.total || 0} content pieces created`,
timestamp: new Date(Date.now() - 2 * 60 * 60 * 1000),
icon: PencilIcon,
color: "text-blue-600",
color: "text-brand-600",
},
{
id: 3,
@@ -288,7 +288,7 @@ export default function WriterDashboard() {
description: `${stats?.images.generated || 0} images created`,
timestamp: new Date(Date.now() - 4 * 60 * 60 * 1000),
icon: BoxIcon,
color: "text-orange-600",
color: "text-warning-600",
},
];
@@ -305,18 +305,18 @@ export default function WriterDashboard() {
},
xaxis: {
categories: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
labels: { style: { colors: "#6b7280" } },
labels: { style: { colors: "var(--color-gray-500)" } },
},
yaxis: {
labels: { style: { colors: "#6b7280" } },
labels: { style: { colors: "var(--color-gray-500)" } },
},
legend: {
position: "top",
labels: { colors: "#6b7280" },
labels: { colors: "var(--color-gray-500)" },
},
colors: ["var(--color-primary)", "var(--color-success)", "var(--color-warning)"],
grid: {
borderColor: "#e5e7eb",
borderColor: "var(--color-gray-200)",
},
fill: {
type: "gradient",
@@ -352,7 +352,7 @@ export default function WriterDashboard() {
toolbar: { show: false }
},
labels: Object.keys(stats.tasks.byStatus).filter(key => stats.tasks.byStatus[key] > 0),
colors: ['#465FFF', '#F59E0B', '#10B981', '#EF4444', '#8B5CF6'],
colors: ['var(--color-primary)', 'var(--color-warning)', 'var(--color-success)', 'var(--color-danger)', 'var(--color-purple)'],
legend: {
position: 'bottom',
fontFamily: 'Outfit',
@@ -372,7 +372,7 @@ export default function WriterDashboard() {
show: true,
fontSize: '24px',
fontWeight: 700,
color: '#465FFF',
color: 'var(--color-primary)',
fontFamily: 'Outfit',
formatter: () => {
const total = Object.values(stats.tasks.byStatus).reduce((a: number, b: number) => a + b, 0);
@@ -403,7 +403,7 @@ export default function WriterDashboard() {
toolbar: { show: false },
height: 300
},
colors: ['#465FFF', '#F59E0B', '#10B981'],
colors: ['var(--color-primary)', 'var(--color-warning)', 'var(--color-success)'],
plotOptions: {
bar: {
horizontal: false,
@@ -540,21 +540,21 @@ export default function WriterDashboard() {
<Link
key={module.title}
to={module.path}
className="rounded-2xl border-2 border-slate-200 bg-white p-6 hover:shadow-xl hover:-translate-y-1 transition-all group"
className="rounded-2xl border-2 border-gray-200 bg-white p-6 hover:shadow-xl hover:-translate-y-1 transition-all group"
>
<div className="flex items-start justify-between mb-4">
<div className={`inline-flex size-14 rounded-xl bg-gradient-to-br ${module.color} items-center justify-center text-white shadow-lg`}>
<Icon className="h-7 w-7" />
</div>
</div>
<h3 className="text-lg font-bold text-slate-900 mb-2">{module.title}</h3>
<p className="text-sm text-slate-600 mb-4">{module.description}</p>
<h3 className="text-lg font-bold text-gray-900 mb-2">{module.title}</h3>
<p className="text-sm text-gray-600 mb-4">{module.description}</p>
<div className="flex items-center justify-between">
<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-2xl font-bold text-gray-900">{module.count}</div>
<div className="text-xs text-gray-500">{module.metric}</div>
</div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
<ArrowRightIcon className="h-5 w-5 text-gray-400 group-hover:text-[var(--color-primary)] group-hover:translate-x-1 transition" />
</div>
</Link>
);
@@ -577,17 +577,17 @@ export default function WriterDashboard() {
return (
<div
key={activity.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-gray-200 bg-white hover:shadow-md transition"
>
<div className={`size-10 rounded-lg bg-gradient-to-br from-slate-100 to-slate-200 flex items-center justify-center ${activity.color}`}>
<div className={`size-10 rounded-lg bg-gradient-to-br from-gray-100 to-gray-200 flex items-center justify-center ${activity.color}`}>
<Icon className="h-5 w-5" />
</div>
<div className="flex-1">
<div className="flex items-center justify-between mb-1">
<h4 className="font-semibold text-slate-900">{activity.type}</h4>
<span className="text-xs text-slate-500">{formatTimeAgo(activity.timestamp)}</span>
<h4 className="font-semibold text-gray-900">{activity.type}</h4>
<span className="text-xs text-gray-500">{formatTimeAgo(activity.timestamp)}</span>
</div>
<p className="text-sm text-slate-600">{activity.description}</p>
<p className="text-sm text-gray-600">{activity.description}</p>
</div>
</div>
);
@@ -674,58 +674,58 @@ export default function WriterDashboard() {
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
<Link
to="/writer/tasks"
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"
className="flex items-center gap-4 p-6 rounded-xl border-2 border-gray-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(--color-primary)] to-[var(--color-primary-dark)] flex items-center justify-center text-white shadow-lg">
<FileTextIcon className="h-6 w-6" />
</div>
<div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Create Task</h4>
<p className="text-sm text-slate-600">New writing task</p>
<h4 className="font-semibold text-gray-900 mb-1">Create Task</h4>
<p className="text-sm text-gray-600">New writing task</p>
</div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[var(--color-primary)] transition" />
<ArrowRightIcon className="h-5 w-5 text-gray-400 group-hover:text-[var(--color-primary)] transition" />
</Link>
<Link
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-gray-200 bg-white hover:border-success-500 hover:shadow-lg transition-all group"
>
<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" />
</div>
<div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Generate Content</h4>
<p className="text-sm text-slate-600">AI content creation</p>
<h4 className="font-semibold text-gray-900 mb-1">Generate Content</h4>
<p className="text-sm text-gray-600">AI content creation</p>
</div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[#0bbf87] transition" />
<ArrowRightIcon className="h-5 w-5 text-gray-400 group-hover:text-success-500 transition" />
</Link>
<Link
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-gray-200 bg-white hover:border-warning-500 hover:shadow-lg transition-all group"
>
<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" />
</div>
<div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Generate Images</h4>
<p className="text-sm text-slate-600">Create visuals</p>
<h4 className="font-semibold text-gray-900 mb-1">Generate Images</h4>
<p className="text-sm text-gray-600">Create visuals</p>
</div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[#ff7a00] transition" />
<ArrowRightIcon className="h-5 w-5 text-gray-400 group-hover:text-warning-500 transition" />
</Link>
<Link
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-gray-200 bg-white hover:border-purple-500 hover:shadow-lg transition-all group"
>
<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" />
</div>
<div className="flex-1 text-left">
<h4 className="font-semibold text-slate-900 mb-1">Publish Content</h4>
<p className="text-sm text-slate-600">Publish to WordPress</p>
<h4 className="font-semibold text-gray-900 mb-1">Publish Content</h4>
<p className="text-sm text-gray-600">Publish to WordPress</p>
</div>
<ArrowRightIcon className="h-5 w-5 text-slate-400 group-hover:text-[#5d4ae3] transition" />
<ArrowRightIcon className="h-5 w-5 text-gray-400 group-hover:text-purple-500 transition" />
</Link>
</div>
</ComponentCard>
@@ -739,8 +739,8 @@ export default function WriterDashboard() {
<FileTextIcon className="h-5 w-5" />
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">Task Creation</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">Task Creation</h4>
<p className="text-sm text-gray-600">
Create writing tasks from content ideas. Each task includes target keywords, outline, and word count requirements.
</p>
</div>
@@ -750,8 +750,8 @@ export default function WriterDashboard() {
<PencilIcon className="h-5 w-5" />
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">AI Content Generation</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">AI Content Generation</h4>
<p className="text-sm text-gray-600">
Generate full content pieces using AI. Content is created based on your prompts, author profiles, and brand guidelines.
</p>
</div>
@@ -761,8 +761,8 @@ export default function WriterDashboard() {
<BoxIcon className="h-5 w-5" />
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">Image Generation</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">Image Generation</h4>
<p className="text-sm text-gray-600">
Automatically generate featured images and in-article images for your content. Images are optimized for SEO and engagement.
</p>
</div>
@@ -773,34 +773,34 @@ export default function WriterDashboard() {
<ComponentCard title="Getting Started" desc="Quick guide to using Writer">
<div className="space-y-3">
<div className="flex items-start gap-3">
<div className="flex-shrink-0 size-8 rounded-full bg-[#0693e3] text-white flex items-center justify-center font-bold text-sm">
<div className="flex-shrink-0 size-8 rounded-full bg-brand-500 text-white flex items-center justify-center font-bold text-sm">
1
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">Create Tasks</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">Create Tasks</h4>
<p className="text-sm text-gray-600">
Start by creating writing tasks from content ideas in the Planner module. Tasks define what content needs to be written.
</p>
</div>
</div>
<div className="flex items-start gap-3">
<div className="flex-shrink-0 size-8 rounded-full bg-[#0bbf87] text-white flex items-center justify-center font-bold text-sm">
<div className="flex-shrink-0 size-8 rounded-full bg-success-500 text-white flex items-center justify-center font-bold text-sm">
2
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">Generate Content</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">Generate Content</h4>
<p className="text-sm text-gray-600">
Use AI to generate content from tasks. Review and edit generated content before publishing.
</p>
</div>
</div>
<div className="flex items-start gap-3">
<div className="flex-shrink-0 size-8 rounded-full bg-[#ff7a00] text-white flex items-center justify-center font-bold text-sm">
<div className="flex-shrink-0 size-8 rounded-full bg-warning-500 text-white flex items-center justify-center font-bold text-sm">
3
</div>
<div>
<h4 className="font-semibold text-slate-900 mb-1">Publish</h4>
<p className="text-sm text-slate-600">
<h4 className="font-semibold text-gray-900 mb-1">Publish</h4>
<p className="text-sm text-gray-600">
Once content is reviewed and images are generated, publish directly to WordPress or export for manual publishing.
</p>
</div>