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

style(frontend): refactor InventoryTable for DESIGN.md compliance

Browse Source 
- Removed 'font-sans' and 'bg-green-500/10'
- Replaced hardcoded surface colors with black-based variants
- Consistent industrial accents for category and item icons
- Used 'text-rose-500' for low stock instead of 'text-warning'
This commit is contained in:
Daniel Bedeleanu
2026-04-25 13:04:07 +03:00
parent 1b789f6907
commit 1816fc2661
1 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/components/InventoryTable.tsx
View File

@@ -53,7 +53,7 @@ export default function InventoryTable({
if (categories.length === 0) {
return (
<div className="py-2 lg:py-3 xl:py-40 text-center text-[#888888] font-sans">
<div className="py-2 lg:py-3 xl:py-40 text-center text-[#888888]">
<Package size={48} className="mx-auto mb-4 opacity-10" />
<p className="font-normal">No Results Found</p>
</div>
@@ -61,17 +61,17 @@ export default function InventoryTable({
}
return (
<section className="space-y-4 font-sans">
<section className="space-y-4">
{categories.map(cat => {
const categoryItems = items.filter(i => i.category === cat);
return (
<div key={cat} className="bg-surface-container border border-border transition-all duration-300">
<div key={cat} className="level-1 transition-all duration-300">
<div
className="w-full p-2 md:p-3 flex items-center justify-between hover:bg-surface-bright transition-colors cursor-pointer"
className="w-full p-2 md:p-3 flex items-center justify-between hover:bg-black/40 transition-colors cursor-pointer"
onClick={() => onExpandCategory(expandedCategory === cat ? null : cat)}
>
<div className="flex items-center gap-3">
<div className="w-8 h-8 bg-primary/10 flex items-center justify-center text-primary border border-primary/20 transition-colors">
<div className="w-8 h-8 bg-black flex items-center justify-center text-primary border border-primary/20 transition-colors">
<Layers size={16} />
</div>
<div className="text-left">
@@ -89,7 +89,7 @@ export default function InventoryTable({
e.stopPropagation();
onEditCategory(cat);
}}
className="p-1.5 hover:bg-surface-bright text-secondary hover:text-primary transition-colors border border-transparent hover:border-border"
className="p-1.5 hover:bg-black text-secondary hover:text-primary transition-colors border border-transparent hover:border-border"
>
<EditIcon size={14} />
</button>
@@ -102,7 +102,7 @@ export default function InventoryTable({
{categoryItems.map(item => (
<div
key={item.id}
className="bg-black/20 p-2 md:p-3 flex items-center justify-between hover:bg-surface-bright/50 transition-colors"
className="bg-black/40 p-2 md:p-3 flex items-center justify-between hover:bg-black transition-colors"
>
<div
onClick={() => handleItemClick(item)}
@@ -124,7 +124,7 @@ export default function InventoryTable({
/>
</div>
) : (
<div className="w-10 h-10 bg-green-500/10 flex items-center justify-center text-green-500 shrink-0 border border-green-500/20">
<div className="w-10 h-10 bg-black flex items-center justify-center text-primary shrink-0 border border-primary/20">
<Package size={14} />
</div>
)}
@@ -138,7 +138,7 @@ export default function InventoryTable({
<div className="text-right shrink-0">
<span className={cn(
"text-base font-normal tabular-nums",
item.quantity <= item.min_quantity ? "text-warning" : "text-primary"
item.quantity <= item.min_quantity ? "text-rose-500" : "text-primary"
)}>
{item.quantity}
</span>