External/CoreControl
1
0
Fork 0
mirror of https://github.com/crocofied/CoreControl.git synced 2025-12-24 02:46:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update ServerDetail component to use full width for usage indicators, enhancing layout consistency for CPU, RAM, and Disk usage displays.

Browse Source
This commit is contained in:
headlessdev 2025-04-23 19:36:17 +02:00
parent 02c5128fae
commit 2b90e9b580
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/dashboard/servers/[server_id]/Server.tsx
View File

@ -470,7 +470,7 @@ export default function ServerDetail() {
<div className="grid grid-cols-[120px_1fr] text-sm gap-1">
<div className="text-muted-foreground">CPU Usage:</div>
<div className="flex items-center gap-2">
<div className="w-24 h-2 bg-secondary rounded-full overflow-hidden">
<div className="w-full h-2 bg-secondary rounded-full overflow-hidden">
<div
className={`h-full ${server.cpuUsage > 80 ? "bg-destructive" : server.cpuUsage > 60 ? "bg-amber-500" : "bg-emerald-500"}`}
style={{ width: `${server.cpuUsage}%` }}
@ -480,7 +480,7 @@ export default function ServerDetail() {
</div>
<div className="text-muted-foreground">RAM Usage:</div>
<div className="flex items-center gap-2">
<div className="w-24 h-2 bg-secondary rounded-full overflow-hidden">
<div className="w-full h-2 bg-secondary rounded-full overflow-hidden">
<div
className={`h-full ${server.ramUsage > 80 ? "bg-destructive" : server.ramUsage > 60 ? "bg-amber-500" : "bg-emerald-500"}`}
style={{ width: `${server.ramUsage}%` }}
@ -490,7 +490,7 @@ export default function ServerDetail() {
</div>
<div className="text-muted-foreground">Disk Usage:</div>
<div className="flex items-center gap-2">
<div className="w-24 h-2 bg-secondary rounded-full overflow-hidden">
<div className="w-full h-2 bg-secondary rounded-full overflow-hidden">
<div
className={`h-full ${server.diskUsage > 80 ? "bg-destructive" : server.diskUsage > 60 ? "bg-amber-500" : "bg-emerald-500"}`}
style={{ width: `${server.diskUsage}%` }}