fix(web): center Size column in run list

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Bryan Helmkamp 2026-05-29 01:01:45 -04:00
parent 87516c25ce
commit 7e33f7a01a
No known key found for this signature in database
3 changed files with 5 additions and 5 deletions

View file

@ -117,7 +117,7 @@ export function RunTableRow({
</td>
)}
{show("size") && (
<td className="whitespace-nowrap px-3 py-2.5 text-right">
<td className="whitespace-nowrap px-3 py-2.5 text-center">
{run.size != null && <SizeChip size={run.size} />}
</td>
)}

View file

@ -174,7 +174,7 @@ export function RunsListView({
<SortHeader label="Elapsed" sortKey="elapsed" activeSort={sort} direction={direction} align="right" onClick={onSortClick} />
)}
{show("size") && (
<SortHeader label="Size" sortKey="size" activeSort={sort} direction={direction} align="right" onClick={onSortClick} />
<SortHeader label="Size" sortKey="size" activeSort={sort} direction={direction} align="center" onClick={onSortClick} />
)}
{show("changes") && (
<SortHeader label="Changes" sortKey="changes" activeSort={sort} direction={direction} align="right" onClick={onSortClick} />

View file

@ -14,7 +14,7 @@ export function SortHeader<TKey extends string>({
sortKey: TKey;
activeSort: TKey;
direction: SortDirection;
align?: "left" | "right";
align?: "left" | "center" | "right";
onClick: (key: TKey) => void;
}) {
const isActive = activeSort === sortKey;
@ -27,12 +27,12 @@ export function SortHeader<TKey extends string>({
<th
scope="col"
aria-sort={ariaSort}
className={`whitespace-nowrap px-3 py-2.5 font-medium ${align === "right" ? "text-right" : "text-left"}`}
className={`whitespace-nowrap px-3 py-2.5 font-medium ${align === "right" ? "text-right" : align === "center" ? "text-center" : "text-left"}`}
>
<button
type="button"
onClick={() => onClick(sortKey)}
className={`inline-flex items-center gap-1 transition-colors hover:text-fg-2 ${isActive ? "text-fg-2" : "text-fg-3"} ${align === "right" ? "ml-auto" : ""}`}
className={`inline-flex items-center gap-1 transition-colors hover:text-fg-2 ${isActive ? "text-fg-2" : "text-fg-3"} ${align === "right" ? "ml-auto" : align === "center" ? "mx-auto" : ""}`}
>
<span>{label}</span>
{isActive ? (