feat(ui): redesign analytics page — stat cards, styled charts, git-log activity feed
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -44,7 +44,7 @@ export default function CategoryBreakdown({ minutes: _minutes, taskId: _taskId }
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="flex items-center justify-center h-64 text-[#94a3b8] text-sm">
|
||||
<div className="flex items-center justify-center h-64 text-[var(--color-text-secondary)] text-sm">
|
||||
Loading category breakdown...
|
||||
</div>
|
||||
)
|
||||
@@ -52,7 +52,7 @@ export default function CategoryBreakdown({ minutes: _minutes, taskId: _taskId }
|
||||
|
||||
if (categories.length === 0) {
|
||||
return (
|
||||
<div className="flex items-center justify-center h-64 text-[#94a3b8] text-sm">
|
||||
<div className="flex items-center justify-center h-64 text-[var(--color-text-secondary)] text-sm">
|
||||
No category data available.
|
||||
</div>
|
||||
)
|
||||
@@ -88,14 +88,14 @@ export default function CategoryBreakdown({ minutes: _minutes, taskId: _taskId }
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
backgroundColor: '#1e293b',
|
||||
border: '1px solid rgba(255,255,255,0.1)',
|
||||
backgroundColor: 'var(--color-elevated)',
|
||||
border: '1px solid var(--color-border)',
|
||||
borderRadius: 8,
|
||||
padding: '8px 12px',
|
||||
}}
|
||||
>
|
||||
<div className="text-white text-sm font-medium">{d.name}</div>
|
||||
<div className="text-[#94a3b8] text-xs mt-0.5">
|
||||
<div className="text-[var(--color-text-primary)] text-sm font-medium">{d.name}</div>
|
||||
<div className="text-[var(--color-text-secondary)] text-xs mt-0.5">
|
||||
{d.count} events ({d.percentage}%)
|
||||
</div>
|
||||
</div>
|
||||
@@ -119,13 +119,13 @@ export default function CategoryBreakdown({ minutes: _minutes, taskId: _taskId }
|
||||
{/* Name + bar + stats */}
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center justify-between mb-1">
|
||||
<span className="text-sm text-white font-medium truncate">{cat.name}</span>
|
||||
<span className="text-xs text-[#94a3b8] ml-2 shrink-0">
|
||||
<span className="text-sm text-[var(--color-text-primary)] font-medium truncate">{cat.name}</span>
|
||||
<span className="text-xs text-[var(--color-text-secondary)] ml-2 shrink-0">
|
||||
{cat.count} ({cat.percentage}%)
|
||||
</span>
|
||||
</div>
|
||||
{/* Progress bar */}
|
||||
<div className="h-1.5 rounded-full bg-white/5 overflow-hidden">
|
||||
<div className="h-1.5 rounded-full bg-[var(--color-border)] overflow-hidden">
|
||||
<div
|
||||
className="h-full rounded-full transition-all duration-300"
|
||||
style={{
|
||||
|
||||
Reference in New Issue
Block a user