@actuate-media/cms-admin 0.54.0 → 0.56.2

package/src/components/ui/Toast.tsx

@@ -11,11 +11,10 @@ interface Toast {
 }
 
 const typeClasses: Record<ToastType, string> = {
-  success:
-    'border-emerald-500 bg-emerald-50 text-emerald-900 dark:bg-emerald-900/20 dark:text-emerald-300',
-  error: 'border-red-500 bg-red-50 text-red-900 dark:bg-red-900/20 dark:text-red-300',
-  warning: 'border-amber-500 bg-amber-50 text-amber-900 dark:bg-amber-900/20 dark:text-amber-300',
-  info: 'border-blue-500 bg-blue-50 text-blue-900 dark:bg-blue-900/20 dark:text-blue-300',
+  success: 'border-success bg-success/10 text-success',
+  error: 'border-destructive bg-destructive/10 text-destructive',
+  warning: 'border-warning bg-warning/10 text-warning',
+  info: 'border-info bg-info/10 text-info',
 }
 
 export function useToast() {

package/src/fields/ComponentBlockField.tsx

@@ -117,7 +117,7 @@ export function ComponentBlockField({
 
   if (!currentSpec) {
     return (
-      <div className="rounded-md border border-[var(--destructive)] bg-red-50 p-3 text-sm text-[var(--destructive)]">
+      <div className="bg-destructive/10 rounded-md border border-[var(--destructive)] p-3 text-sm text-[var(--destructive)]">
         Component block has no components to choose from.
       </div>
     )
@@ -147,7 +147,7 @@ export function ComponentBlockField({
       ) : null}
 
       {errorMessage ? (
-        <div className="rounded-md border border-[var(--destructive)] bg-red-50 px-3 py-2 text-xs text-[var(--destructive)]">
+        <div className="bg-destructive/10 rounded-md border border-[var(--destructive)] px-3 py-2 text-xs text-[var(--destructive)]">
           {errorMessage}
         </div>
       ) : null}

package/src/fields/FieldRenderer.tsx

@@ -62,7 +62,7 @@ export function FieldRenderer({ field, value, onChange }: FieldRendererProps) {
 
   if (!Component) {
     return (
-      <div className="rounded-md border border-[var(--destructive)] bg-red-50 p-3 text-sm text-[var(--destructive)]">
+      <div className="bg-destructive/10 rounded-md border border-[var(--destructive)] p-3 text-sm text-[var(--destructive)]">
         Unknown field type: <code>{field.type}</code>
       </div>
     )

package/src/fields/PropInput.tsx

@@ -259,7 +259,7 @@ function BooleanInput({
         }`}
       >
         <span
-          className={`pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow-sm ring-0 transition-transform ${
+          className={`bg-card pointer-events-none inline-block h-5 w-5 rounded-full shadow-sm ring-0 transition-transform ${
             boolVal ? 'translate-x-5' : 'translate-x-0'
           }`}
         />

package/src/fields/RelationshipField.tsx

@@ -26,10 +26,10 @@ interface RelatedDoc {
 }
 
 const STATUS_STYLES: Record<string, string> = {
-  PUBLISHED: 'bg-green-100 text-green-800',
-  DRAFT: 'bg-yellow-100 text-yellow-800',
-  ARCHIVED: 'bg-gray-100 text-gray-600',
-  SCHEDULED: 'bg-blue-100 text-blue-800',
+  PUBLISHED: 'bg-success/10 text-success',
+  DRAFT: 'bg-warning/10 text-warning',
+  ARCHIVED: 'bg-muted text-muted-foreground',
+  SCHEDULED: 'bg-info/10 text-info',
 }
 
 function relativeTime(dateStr: string | undefined): string {
@@ -150,7 +150,7 @@ export function RelationshipField({
   function renderOption(opt: RelatedDoc, isSelected: boolean) {
     const status = opt.status ?? (opt.data as any)?.status
     const collection = opt.collection ?? relationTo
-    const statusClass = STATUS_STYLES[status] ?? 'bg-gray-100 text-gray-600'
+    const statusClass = STATUS_STYLES[status] ?? 'bg-muted text-muted-foreground'
 
     return (
       <button

package/src/fields/ToggleField.tsx

@@ -24,7 +24,7 @@ export function ToggleField({ label, value = false, onChange, helpText }: Toggle
         }`}
       >
         <span
-          className={`pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow-sm ring-0 transition-transform ${
+          className={`bg-card pointer-events-none inline-block h-5 w-5 rounded-full shadow-sm ring-0 transition-transform ${
             value ? 'translate-x-5' : 'translate-x-0'
           }`}
         />

package/src/lib/seo-service.ts

@@ -356,8 +356,6 @@ export interface CrawlSettings {
   indexEntireSite: boolean
   includeImagesInSitemap: boolean
   includePostsInSitemap: boolean
-  noindexPaginatedArchives: boolean
-  noindexTagPages: boolean
 }
 
 export async function fetchSitemapStatus(): Promise<SitemapStatus | null> {

package/src/views/Dashboard.tsx

@@ -795,7 +795,7 @@ export function Dashboard({ config, session, onNavigate }: DashboardProps) {
                       : contentHealth.tone === 'warn'
                         ? 'text-warning'
                         : contentHealth.tone === 'err'
-                          ? 'text-red-600 dark:text-red-400'
+                          ? 'text-destructive dark:text-red-400'
                           : 'text-muted-foreground'
                   }`}
                 >
@@ -810,7 +810,7 @@ export function Dashboard({ config, session, onNavigate }: DashboardProps) {
                       : contentHealth.tone === 'warn'
                         ? 'bg-warning'
                         : contentHealth.tone === 'err'
-                          ? 'bg-red-500'
+                          ? 'bg-destructive'
                           : 'bg-muted-foreground/40'
                   }`}
                   style={{ width: `${Math.max(0, Math.min(100, contentHealth.score))}%` }}
@@ -833,7 +833,7 @@ export function Dashboard({ config, session, onNavigate }: DashboardProps) {
                       <span
                         className={`h-1.5 w-1.5 shrink-0 rounded-full ${
                           iss.tone === 'err'
-                            ? 'bg-red-500'
+                            ? 'bg-destructive'
                             : iss.tone === 'warn'
                               ? 'bg-warning'
                               : 'bg-muted-foreground'
@@ -846,7 +846,7 @@ export function Dashboard({ config, session, onNavigate }: DashboardProps) {
                       <span
                         className={`shrink-0 text-sm font-medium ${
                           iss.tone === 'err'
-                            ? 'text-red-600 dark:text-red-400'
+                            ? 'text-destructive dark:text-red-400'
                             : iss.tone === 'warn'
                               ? 'text-warning'
                               : 'text-muted-foreground'
@@ -1040,7 +1040,7 @@ function DeliveryTile({
       : tone === 'warn'
         ? 'text-warning'
         : tone === 'err'
-          ? 'text-red-600 dark:text-red-400'
+          ? 'text-destructive dark:text-red-400'
           : 'text-muted-foreground'
   return (
     <div className="px-4 py-3.5">

package/src/views/DocumentEdit.tsx

@@ -292,15 +292,15 @@ export function DocumentEdit({
 
   const statusColor =
     docStatus === 'PUBLISHED'
-      ? 'bg-green-100 text-green-800'
+      ? 'bg-success/10 text-success'
       : docStatus === 'SCHEDULED'
-        ? 'bg-blue-100 text-blue-800'
-        : 'bg-yellow-100 text-yellow-800'
+        ? 'bg-info/10 text-info'
+        : 'bg-warning/10 text-warning'
 
   if (loading) {
     return (
       <div className="flex min-h-[300px] items-center justify-center">
-        <Loader2 className="h-8 w-8 animate-spin text-gray-400" />
+        <Loader2 className="text-muted-foreground h-8 w-8 animate-spin" />
       </div>
     )
   }
@@ -316,7 +316,7 @@ export function DocumentEdit({
             {docStatus}
           </span>
           {documentId && <PresenceIndicator documentId={documentId} />}
-          {isDirty && <span className="text-xs font-medium text-amber-600">Unsaved changes</span>}
+          {isDirty && <span className="text-warning text-xs font-medium">Unsaved changes</span>}
         </div>
         <div className="flex items-center gap-2">
           <button
@@ -362,13 +362,15 @@ export function DocumentEdit({
         <div className="space-y-6">
           {fields.length === 0 ? (
             <div className="flex flex-col items-center justify-center rounded-lg border border-[var(--border)] py-16 text-center">
-              <div className="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-gray-100">
-                <AlertTriangle className="h-6 w-6 text-gray-400" />
+              <div className="bg-muted mb-4 flex h-12 w-12 items-center justify-center rounded-full">
+                <AlertTriangle className="text-muted-foreground h-6 w-6" />
               </div>
-              <h3 className="mb-1 text-sm font-medium text-gray-900">
+              <h3 className="text-foreground mb-1 text-sm font-medium">
                 Collection schema not found
               </h3>
-              <p className="text-sm text-gray-500">No fields are defined for this collection.</p>
+              <p className="text-muted-foreground text-sm">
+                No fields are defined for this collection.
+              </p>
             </div>
           ) : (
             <div className="grid grid-cols-1 gap-6 lg:grid-cols-3">
@@ -410,14 +412,14 @@ export function DocumentEdit({
                     {!isNew && (
                       <button
                         onClick={() => setShowSchedule(true)}
-                        className="inline-flex w-full items-center justify-center gap-1.5 rounded-md border border-[var(--border)] bg-white px-3 py-1.5 text-sm font-medium text-gray-700 hover:bg-gray-50"
+                        className="border-border bg-card text-foreground hover:bg-accent inline-flex w-full items-center justify-center gap-1.5 rounded-md border px-3 py-1.5 text-sm font-medium"
                       >
                         <Calendar className="h-4 w-4" />
                         {scheduledAt || scheduledUnpublishAt ? 'Reschedule' : 'Schedule'}
                       </button>
                     )}
                     {!isNew && (scheduledAt || scheduledUnpublishAt) && (
-                      <div className="space-y-1 rounded-md border border-blue-100 bg-blue-50 px-3 py-2 text-xs text-blue-900">
+                      <div className="border-info/30 bg-info/10 text-foreground space-y-1 rounded-md border px-3 py-2 text-xs">
                         {scheduledAt && (
                           <div className="flex items-center gap-1.5">
                             <Calendar className="h-3.5 w-3.5" />

package/src/views/ForgotPassword.tsx

@@ -8,6 +8,9 @@ export interface ForgotPasswordProps {
   onNavigate: (path: string) => void
 }
 
+const fieldClass =
+  'w-full rounded-lg border border-border bg-input-background px-3 py-2.5 text-sm text-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 focus-visible:outline-none'
+
 export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
   const [email, setEmail] = useState('')
   const [submitting, setSubmitting] = useState(false)
@@ -42,37 +45,37 @@ export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
   }
 
   return (
-    <div className="flex min-h-screen items-center justify-center bg-gray-50 px-4">
+    <div className="bg-muted flex min-h-screen items-center justify-center px-4">
       <div className="w-full max-w-md">
         <div className="mb-8 text-center">
-          <div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-xl bg-blue-600">
-            <Shield className="h-7 w-7 text-white" />
+          <div className="bg-primary mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-xl">
+            <Shield className="text-primary-foreground h-7 w-7" />
           </div>
-          <h1 className="text-2xl font-medium text-gray-900">Reset Password</h1>
-          <p className="mt-2 text-gray-600">
+          <h1 className="text-foreground text-2xl font-medium">Reset Password</h1>
+          <p className="text-muted-foreground mt-2">
             {sent
               ? 'Check your inbox for a reset link'
               : "Enter your email and we'll send you a reset link"}
           </p>
         </div>
 
-        <div className="space-y-5 rounded-xl border border-gray-200 bg-white p-6 shadow-sm">
+        <div className="border-border bg-card space-y-5 rounded-xl border p-6 shadow-sm">
           {sent ? (
             <div className="space-y-4 text-center">
-              <div className="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-green-100">
-                <CheckCircle2 className="h-6 w-6 text-green-600" />
+              <div className="bg-success/10 mx-auto flex h-12 w-12 items-center justify-center rounded-full">
+                <CheckCircle2 className="text-success h-6 w-6" />
               </div>
-              <p className="text-sm text-gray-600">
+              <p className="text-muted-foreground text-sm">
                 If an account exists for <strong>{email}</strong>, you will receive a password reset
                 email shortly.
               </p>
-              <p className="text-xs text-gray-500">
+              <p className="text-muted-foreground text-xs">
                 The link expires in 1 hour. Check your spam folder if you don't see it.
               </p>
               <button
                 type="button"
                 onClick={() => onNavigate('/login')}
-                className="w-full rounded-lg bg-blue-600 py-2.5 font-medium text-white transition-colors hover:bg-blue-700"
+                className="bg-primary text-primary-foreground hover:bg-primary/90 w-full rounded-lg py-2.5 font-medium transition-colors"
               >
                 Back to Sign In
               </button>
@@ -80,16 +83,16 @@ export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
           ) : (
             <form onSubmit={handleSubmit} className="space-y-5">
               {error && (
-                <div className="flex items-start gap-3 rounded-lg border border-red-200 bg-red-50 p-3">
-                  <AlertTriangle className="mt-0.5 h-5 w-5 shrink-0 text-red-600" />
-                  <p className="text-sm text-red-800">{error}</p>
+                <div className="border-destructive/30 bg-destructive/10 flex items-start gap-3 rounded-lg border p-3">
+                  <AlertTriangle className="text-destructive mt-0.5 h-5 w-5 shrink-0" />
+                  <p className="text-destructive text-sm">{error}</p>
                 </div>
               )}
 
               <div>
                 <label
                   htmlFor="forgot-email"
-                  className="mb-1.5 block text-sm font-medium text-gray-700"
+                  className="text-foreground mb-1.5 block text-sm font-medium"
                 >
                   Email Address
                 </label>
@@ -99,7 +102,7 @@ export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
                   value={email}
                   onChange={(e) => setEmail(e.target.value)}
                   placeholder="admin@example.com"
-                  className="w-full rounded-lg border border-gray-300 px-3 py-2.5 text-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none"
+                  className={fieldClass}
                   required
                   autoFocus
                   autoComplete="email"
@@ -109,7 +112,7 @@ export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
               <button
                 type="submit"
                 disabled={!canSubmit}
-                className="flex w-full items-center justify-center gap-2 rounded-lg bg-blue-600 py-2.5 font-medium text-white transition-colors hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-50"
+                className="bg-primary text-primary-foreground hover:bg-primary/90 flex w-full items-center justify-center gap-2 rounded-lg py-2.5 font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-50"
               >
                 {submitting ? (
                   <>
@@ -127,7 +130,7 @@ export function ForgotPassword({ onNavigate }: ForgotPasswordProps) {
             <button
               type="button"
               onClick={() => onNavigate('/login')}
-              className="flex w-full items-center justify-center gap-2 text-sm text-gray-600 transition-colors hover:text-gray-800"
+              className="text-muted-foreground hover:text-foreground flex w-full items-center justify-center gap-2 text-sm transition-colors"
             >
               <ArrowLeft className="h-4 w-4" />
               Back to Sign In