Build [v1.10.4]

frontend/components/admin/DatabaseManager.tsx

@@ -45,22 +45,22 @@ export default function DatabaseManager({
         
         <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-6">
           <div className="space-y-1 sm:pr-6">
-            <p className="text-[10px] font-black text-slate-500 tracking-tight">Database Health</p>
+            <p className="text-xs font-bold text-slate-500 tracking-tight uppercase">Database Health</p>
             <div className="flex items-center gap-2">
               <div className="w-2 h-2 rounded-full bg-green-500 animate-pulse shadow-[0_0_8px_rgba(34,197,94,0.3)]" />
               <span className="text-sm font-bold text-slate-200">Operational</span>
             </div>
           </div>
           <div className="sm:pl-6 sm:border-l border-slate-800">
-            <p className="text-[10px] font-black text-slate-500 tracking-tight">Last Backup</p>
+            <p className="text-xs font-bold text-slate-500 tracking-tight uppercase">Last Backup</p>
             <p className="text-sm font-bold text-slate-200 tabular-nums">{dbStats.backup_count > 0 ? 'Verified' : 'Pending...'}</p>
           </div>
           <div className="ml-auto">
-             <button 
-               onClick={onCreateBackup}
-               disabled={isBackingUp}
-               className="flex items-center gap-2 px-5 py-3 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-[10px] font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl shadow-indigo-600/10 tracking-tight"
-             >
+              <button 
+                onClick={onCreateBackup}
+                disabled={isBackingUp}
+                className="flex items-center gap-2 px-5 py-3 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-sm font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl shadow-indigo-600/10 tracking-tight"
+              >
                {isBackingUp ? <RotateCcw size={14} className="animate-spin" /> : <Database size={14} />}
                {isBackingUp ? "Snapshotting..." : "Force Backup"}
              </button>
@@ -75,14 +75,14 @@ export default function DatabaseManager({
                <History size={20} />
              </div>
              <div>
-               <h3 className="text-lg font-black text-white tracking-tight">Storage Policy</h3>
-               <p className="text-[10px] text-slate-500 font-bold tracking-tight">Retention & Maintenance</p>
-             </div>
+                <h3 className="text-lg font-black text-white tracking-tight">Storage Policy</h3>
+                <p className="text-xs text-slate-400 font-bold tracking-tight">Retention & Maintenance</p>
+              </div>
           </div>
 
           <div className="grid sm:grid-cols-3 gap-6">
             <div className="space-y-2">
-              <label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
+              <label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
                 <History size={10} /> Max Backups
               </label>
               <input 
@@ -93,7 +93,7 @@ export default function DatabaseManager({
               />
             </div>
             <div className="space-y-2">
-              <label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
+              <label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
                 <Clock size={10} /> Schedule (Hour)
               </label>
               <input 
@@ -105,7 +105,7 @@ export default function DatabaseManager({
               />
             </div>
             <div className="space-y-2">
-              <label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
+              <label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
                 <Zap size={10} /> Frequency (Days)
               </label>
               <input 
@@ -121,10 +121,10 @@ export default function DatabaseManager({
 
         <div className="space-y-4">
           <div className="flex items-center justify-between px-1">
-             <label className="text-[10px] font-black text-slate-500 tracking-tight">Recovery Points</label>
-             <div className="text-[10px] font-black text-indigo-400 tracking-tight bg-indigo-500/5 px-3 py-1 rounded-full border border-indigo-500/10">
-               {formatSize(dbStats.total_size_bytes)} Used
-             </div>
+              <label className="text-xs font-bold text-slate-500 tracking-tight">Recovery Points</label>
+              <div className="text-xs font-bold text-indigo-400 tracking-tight bg-indigo-500/5 px-3 py-1 rounded-full border border-indigo-500/10">
+                {formatSize(dbStats.total_size_bytes)} Used
+              </div>
           </div>
           
           <div className="space-y-2 pr-2 overflow-y-auto max-h-[300px] scrollbar-thin scrollbar-thumb-slate-800 scrollbar-track-transparent">
@@ -135,10 +135,10 @@ export default function DatabaseManager({
                     <Database size={14} />
                   </div>
                   <div>
-                    <p className="text-[11px] font-bold text-slate-200">{bak.filename}</p>
-                    <p className="text-[9px] text-slate-500 font-bold tabular-nums">
-                      {new Date(bak.created_at).toLocaleString()} • {formatSize(bak.size_bytes)}
-                    </p>
+                     <p className="text-xs font-bold text-slate-200">{bak.filename}</p>
+                     <p className="text-[11px] text-slate-400 font-medium tabular-nums">
+                       {new Date(bak.created_at).toLocaleString()} • {formatSize(bak.size_bytes)}
+                     </p>
                   </div>
                 </div>
                 <button 
@@ -154,12 +154,12 @@ export default function DatabaseManager({
         </div>
 
         <div className="grid grid-cols-2 gap-4 pt-2">
-          <button 
-            onClick={onExport}
-            className="flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-indigo-500/50 text-indigo-400 rounded-2xl text-[10px] font-black transition-all active:scale-95 tracking-tight shadow-xl shadow-black/20"
-          >
-            <Download size={14} /> Export Database
-          </button>
+           <button 
+             onClick={onExport}
+             className="flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-indigo-500/50 text-indigo-400 rounded-2xl text-sm font-black transition-all active:scale-95 tracking-tight shadow-xl shadow-black/20"
+           >
+             <Download size={14} /> Export Database
+           </button>
           <div className="relative">
             <input 
               type="file" 
@@ -167,9 +167,9 @@ export default function DatabaseManager({
               onChange={onImport}
               className="absolute inset-0 opacity-0 cursor-pointer z-10"
             />
-            <button className="w-full flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-rose-500/50 text-rose-500 rounded-2xl text-[10px] font-black transition-all tracking-tight shadow-xl shadow-black/20">
-              <Upload size={14} /> Import Database
-            </button>
+             <button className="w-full flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-rose-500/50 text-rose-500 rounded-2xl text-sm font-black transition-all tracking-tight shadow-xl shadow-black/20">
+               <Upload size={14} /> Import Database
+             </button>
           </div>
         </div>
       </div>