UI enhancements and performance optimizations

This commit is contained in:
Satyam
2026-02-18 12:52:17 +05:30
parent ffbbc61726
commit 36e74e9fbc
10 changed files with 89 additions and 47 deletions
+12 -17
View File
@@ -162,13 +162,12 @@ const ContractorDashboard = () => {
<h4 className="font-bold text-zinc-900 dark:text-white">{proj.address}</h4>
<p className="text-xs text-zinc-500 dark:text-zinc-400">{proj.projectType} Started {new Date(proj.startDate).toLocaleDateString()}</p>
</div>
<span className={`px-2 py-1 text-xs font-bold rounded uppercase ${
proj.spent > proj.budget
<span className={`px-2 py-1 text-xs font-bold rounded uppercase ${proj.spent > proj.budget
? 'bg-red-100 dark:bg-red-500/20 text-red-600 dark:text-red-400'
: proj.completionPercentage >= 70
? 'bg-emerald-100 dark:bg-emerald-500/20 text-emerald-600 dark:text-emerald-400'
: 'bg-blue-100 dark:bg-blue-500/20 text-blue-600 dark:text-blue-400'
}`}>
}`}>
{proj.spent > proj.budget ? 'Over Budget' : proj.completionPercentage >= 70 ? 'On Track' : 'In Progress'}
</span>
</div>
@@ -218,30 +217,26 @@ const ContractorDashboard = () => {
<div
key={idx}
onClick={() => handleTaskClick(ms)}
className={`flex items-start gap-3 p-3 rounded-lg transition-colors cursor-pointer group ${
new Date(ms.dueDate) < new Date('2026-02-18')
className={`flex items-start gap-3 p-3 rounded-lg transition-colors cursor-pointer group ${new Date(ms.dueDate) < new Date('2026-02-18')
? 'bg-red-50 dark:bg-red-500/5 hover:bg-red-100 dark:hover:bg-red-500/10'
: ms.status === 'in_progress'
? 'bg-blue-50 dark:bg-blue-500/5 hover:bg-blue-100 dark:hover:bg-blue-500/10'
: 'bg-amber-50 dark:bg-amber-500/5 hover:bg-amber-100 dark:hover:bg-amber-500/10'
}`}
}`}
>
<div className={`mt-1 w-2 h-2 rounded-full shrink-0 group-hover:scale-125 transition-transform ${
new Date(ms.dueDate) < new Date('2026-02-18') ? 'bg-red-500' :
ms.status === 'in_progress' ? 'bg-blue-500' : 'bg-amber-500'
}`} />
<div className={`mt-1 w-2 h-2 rounded-full shrink-0 group-hover:scale-125 transition-transform ${new Date(ms.dueDate) < new Date('2026-02-18') ? 'bg-red-500' :
ms.status === 'in_progress' ? 'bg-blue-500' : 'bg-amber-500'
}`} />
<div>
<h5 className="text-sm font-bold text-zinc-900 dark:text-white">{ms.name}</h5>
<p className="text-xs text-zinc-500 dark:text-zinc-400 mt-0.5">{ms.projectAddress}</p>
<div className="flex items-center gap-2 mt-1">
<p className={`text-xs font-mono font-medium ${
new Date(ms.dueDate) < new Date('2026-02-18') ? 'text-red-500' : 'text-zinc-500'
}`}>Due: {ms.dueDate}</p>
<span className={`text-[10px] font-bold uppercase px-1.5 py-0.5 rounded ${
ms.status === 'in_progress'
<p className={`text-xs font-mono font-medium ${new Date(ms.dueDate) < new Date('2026-02-18') ? 'text-red-500' : 'text-zinc-500'
}`}>Due: {ms.dueDate}</p>
<span className={`text-[10px] font-bold uppercase px-1.5 py-0.5 rounded ${ms.status === 'in_progress'
? 'bg-blue-100 text-blue-600 dark:bg-blue-500/20 dark:text-blue-400'
: 'bg-amber-100 text-amber-600 dark:bg-amber-500/20 dark:text-amber-400'
}`}>{ms.status.replace('_', ' ')}</span>
}`}>{ms.status.replace('_', ' ')}</span>
</div>
</div>
</div>
@@ -287,7 +282,7 @@ const ContractorDashboard = () => {
onClose={() => setIsTaskModalOpen(false)}
task={selectedTask}
/>
<span className="attribution-ghost">igotsar.matyas | LynkedUpPro - Turns out roofing CRMs don't build themselves. Who knew?</span>
<span className="attribution-ghost">{'5'}{'~'}{'a'}{'~'}{'t'}{'~'}{'y'}{'~'}{'a'}{'~'}{'m'} | LynkedUpPro - Turns out roofing CRMs don't build themselves. Who knew?</span>
</div>
);
};