Skip to content

Redesign Stories tab v2 — Moleskine book cards + clean mobile layout #709

@realproject7

Description

@realproject7

Problem

The Stories tab redesign from PR #706 used toggle buttons to collapse info — user doesn't like this approach. Remove ALL toggle/collapse buttons.

New design direction

Moleskine book cards (Image 222)

Use the same Moleskine notebook card design from the home page for each storyline:

  • Inside the book shape: genre tag at top, title in center, plot count + `active` tag at bottom
  • Below the book: all other info laid out neatly

Info below each book card

Arrange neatly, no toggle buttons, all visible:

  • Token price (PLOT + USD)
  • TVL (PLOT + USD)
  • Holders, views
  • Created date, deadline countdown
  • Royalties + Claim button (own profile only)
  • Donation history (own profile only)

Critical: mobile-first

This MUST look clean on mobile (375px). No overflow, no cramming.

Use `/frontend-design` skill

Files to modify

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

Branch

`task/709-stories-moleskine`

Self-Verification (T3)

  • Storyline cards use Moleskine book design from home page
  • Genre, title, plot count + active tag inside the book shape
  • All info visible below book — NO toggle/collapse buttons anywhere
  • Mobile (375px): clean, no overflow
  • Own profile: claim + donation history visible
  • Public profile: read-only
  • `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