Skip to content

fix(ui): make package provenance section responsive#938

Merged
danielroe merged 2 commits intonpmx-dev:mainfrom
nicokempe:fix/provenance-responsive
Feb 5, 2026
Merged

fix(ui): make package provenance section responsive#938
danielroe merged 2 commits intonpmx-dev:mainfrom
nicokempe:fix/provenance-responsive

Conversation

@nicokempe
Copy link
Contributor

This PR fixes the mobile layout of <PackageProvenanceSection /> by switching the details row to a responsive grid and improving overflow handling for long links/paths. It also adds the missing #provenance anchor target so the section link resolves correctly.

Before:

image

After:

image image

@vercel
Copy link

vercel bot commented Feb 4, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
npmx.dev Ready Ready Preview, Comment Feb 4, 2026 1:31pm
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Feb 4, 2026 1:31pm
npmx-lunaria Ignored Ignored Feb 4, 2026 1:31pm

Request Review

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Feb 4, 2026

📝 Walkthrough

Walkthrough

The PackageProvenanceSection Vue component is restructured with layout and styling adjustments. The section element gains an id attribute for anchor navigation. Container padding is modified with responsive breakpoints. The header structure is reorganised and the details section converts from a flex-based layout to a responsive grid layout with different breakpoint handling. Individual detail items receive updated styling, including block-level text rendering with truncation and text wrapping properties applied to source commit, build file, and public ledger links. No public API changes are introduced.

Suggested reviewers

  • danielroe
🚥 Pre-merge checks | ✅ 1
✅ Passed checks (1 passed)
Check name Status Explanation
Description check ✅ Passed The pull request description clearly explains the changes: fixing mobile layout responsiveness, switching to a responsive grid, improving overflow handling, and adding a missing anchor target.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Important

Action Needed: IP Allowlist Update

If your organization protects your Git platform with IP whitelisting, please add the new CodeRabbit IP address to your allowlist:

  • 136.113.208.247/32 (new)
  • 34.170.211.100/32
  • 35.222.179.152/32

Reviews will stop working after February 8, 2026 if the new IP is not added to your allowlist.


Comment @coderabbitai help to get the list of available commands and usage tips.

@codecov
Copy link

codecov bot commented Feb 4, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

@danielroe danielroe added this pull request to the merge queue Feb 5, 2026
Merged via the queue into npmx-dev:main with commit 0b55ca4 Feb 5, 2026
16 checks passed
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.

2 participants