junte/assessment-model
1
0
Fork 0
mirror of https://github.com/Hestia-Homes/assessment-model.git synced 2026-06-30 12:55:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

fixing layout

Browse source
This commit is contained in:
Khalim Conn-Kowlessar 2026-05-07 12:07:46 +00:00
parent 191310ebc4
commit 456ca454a6
3 changed files with 35 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/app/portfolio/[slug]/(portfolio)/your-projects/live/PibiSection.tsx
View file

@ -16,6 +16,12 @@ import {
formatDate,
} from "@/app/lib/pibiSectionHelpers";
import type { PibiRow } from "@/app/lib/pibiSectionHelpers";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/app/shadcn_components/ui/tooltip";
// ── TableMeta augmentation ────────────────────────────────────────────────────
@ -78,16 +84,26 @@ function ScopeBadge({
}) {
if (approved.includes(measure)) {
return (
<span className="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-semibold bg-emerald-50 border border-emerald-200 text-emerald-700">
Approved
</span>
<Tooltip>
<TooltipTrigger asChild>
<span className="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-semibold bg-emerald-50 border border-emerald-200 text-emerald-700 cursor-default">
Approved
</span>
</TooltipTrigger>
<TooltipContent>This measure has been technically approved for installation</TooltipContent>
</Tooltip>
);
}
if (proposed.includes(measure)) {
return (
<span className="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-semibold bg-blue-50 border border-blue-200 text-blue-700">
Proposed
</span>
<Tooltip>
<TooltipTrigger asChild>
<span className="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-semibold bg-blue-50 border border-blue-200 text-blue-700 cursor-default">
Proposed
</span>
</TooltipTrigger>
<TooltipContent>This measure has been proposed but not yet approved</TooltipContent>
</Tooltip>
);
}
return null;
@ -113,7 +129,7 @@ const COLUMNS = [
}
disabled={r.isSaving}
data-testid={`pibi-measure-select-${r.id}`}
className="rounded border border-gray-200 px-2 py-1 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40 max-w-[160px]"
className="rounded border border-gray-200 px-1.5 py-0.5 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40 w-[130px]"
>
{MEASURE_NAMES.map((m) => (
<option key={m} value={m}>
@ -155,7 +171,7 @@ const COLUMNS = [
}
disabled={r.isSaving}
data-testid={`pibi-ordered-date-${r.id}`}
className="rounded border border-gray-200 px-2 py-1 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40"
className="rounded border border-gray-200 px-1.5 py-0.5 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40 w-[110px]"
/>
);
},
@ -184,7 +200,7 @@ const COLUMNS = [
}
disabled={r.isSaving}
data-testid={`pibi-completed-date-${r.id}`}
className="rounded border border-gray-200 px-2 py-1 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40"
className="rounded border border-gray-200 px-1.5 py-0.5 text-xs text-gray-800 focus:outline-none focus:ring-1 focus:ring-brandblue/40 w-[110px]"
/>
);
},
@ -542,6 +558,7 @@ export function PibiSection({
const hasIncomplete = tableRows.some((r) => !r.isNew && !r.completedAt);
return (
<TooltipProvider>
<div className="space-y-3" data-testid="pibi-section">
{/* Header actions */}
<div className="flex items-center gap-2">
@ -588,8 +605,8 @@ export function PibiSection({
{/* Table */}
{tableRows.length > 0 && (
<div className="rounded-xl border border-gray-100 overflow-hidden">
<table className="w-full text-xs">
<div className="rounded-xl border border-gray-100 overflow-x-auto">
<table className="w-full text-xs min-w-[560px]">
<thead>
{table.getHeaderGroups().map((hg) => (
<tr
@ -599,7 +616,7 @@ export function PibiSection({
{hg.headers.map((h) => (
<th
key={h.id}
className="px-3 py-1.5 text-left text-[10px] font-semibold text-gray-400 uppercase tracking-wider"
className="px-2 py-1.5 text-left text-[10px] font-semibold text-gray-400 uppercase tracking-wider whitespace-nowrap"
>
{flexRender(
h.column.columnDef.header,
@ -622,7 +639,7 @@ export function PibiSection({
}
>
{row.getVisibleCells().map((cell) => (
<td key={cell.id} className="px-3 py-2">
<td key={cell.id} className="px-2 py-1.5">
{flexRender(
cell.column.columnDef.cell,
cell.getContext(),
@ -636,5 +653,6 @@ export function PibiSection({
</div>
)}
</div>
</TooltipProvider>
);
}

6
src/app/portfolio/[slug]/(portfolio)/your-projects/live/[dealId]/DealPage.tsx
View file

@ -92,7 +92,7 @@ export default function DealPage({
<div className="grid grid-cols-12 gap-6">
{/* ── Left Sidebar: Property Info ─────────────────────────── */}
<aside className="col-span-12 lg:col-span-3 space-y-5">
<aside className="col-span-12 lg:col-span-2 space-y-5">
<div className="bg-white rounded-xl border border-gray-200 shadow-sm p-5 space-y-5">
{/* Header info */}
@ -209,7 +209,7 @@ export default function DealPage({
</aside>
{/* ── Center: Tabs ─────────────────────────────────────────── */}
<section className="col-span-12 lg:col-span-6 space-y-4">
<section className="col-span-12 lg:col-span-8 space-y-4">
{/* Tab bar */}
<div className="flex gap-1 p-1 bg-brandlightblue/10 border border-brandblue/10 rounded-xl">
{VALID_TABS.map((tab) => (
@ -401,7 +401,7 @@ export default function DealPage({
</section>
{/* ── Right Sidebar: Actions ───────────────────────────────── */}
<aside className="col-span-12 lg:col-span-3 space-y-4">
<aside className="col-span-12 lg:col-span-2 space-y-4">
{/* Removal state badge */}
{removalState !== "none" && (

2
src/app/portfolio/[slug]/(portfolio)/your-projects/live/[dealId]/page.tsx
View file

@ -335,7 +335,7 @@ export default async function DealDetailPage(props: {
};
return (
<div className="max-w-7xl mx-auto px-6 pb-10 space-y-4">
<div className="max-w-screen-2xl mx-auto px-6 pb-10 space-y-4">
<div className="mb-6">
<nav className="flex items-center gap-1.5 text-sm text-gray-500 mb-3">
<Link