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

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

Browse Source 
- Replaced hardcoded background colors with 'level-0' and 'level-1'
- Ensured sharp corners and removed 'rounded' classes
- Cleaned up excessive responsive text classes
This commit is contained in:
Daniel Bedeleanu
2026-04-25 13:03:15 +03:00
parent 7e49075d50
commit 530b0ec2f9
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/components/LogsOverlay.tsx
View File

@@ -14,7 +14,7 @@ export default function LogsOverlay({ show, onClose, logs, inventory }: LogsOver
if (!show) return null;
return (
<div className="fixed inset-0 z-50 flex flex-col bg-background p-6 lg:p-8 xl:p-10 animate-in slide-in-from-bottom-20 duration-500">
<div className="fixed inset-0 z-50 flex flex-col level-0 p-6 lg:p-8 animate-in slide-in-from-bottom-20 duration-500">
<div className="flex justify-between items-center mb-8">
<div>
<h2 className="text-2xl font-normal tracking-tight">Audit History</h2>
@@ -22,7 +22,7 @@ export default function LogsOverlay({ show, onClose, logs, inventory }: LogsOver
</div>
<button
onClick={onClose}
className="p-3 lg:p-4 xl:p-5 lg:p-6 xl:p-8 bg-surface rounded-none text-secondary"
className="p-3 bg-black border border-border text-secondary hover:text-white transition-colors"
>
<X size={24} />
</button>
@@ -36,7 +36,7 @@ export default function LogsOverlay({ show, onClose, logs, inventory }: LogsOver
</div>
) : (
logs.map((log) => (
<div key={log.id} className="bg-surface/70 border border-border p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 rounded-none flex items-center justify-between gap-4">
<div key={log.id} className="level-1 p-4 lg:p-5 flex items-center justify-between gap-4 transition-colors hover:border-muted">
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 mb-1">
<p className={`text-xs font-normal ${
@@ -54,11 +54,11 @@ export default function LogsOverlay({ show, onClose, logs, inventory }: LogsOver
</div>
{(log.details || log.timestamp) && (
<div className="flex items-center gap-3 mt-2">
<p className="text-xs lg:text-sm xl:text-base lg:text-lg xl:text-xl lg:text-2xl xl:text-3xl lg:text-4xl xl:text-5xl text-secondary font-mono">
<p className="text-xs text-secondary font-mono">
{new Date(log.timestamp).toLocaleString()}
</p>
{log.details && (
<span className="text-xs lg:text-sm xl:text-base lg:text-lg xl:text-xl lg:text-2xl xl:text-3xl lg:text-4xl xl:text-5xl bg-surface-bright text-muted px-2 py-0.5 rounded border border-border font-mono">
<span className="text-xs bg-black text-muted px-2 py-0.5 border border-border font-mono">
{log.details}
</span>
)}