bede/tfm_ainventory
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ui): unify card typography across application

Browse Source
This commit is contained in:
Daniel Bedeleanu
2026-04-17 09:45:20 +03:00
parent 572422b677
commit ff86ec953e
6 changed files with 25 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/app/globals.css
View File

@@ -50,6 +50,14 @@ body {
.text-fluid-xl {
font-size: clamp(1.5rem, 5cqi, 2.25rem);
}
.card-title {
@apply text-base font-black text-slate-100 tracking-tight;
}
.card-subtitle {
@apply text-[10px] font-bold text-slate-500 uppercase tracking-[0.08em] mt-0.5;
}
}
/* Safe Area Insets for Modern Mobile Devices (iOS Notch/Home Bar) */

8
frontend/app/inventory/page.tsx
View File

@@ -312,8 +312,8 @@ export default function InventoryPage() {
<Layers size={20} />
</div>
<div className="text-left">
<h3 className="font-bold text-lg">{cat}</h3>
<p className="text-xs font-bold text-slate-400 mt-1 uppercase tracking-tight">
<h3 className="card-title text-base sm:text-lg">{cat}</h3>
<p className="card-subtitle tracking-tight">
{inventory.filter(i => i.category === cat).length} Item types in stock
</p>
</div>
@@ -354,8 +354,8 @@ export default function InventoryPage() {
<Package size={14} />
</div>
<div className="truncate">
<h4 className="font-bold text-slate-200 truncate">{item.name}</h4>
<p className="text-xs text-slate-400 truncate mt-1">{item.specs}</p>
<h4 className="card-title truncate">{item.name}</h4>
<p className="card-subtitle mt-0 lowercase opacity-80 truncate">{item.specs}</p>
</div>
</div>
<div className="text-right shrink-0">

10
frontend/app/logs/page.tsx
View File

@@ -216,13 +216,13 @@ export default function LogsPage() {
</div>
<div className="flex-1 min-w-0">
<h3 className="text-base font-bold text-slate-100 group-hover:text-primary transition-colors truncate">
<h3 className="card-title group-hover:text-primary transition-colors truncate">
{log.resolved_name}
</h3>
<div className="flex items-center gap-2 mt-0.5">
<span className="text-[11px] font-bold text-slate-400 uppercase tracking-tight shrink-0">{log.username || 'System'}</span>
<span className="w-1 h-1 rounded-full bg-slate-800 shrink-0" />
<span className="text-[11px] text-slate-400 font-medium tabular-nums truncate">
<div className="flex items-center gap-2">
<span className="card-subtitle mt-0 shrink-0">{log.username || 'System'}</span>
<span className="w-1 h-1 rounded-full bg-slate-800 shrink-0 mt-1" />
<span className="card-subtitle mt-0 lowercase opacity-80 truncate">
{new Date(log.timestamp).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })} · {new Date(log.timestamp).toLocaleDateString()}
</span>
</div>