stlyes fixes
This commit is contained in:
IGNY8 VPS (Salman)
@@ -173,7 +173,7 @@ const CreditsAndBilling: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right">
|
||||
<div className={`font-bold ${transaction.amount > 0 ? 'text-green-600' : 'text-red-600'}`}>
|
||||
<div className={`font-bold ${transaction.amount > 0 ? 'text-success-600' : 'text-error-600'}`}>
|
||||
{transaction.amount > 0 ? '+' : ''}{transaction.amount}
|
||||
</div>
|
||||
</div>
|
||||
@@ -230,7 +230,7 @@ const CreditsAndBilling: React.FC = () => {
|
||||
{transaction.reference_id || '-'}
|
||||
</td>
|
||||
<td className={`px-6 py-4 whitespace-nowrap text-sm text-right font-bold ${
|
||||
transaction.amount > 0 ? 'text-green-600' : 'text-red-600'
|
||||
transaction.amount > 0 ? 'text-success-600' : 'text-error-600'
|
||||
}`}>
|
||||
{transaction.amount > 0 ? '+' : ''}{transaction.amount}
|
||||
</td>
|
||||
|
||||
@@ -718,7 +718,7 @@ export default function Integration() {
|
||||
</Label>
|
||||
|
||||
{/* Featured Image (full width) - Selectable */}
|
||||
<div className="p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-gradient-to-r from-purple-500 to-blue-500 text-white">
|
||||
<div className="p-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-gradient-to-r from-purple-500 to-brand-500 text-white">
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<div className="font-medium">Featured Image</div>
|
||||
<div className="text-xs bg-white/20 px-2 py-1 rounded">
|
||||
|
||||
@@ -148,8 +148,8 @@ export default function Publishing() {
|
||||
</div>
|
||||
|
||||
{autoPublishEnabled && (
|
||||
<div className="mt-4 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg">
|
||||
<p className="text-sm text-blue-800 dark:text-blue-200">
|
||||
<div className="mt-4 p-4 bg-brand-50 dark:bg-brand-900/20 border border-brand-200 dark:border-brand-800 rounded-lg">
|
||||
<p className="text-sm text-brand-800 dark:text-brand-200">
|
||||
When you turn this on, articles will publish to your site right away. You can still review them first if you want
|
||||
</p>
|
||||
</div>
|
||||
@@ -207,8 +207,8 @@ export default function Publishing() {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="p-4 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg">
|
||||
<p className="text-sm text-amber-800 dark:text-amber-200">
|
||||
<div className="p-4 bg-warning-50 dark:bg-warning-900/20 border border-warning-200 dark:border-warning-800 rounded-lg">
|
||||
<p className="text-sm text-warning-800 dark:text-warning-200">
|
||||
<strong>Note:</strong> Content will be automatically published every{' '}
|
||||
{syncInterval} {syncIntervalUnit} if it has status "review" and all images are generated.
|
||||
</p>
|
||||
|
||||
@@ -377,7 +377,7 @@ export default function Sites() {
|
||||
return (
|
||||
<div className="flex h-screen items-center justify-center">
|
||||
<div className="text-center">
|
||||
<div className="mb-4 h-8 w-8 animate-spin rounded-full border-4 border-gray-300 border-t-blue-600 mx-auto"></div>
|
||||
<div className="mb-4 h-8 w-8 animate-spin rounded-full border-4 border-gray-300 border-t-brand-600 mx-auto"></div>
|
||||
<p className="text-gray-600 dark:text-gray-400">Loading sites...</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -522,7 +522,7 @@ export default function Sites() {
|
||||
setSelectedSectors(selectedSectors.filter(s => s !== sector.slug));
|
||||
}
|
||||
}}
|
||||
className="mt-1 h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500"
|
||||
className="mt-1 h-4 w-4 rounded border-gray-300 text-brand-600 focus:ring-brand-500"
|
||||
/>
|
||||
<div className="flex-1">
|
||||
<div className="font-medium text-sm text-gray-900 dark:text-white">
|
||||
|
||||
@@ -40,18 +40,18 @@ interface SystemStatus {
|
||||
|
||||
const getStatusColor = (status: string) => {
|
||||
switch (status) {
|
||||
case 'healthy': return 'text-green-600 dark:text-green-400';
|
||||
case 'warning': return 'text-yellow-600 dark:text-yellow-400';
|
||||
case 'critical': return 'text-red-600 dark:text-red-400';
|
||||
case 'healthy': return 'text-success-600 dark:text-success-400';
|
||||
case 'warning': return 'text-warning-600 dark:text-warning-400';
|
||||
case 'critical': return 'text-error-600 dark:text-error-400';
|
||||
default: return 'text-gray-600 dark:text-gray-400';
|
||||
}
|
||||
};
|
||||
|
||||
const getStatusBadge = (status: string) => {
|
||||
switch (status) {
|
||||
case 'healthy': return 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400';
|
||||
case 'warning': return 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400';
|
||||
case 'critical': return 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400';
|
||||
case 'healthy': return 'bg-success-100 text-success-800 dark:bg-success-900/30 dark:text-success-400';
|
||||
case 'warning': return 'bg-warning-100 text-warning-800 dark:bg-warning-900/30 dark:text-warning-400';
|
||||
case 'critical': return 'bg-error-100 text-error-800 dark:bg-error-900/30 dark:text-error-400';
|
||||
default: return 'bg-gray-100 text-gray-800 dark:bg-gray-900/30 dark:text-gray-400';
|
||||
}
|
||||
};
|
||||
@@ -99,7 +99,7 @@ export default function Status() {
|
||||
<>
|
||||
<PageMeta title="System Status - IGNY8" description="System monitoring" />
|
||||
<ComponentCard title="System Status" desc="Error loading system information">
|
||||
<div className="text-center py-8 text-red-600 dark:text-red-400">
|
||||
<div className="text-center py-8 text-error-600 dark:text-error-400">
|
||||
{error || 'Failed to load system status'}
|
||||
</div>
|
||||
</ComponentCard>
|
||||
@@ -126,8 +126,8 @@ export default function Status() {
|
||||
<div className="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-4">
|
||||
<div
|
||||
className={`h-4 rounded-full ${
|
||||
(status.system?.cpu?.usage_percent || 0) < 80 ? 'bg-green-500' :
|
||||
(status.system?.cpu?.usage_percent || 0) < 95 ? 'bg-yellow-500' : 'bg-red-500'
|
||||
(status.system?.cpu?.usage_percent || 0) < 80 ? 'bg-success-500' :
|
||||
(status.system?.cpu?.usage_percent || 0) < 95 ? 'bg-warning-500' : 'bg-error-500'
|
||||
}`}
|
||||
style={{ width: `${status.system?.cpu?.usage_percent || 0}%` }}
|
||||
></div>
|
||||
@@ -148,8 +148,8 @@ export default function Status() {
|
||||
<div className="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-4">
|
||||
<div
|
||||
className={`h-4 rounded-full ${
|
||||
(status.system?.memory?.usage_percent || 0) < 80 ? 'bg-green-500' :
|
||||
(status.system?.memory?.usage_percent || 0) < 95 ? 'bg-yellow-500' : 'bg-red-500'
|
||||
(status.system?.memory?.usage_percent || 0) < 80 ? 'bg-success-500' :
|
||||
(status.system?.memory?.usage_percent || 0) < 95 ? 'bg-warning-500' : 'bg-error-500'
|
||||
}`}
|
||||
style={{ width: `${status.system?.memory?.usage_percent || 0}%` }}
|
||||
></div>
|
||||
@@ -170,8 +170,8 @@ export default function Status() {
|
||||
<div className="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-4">
|
||||
<div
|
||||
className={`h-4 rounded-full ${
|
||||
(status.system?.disk?.usage_percent || 0) < 80 ? 'bg-green-500' :
|
||||
(status.system?.disk?.usage_percent || 0) < 95 ? 'bg-yellow-500' : 'bg-red-500'
|
||||
(status.system?.disk?.usage_percent || 0) < 80 ? 'bg-success-500' :
|
||||
(status.system?.disk?.usage_percent || 0) < 95 ? 'bg-warning-500' : 'bg-error-500'
|
||||
}`}
|
||||
style={{ width: `${status.system?.disk?.usage_percent || 0}%` }}
|
||||
></div>
|
||||
|
||||
@@ -343,7 +343,7 @@ export default function WordPressIntegrationDebug() {
|
||||
if (initializing) {
|
||||
return (
|
||||
<div className="p-8 text-center">
|
||||
<Loader2 className="h-8 w-8 animate-spin mx-auto text-blue-600 dark:text-blue-400" />
|
||||
<Loader2 className="h-8 w-8 animate-spin mx-auto text-brand-600 dark:text-brand-400" />
|
||||
<p className="text-sm text-gray-500 dark:text-gray-400 mt-2">Loading WordPress integration...</p>
|
||||
</div>
|
||||
);
|
||||
@@ -353,8 +353,8 @@ export default function WordPressIntegrationDebug() {
|
||||
if (!integrationId) {
|
||||
return (
|
||||
<div className="p-8">
|
||||
<div className="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-900/50 rounded-lg p-6 text-center">
|
||||
<AlertTriangle className="h-12 w-12 text-yellow-600 dark:text-yellow-400 mx-auto mb-4" />
|
||||
<div className="bg-warning-50 dark:bg-warning-900/20 border border-warning-200 dark:border-warning-900/50 rounded-lg p-6 text-center">
|
||||
<AlertTriangle className="h-12 w-12 text-warning-600 dark:text-warning-400 mx-auto mb-4" />
|
||||
<h3 className="text-lg font-medium text-gray-900 dark:text-white mb-2">
|
||||
No WordPress Integration Found
|
||||
</h3>
|
||||
@@ -427,15 +427,15 @@ export default function WordPressIntegrationDebug() {
|
||||
<p className="text-gray-600 dark:text-gray-400">Checking for WordPress integration...</p>
|
||||
</div>
|
||||
) : !integrationId && activeSite ? (
|
||||
<div className="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-900/50 rounded-lg p-6">
|
||||
<div className="bg-warning-50 dark:bg-warning-900/20 border border-warning-200 dark:border-warning-900/50 rounded-lg p-6">
|
||||
<div className="flex items-start space-x-3">
|
||||
<AlertTriangle className="h-8 w-8 text-yellow-500 mt-0.5" />
|
||||
<AlertTriangle className="h-8 w-8 text-warning-500 mt-0.5" />
|
||||
<div>
|
||||
<p className="text-lg font-semibold text-yellow-800 dark:text-yellow-200">No WordPress Integration Found</p>
|
||||
<p className="text-sm text-yellow-600 dark:text-yellow-300 mt-2">
|
||||
<p className="text-lg font-semibold text-warning-800 dark:text-warning-200">No WordPress Integration Found</p>
|
||||
<p className="text-sm text-warning-600 dark:text-warning-300 mt-2">
|
||||
This site doesn't have a WordPress integration configured yet.
|
||||
</p>
|
||||
<p className="text-xs text-yellow-600 dark:text-yellow-400 mt-2">
|
||||
<p className="text-xs text-warning-600 dark:text-warning-400 mt-2">
|
||||
Please configure a WordPress integration in <span className="font-medium">Settings → Integration</span> page first.
|
||||
</p>
|
||||
</div>
|
||||
@@ -461,7 +461,7 @@ export default function WordPressIntegrationDebug() {
|
||||
<button
|
||||
onClick={testConnection}
|
||||
disabled={loading}
|
||||
className="inline-flex items-center px-3 py-1 text-xs bg-blue-100 hover:bg-blue-200 text-blue-700 rounded-md disabled:opacity-50"
|
||||
className="inline-flex items-center px-3 py-1 text-xs bg-brand-100 hover:bg-brand-200 text-brand-700 rounded-md disabled:opacity-50"
|
||||
>
|
||||
<TestTube className="h-3 w-3 mr-1" />
|
||||
Test Connection
|
||||
@@ -469,7 +469,7 @@ export default function WordPressIntegrationDebug() {
|
||||
<button
|
||||
onClick={resyncSiteMetadata}
|
||||
disabled={loading}
|
||||
className="inline-flex items-center px-3 py-1 text-xs bg-yellow-100 hover:bg-yellow-200 text-yellow-700 rounded-md disabled:opacity-50"
|
||||
className="inline-flex items-center px-3 py-1 text-xs bg-warning-100 hover:bg-warning-200 text-warning-700 rounded-md disabled:opacity-50"
|
||||
>
|
||||
<RefreshCw className="h-3 w-3 mr-1" />
|
||||
Re-sync Metadata
|
||||
@@ -491,9 +491,9 @@ export default function WordPressIntegrationDebug() {
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<span className="text-sm font-medium">API Connection</span>
|
||||
{integrationHealth.api_status === 'healthy' ? (
|
||||
<CheckCircle className="h-4 w-4 text-green-500" />
|
||||
<CheckCircle className="h-4 w-4 text-success-500" />
|
||||
) : (
|
||||
<XCircle className="h-4 w-4 text-red-500" />
|
||||
<XCircle className="h-4 w-4 text-error-500" />
|
||||
)}
|
||||
</div>
|
||||
<p className="text-xs text-gray-600 dark:text-gray-400">{integrationHealth.api_message}</p>
|
||||
@@ -506,9 +506,9 @@ export default function WordPressIntegrationDebug() {
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<span className="text-sm font-medium">Plugin Status</span>
|
||||
{integrationHealth.plugin_active ? (
|
||||
<CheckCircle className="h-4 w-4 text-green-500" />
|
||||
<CheckCircle className="h-4 w-4 text-success-500" />
|
||||
) : (
|
||||
<XCircle className="h-4 w-4 text-red-500" />
|
||||
<XCircle className="h-4 w-4 text-error-500" />
|
||||
)}
|
||||
</div>
|
||||
<p className="text-xs text-gray-600 dark:text-gray-400">
|
||||
@@ -523,9 +523,9 @@ export default function WordPressIntegrationDebug() {
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<span className="text-sm font-medium">Sync Status</span>
|
||||
{integrationHealth.sync_healthy ? (
|
||||
<CheckCircle className="h-4 w-4 text-green-500" />
|
||||
<CheckCircle className="h-4 w-4 text-success-500" />
|
||||
) : (
|
||||
<AlertTriangle className="h-4 w-4 text-yellow-500" />
|
||||
<AlertTriangle className="h-4 w-4 text-warning-500" />
|
||||
)}
|
||||
</div>
|
||||
<p className="text-xs text-gray-600 dark:text-gray-400">
|
||||
@@ -557,9 +557,9 @@ export default function WordPressIntegrationDebug() {
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center space-x-2 text-sm">
|
||||
<span className={`px-2 py-1 rounded-full text-xs font-medium ${
|
||||
event.type === 'sync' ? 'bg-blue-100 text-blue-700' :
|
||||
event.type === 'error' ? 'bg-red-100 text-red-700' :
|
||||
event.type === 'webhook' ? 'bg-green-100 text-green-700' :
|
||||
event.type === 'sync' ? 'bg-brand-100 text-brand-700' :
|
||||
event.type === 'error' ? 'bg-error-100 text-error-700' :
|
||||
event.type === 'webhook' ? 'bg-success-100 text-success-700' :
|
||||
'bg-gray-100 text-gray-700'
|
||||
}`}>
|
||||
{event.type}
|
||||
@@ -569,7 +569,7 @@ export default function WordPressIntegrationDebug() {
|
||||
<p className="text-sm text-gray-600 dark:text-gray-400 mt-1">{event.description}</p>
|
||||
{event.details && (
|
||||
<details className="mt-2">
|
||||
<summary className="text-xs text-blue-600 cursor-pointer hover:underline">
|
||||
<summary className="text-xs text-brand-600 cursor-pointer hover:underline">
|
||||
View Details
|
||||
</summary>
|
||||
<pre className="mt-2 text-xs bg-gray-50 dark:bg-gray-700 p-2 rounded border overflow-x-auto">
|
||||
@@ -631,12 +631,12 @@ export default function WordPressIntegrationDebug() {
|
||||
</td>
|
||||
<td className="px-6 py-4 whitespace-nowrap">
|
||||
{validation.matches ? (
|
||||
<CheckCircle className="h-4 w-4 text-green-500" />
|
||||
<CheckCircle className="h-4 w-4 text-success-500" />
|
||||
) : (
|
||||
<div className="flex items-center space-x-1">
|
||||
<XCircle className="h-4 w-4 text-red-500" />
|
||||
<XCircle className="h-4 w-4 text-error-500" />
|
||||
{validation.error && (
|
||||
<span className="text-xs text-red-600">{validation.error}</span>
|
||||
<span className="text-xs text-error-600">{validation.error}</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user