Repository navigation
fix(tools): make each tools card a link to its docs page - #56
Merged
Merged
Conversation
Only the arrow button navigated, through router.push, while the card's pointer cursor and whole-card hover made the rest look clickable. A Link now fills each card, and the arrow is a second link to the same page, kept out of the tab order and the accessibility tree. Generated with Claude <noreply@anthropic.com>
jm-rivera
marked this pull request as ready for review
October 23, 2026 22:39
Generated with Claude <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Each card in the home page's "Build in your own tools" section opens its docs page from a click anywhere on the card. Only the arrow button navigated before, through
router.push, while the card's pointer cursor and whole-card arrow hover made the rest of it look clickable.In
BuildTools.tsx, aLinkwraps the title and text and fills the box. The arrow is a secondButtonwith the samehref, set beside the link because an anchor cannot hold another anchor, and kept out of the tab order and the accessibility tree withtabIndex={-1}andaria-hidden. The Gallery tiles use the same arrangement. A stretched::afteron the arrow would need one element only, but the arrow'sdata-revealsetstranslate, which makes the arrow the containing block and shrinks the overlay to the arrow's own size.In
BuildTools.module.scss, the box padding moves to.boxLink, withrem(48)at the bottom to keep the text clear of the arrow, which sits absolutely positioned in the bottom-right corner.Testing:
tsc --noEmit, ESLint and Stylelint pass. On a local dev server at 1440px wide, a click in the empty lower-left corner of each card opened/docs/api/quickstart,/docs/tools/oda-reader,/docs/mcp/connectand/docs/build/embed, and a click on the MCP Server arrow opened/docs/mcp/connect. A screenshot of the section matched the existing layout.Generated with Claude noreply@anthropic.com