fix: Resolve frontend responsive design and data accuracy issues - #297
Merged
Merged
Conversation
- Fix Junirezz#291: WalletConnect tooltip overflow on small viewports - Changed whiteSpace from 'nowrap' to 'normal' to allow text wrapping - Added maxWidth constraint and responsive CSS for mobile viewports - Tooltip now respects viewport boundaries and wraps long error messages - Fix Junirezz#289: Portfolio summary cards show hardcoded trend strings - Compute totalNetValueTrend based on actual portfolio gain percentage - Compute cumulativeYieldTrend from realized gains - Compute weightedApyTrend from number of active positions - Replace all hardcoded trend strings with dynamic values - Fix Junirezz#293: Settings locale grid collapses on mobile - Move settings-locale-grid CSS from 768px to 480px media query - Ensures single-column layout on viewports at or below 480px - Improves touch interaction on mobile devices Closes Junirezz#291 Closes Junirezz#289 Closes Junirezz#293
|
@trinnode Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
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
2 participants
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.
Description
This PR resolves three frontend issues related to responsive design and data accuracy.
Changes
Issue #291: WalletConnect tooltip overflow on small viewports
whiteSpace: "nowrap"towhiteSpace: "normal"maxWidthconstraint and responsive CSS for mobile viewports.wallet-tooltipclass with responsive stylingIssue #289: Portfolio summary cards show hardcoded trend strings
totalNetValueTrend: Computed from actual portfolio gain percentagecumulativeYieldTrend: Derived from realized gains in USDCweightedApyTrend: Based on number of active positionsIssue #293: Settings locale grid collapses on mobile
.settings-locale-gridCSS from 768px media query to 480px media queryTesting
Acceptance Criteria
✅ Tooltip does not overflow the horizontal viewport boundary
✅ Long error messages wrap or are truncated gracefully
✅ Tested at 375px, 768px, and 1280px viewports
✅ Trend values are dynamically derived from real data
✅ No hardcoded percentage strings remain in production code
✅ Settings locale grid renders as single column at 480px
✅ Two-column layout retained on wider viewports
Closes #291
Closes #289
Closes #293