Repository navigation
feat: redesign Dexa as a reference-style Pokédex - #26
Merged
Merged
Conversation
The rounded display face and navy/orange palette made Dexa feel like a toy. Archivo's width axis now covers headings and dense figures, the chrome is neutral grey so type colors are the only hues, and radii are tighter. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The translucent header with pill-shaped links read as a marketing site. It is now a solid bar with an underline marking the current section, matching the footer surface. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Rounded type pills wrapped unevenly and badges changed width with each name. Badges are now fixed-width tags, and the type filter sits in a grid of nine columns so every type lines up. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Big artwork tiles showed six Pokémon per screen and hid the numbers people compare. The Pokédex now opens as a dense table with types and base stats, sortable from the column headers, and the artwork grid stays available from a layout switch saved in the URL. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The artwork sat in a rounded blob beside a long column of details, so nothing on the page said at a glance what type a Pokémon was. The header is now a solid band in a deep shade of its primary type, with name, number and actions on the left and artwork on the right. Flavor text, abilities and measurements move into an About section, the section links become tabs, and on phones the page no longer scrolls sideways or hides the tabs under the header. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Every stat bar used the Pokémon's type color, so a weak stat looked the same as a strong one. Bars now use six rating bands from poor to exceptional, on Pokémon pages and in the team builder's averages. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Each page repeated its own heading classes, and cards, inputs and art fields still used the old large, pill-like radii. Page and section headings now share page-title and section-title utilities, and the remaining cards, bars and search fields use the tighter radius scale. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This branch was successfully deployed
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
1 participant
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.
Dexa looked like a toy: a bubbly display face, navy and orange chrome, and big rounded artwork tiles that showed six Pokémon per screen and hid the stats people compare. This redesign, modeled on Goldex, makes it read like a reference tool.
?view=grid.page-titleandsection-titleutilities, and the remaining cards and inputs use the new radius scale.Validated with
vp check,vp run check,vp testandvp build.🤖 Generated with Claude Code