feat: enhance button styling with light variant and conditional color…#237
Conversation
…s in transaction item and edit project modal
There was a problem hiding this comment.
Pull request overview
This PR enhances button styling by introducing a "light" variant to buttons in the EditProjectModal and adds conditional color styling to the transaction amount display in TransactionItem.
- Adds "light" variant to all action buttons (delete and add buttons) in EditProjectModal for a more subtle appearance
- Changes button colors from "green.5" to "green" to use standard Mantine theme colors
- Introduces conditional gray coloring for transaction amounts when direction is "both"
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| src/components/TransactionItem.tsx | Adds conditional gray color to PAmount component when transaction direction is "both" |
| src/components/EditProjectModal.tsx | Updates button styling to use "light" variant and standardizes green color from "green.5" to "green" for consistency |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| )} | ||
| leadingIcon | ||
| coloring={direction !== "both"} | ||
| c={direction === "both" ? "#C9C9C9" : undefined} |
There was a problem hiding this comment.
The hardcoded hex color value "#C9C9C9" is inconsistent with the project's color usage patterns. The codebase consistently uses Mantine's theme color tokens (e.g., "dimmed", "blue", "gray.7") rather than hardcoded hex values. Consider using a theme color like "gray" or "dimmed" instead for better maintainability and theme consistency.
| c={direction === "both" ? "#C9C9C9" : undefined} | |
| c={direction === "both" ? "dimmed" : undefined} |
…s in transaction item and edit project modal
Closes #229