Skip to content

Fix artifact listing column alignment - #371

Closed
Sebastians007 wants to merge 1 commit into
CPAtoCybersecurity:mainfrom
Sebastians007:fix/artifact-listing-header-alignment
Closed

Sebastians007 wants to merge 1 commit into
CPAtoCybersecurity:mainfrom
Sebastians007:fix/artifact-listing-header-alignment

Conversation

@Sebastians007

Copy link
Copy Markdown
Contributor

Summary

  • The Artifacts list header and data rows use width classes (w-20, w-24, w-28, w-36, w-56, w-64, min-w-max) that don't exist in src/index.css (this project hand-defines its own utility classes rather than building with Tailwind). Undefined classes are silently ignored, so each column sized to its own content instead of a fixed width — a long artifact ID (e.g. a full UUID) pushed every later column out of alignment with the header.
  • Added the missing width/min-width utility definitions to src/index.css.
  • Added min-w-0 to the truncating columns (ID, Artifact Name) and the Assignee/Reporter avatar wrappers in src/pages/Artifacts.js so long values ellipsis instead of expanding the row.

Closes #356

Test plan

  • Reproduced the bug by injecting a long artifact ID into a row and confirming the column grew past its intended width, misaligning every column after it.
  • Confirmed the fix: column width locks at the intended size, long text truncates with an ellipsis, and all columns line up with the header.
  • Ran the Artifacts test suite (react-scripts test --testPathPattern=Artifacts) — 65 tests, 3 suites, all passing.

…gned

Closes #356. This project has no Tailwind build; src/index.css hand-
defines each utility class JSX uses. The artifact listing's header and
rows used w-20/w-24/w-28/w-36/w-56/w-64 and min-w-max, none of which
existed in index.css, so those classes silently no-opped and every
column sized to its own content instead of a fixed width — long values
(e.g. a full artifact UUID) pushed later columns out of alignment with
the header.

Added the missing width/min-width utilities, plus min-w-0 on the
truncating columns and their inner flex wrappers so long IDs/names
ellipsis instead of growing the row.
@Sebastians007 Sebastians007 closed this by deleting the head repository Oct 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Artifact Listing - Incorrect Header Alignment

1 participant