caitlin/CRM_ENVR
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Update login page styling and sidebar collapse logo

Browse Source
This commit is contained in:
caitlin
2026-06-26 16:22:28 +02:00
parent 33a4f9dfa9
commit ec8207fca7
7 changed files with 139 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/layout/system-monitor.tsx
+32 -9
View File
@@ -3,9 +3,13 @@
import { useState, useEffect } from "react"
const RAM_LIMIT_MB = 8192
const CPU_LIMIT_PCT = 400 // 4 cores * 100%
const CPU_LIMIT_PCT = 400
export function SystemMonitor() {
interface SystemMonitorProps {
collapsed: boolean
}
export function SystemMonitor({ collapsed }: SystemMonitorProps) {
const [rssMB, setRssMB] = useState(0)
const [cpuPct, setCpuPct] = useState(0)
@@ -30,14 +34,33 @@ export function SystemMonitor() {
const ramOver = rssMB > RAM_LIMIT_MB
const cpuOver = cpuPct > CPU_LIMIT_PCT
if (collapsed) {
return (
<div className="border-t border-sidebar-border px-3 py-2 flex justify-center gap-1.5">
<span className={ramOver ? "text-red-400" : "text-[var(--theme-primary,#3b91f7)]"}>
{rssMB}
</span>
<span className={cpuOver ? "text-red-400" : "text-[var(--theme-primary,#3b91f7)]"}>
{cpuPct}%
</span>
</div>
)
}
return (
<div className="fixed top-0 left-0 z-[9999] flex items-center gap-3 px-3 py-1 text-[11px] font-mono bg-black/80 rounded-br-lg select-none">
<span className={ramOver ? "text-red-400" : "text-green-400"}>
RAM: {rssMB}MB / 8192MB
</span>
<span className={cpuOver ? "text-red-400" : "text-green-400"}>
CPU: {cpuPct}%
</span>
<div className="border-t border-sidebar-border px-3 py-2.5">
<div className="flex items-center justify-between text-[11px] font-mono">
<span className="text-sidebar-foreground/50">RAM</span>
<span className={ramOver ? "text-red-400 font-semibold" : "text-sidebar-foreground/80"}>
{rssMB}MB / {RAM_LIMIT_MB}MB
</span>
</div>
<div className="flex items-center justify-between text-[11px] font-mono mt-1">
<span className="text-sidebar-foreground/50">CPU</span>
<span className={cpuOver ? "text-red-400 font-semibold" : "text-sidebar-foreground/80"}>
{cpuPct}%
</span>
</div>
</div>
)
}