Skip to content

Redesign Portfolio tab v2 — complete mobile-friendly redesign #710

@realproject7

Description

@realproject7

Problem (Image 223)

The Portfolio tab redesign from PR #707 is messier on mobile than before. Toggle buttons make it worse. Need a complete mobile-friendly redesign.

Requirements

  • Remove ALL toggle/collapse buttons — everything visible
  • Mobile-first layout — design for 375px first, then scale up
  • Clean visual hierarchy — portfolio value prominent, then holdings, then donations, then trades
  • Use `/frontend-design` skill for a fresh approach

Information to display (all visible, no hiding)

  1. Portfolio summary: total value (PLOT + USD), token count, best 24h pick
  2. Token holdings: per-token cards with name, genre, value, balance, price, entry price, 24h change, last traded
  3. Donations: received total + given total with per-story breakdown
  4. Trading history: buy/sell rows with story name, tokens, cost, date

Design constraints

  • No toggle/collapse/accordion patterns
  • Must not overflow on mobile
  • Consistent card styling
  • PlotLink terminal aesthetic

Files to modify

  • `src/app/profile/[address]/page.tsx` — Portfolio tab section

Branch

`task/710-portfolio-mobile-redesign`

Self-Verification (T3)

  • Zero toggle/collapse buttons on the page
  • Mobile (375px): clean, readable, no overflow
  • All info visible: portfolio, holdings, donations, trades
  • Desktop: good use of horizontal space
  • `npm run build` passes

Metadata

Metadata

Assignees

No one assigned

    Labels

    agent/T3Assigned to T3 builder agent

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions