Skip to content

Fix CJK overflow on story page — still broken after PR #687 #711

@realproject7

Description

@realproject7

Bug (Image 224)

Chinese/Japanese content still overflows the story page layout on desktop, pushing the sidebar off-screen. PR #687 added `word-break: break-word` to `.ruled-paper` but the issue persists.

Investigation needed

The CSS fix was applied to `.ruled-paper` in globals.css but the content container on the story page may have a parent that doesn't constrain width properly. Check:

  1. Does the main content column have `overflow: hidden` or `min-width: 0`?
  2. Is the grid layout (`lg:grid-cols-[1fr_320px]`) properly constraining the left column?
  3. Does the `.story-markdown` container need the same word-break rules?
  4. Test on https://plotlink.xyz/story/40 (Chinese) and https://plotlink.xyz/story/39 (Japanese)

Files to investigate

  • `src/app/story/[storylineId]/page.tsx` — grid layout, content column
  • `src/app/globals.css` — ruled-paper and story-markdown styles

Branch

`task/711-cjk-overflow-v2`

Self-Verification (T3)

  • story/40 (Chinese): content wraps within container, sidebar fully visible
  • story/39 (Japanese): same
  • English/Korean stories unaffected
  • `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