rafraa/TX
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task #723: navy KPI numbers in rooms dashboard + compact next-booking row

Browse Source 
- protocol.tsx RoomsDashboardView: KPI numbers changed from text-sky-600
  to navy text-[#0f1d3d], matching the main dashboard styling from #722.
- "أقرب حجز قادم" gradient banner compacted: p-4 → px-3 py-2, content now
  a single inline flex row (label + title + room/time), countdown chip
  reduced (px-2.5 py-0.5 text-sm). Empty/loading state also compact.
- No logic or data changes; tsc --noEmit clean; HMR applied; architect PASS.
This commit is contained in:
Replit Agent
2026-07-09 07:59:34 +00:00
parent 6fd346692e
commit 42efb18eb6
1 changed files with 21 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
artifacts/tx-os/src/pages/protocol.tsx
+18 -14
View File
@@ -3316,7 +3316,7 @@ function RoomsDashboardView({
onClick={() => goTab(k.tab)}
className="bg-white rounded-2xl border border-slate-200 p-4 text-start hover:border-sky-300 hover:shadow-sm transition"
>
<div className="text-3xl font-bold text-sky-600">
<div className="text-3xl font-bold text-[#0f1d3d]">
{k.value ?? "—"}
</div>
<div className="text-sm text-slate-500 mt-1">{k.label}</div>
@@ -3327,32 +3327,36 @@ function RoomsDashboardView({
))}
</div>
<div className="bg-gradient-to-l from-sky-500 to-sky-600 rounded-2xl p-4 text-white shadow-sm">
<div className="flex items-center gap-2 text-sky-100 text-sm">
<Clock3 size={16} />
{t("protocol.roomsDash.nextBooking")}
</div>
<div className="bg-gradient-to-l from-sky-500 to-sky-600 rounded-2xl px-3 py-2 text-white shadow-sm">
{d?.nextBooking ? (
<div className="mt-2 flex flex-wrap items-center justify-between gap-3">
<div className="min-w-0">
<div className="font-bold text-lg truncate">
<div className="flex flex-wrap items-center justify-between gap-x-3 gap-y-1">
<div className="flex items-center gap-2 min-w-0">
<Clock3 size={14} className="shrink-0 text-sky-100" />
<span className="text-xs text-sky-100 whitespace-nowrap">
{t("protocol.roomsDash.nextBooking")}
</span>
<span className="font-bold text-sm truncate">
{d.nextBooking.title}
</div>
<div className="text-sm text-sky-100">
</span>
<span className="text-xs text-sky-100 truncate">
{nameOf(d.nextBooking.roomNameAr, d.nextBooking.roomNameEn)}
{" · "}
{fmtNextTime(d.nextBooking.startsAt)}
</span>
</div>
</div>
<div className="rounded-xl bg-white/15 px-4 py-2 text-xl font-bold whitespace-nowrap">
<div className="rounded-lg bg-white/15 px-2.5 py-0.5 text-sm font-bold whitespace-nowrap">
{countdown}
</div>
</div>
) : (
<div className="mt-2 text-sky-100 text-sm">
<div className="flex items-center gap-2 text-sky-100 text-xs">
<Clock3 size={14} className="shrink-0" />
{t("protocol.roomsDash.nextBooking")}
<span className="text-white">
{stats.isLoading
? t("common.loading")
: t("protocol.roomsDash.noUpcoming")}
</span>
</div>
)}
</div>