chore(profile): align dev tools card with shared Card and Button primitives - #5415
Open
IamCoder18 wants to merge 1 commit into
Open
chore(profile): align dev tools card with shared Card and Button primitives#5415IamCoder18 wants to merge 1 commit into
IamCoder18 wants to merge 1 commit into
Conversation
Contributor
Code Review SummaryStatus: No Issues Found | Recommendation: Merge Files Reviewed (4 files)
Reviewed by grok-4.6 · Input: 171.4K · Output: 6.6K · Cached: 151K Review guidance: REVIEW.md from base branch |
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.
Summary
The
Development Toolscard on/profilewas the only Cloud surface that hardcoded red/amber utilities, used Comic Sans, painted a clip-path "DEV" banner, hand-rolled a<button>instead of the shared primitive, and labeled the destructive action "Nuke Account".It also capped to
lg:w-1/2with a heavyshadowwhile every sibling card was full-width and used surface-role depth. This PR brings the dev card in line with the Cloud design overlay (kilo-design-cloud), no new primitives, no behavior changes, only visual fixes to use the sharedCard, the sharedButton(apps/web/src/components/ui/button.tsx), and semantic tokens.Changes
apps/web/src/app/(app)/profile/page.tsx: devCardis now full-width, no shadow, no hardcoded red/amber. Title usesCardTitle, description usesCardDescription, section labels usetype-label. Loading-skeleton note updated to call out the intentional dev-only exclusion.apps/web/src/components/dev/DevConsumeCreditsButton.tsx: migrated to the sharedButton(variant="secondary").apps/web/src/components/dev/DevNukeAccountButton.tsx: migrated to the sharedButton(variant="destructive"); label renamed from "Nuke Account" to "Reset account".apps/web/src/components/dev/CreateKilocodeOrgButton.tsx: comic-sans font stack, clip-path banner, drop-shadow, and hand-rolled primary button removed; replaced with the sharedButton(variant="secondary").Verification
Ran the dev server and verified the UI on
/profile.Visual Changes
Reviewer Notes