Skip to content

feat(frontend): restyle home page hero to match official Manus layout - #178

Draft
Simpleyyt wants to merge 1 commit into
mainfrom
cursor/replicate-manus-homepage-9962
Draft

feat(frontend): restyle home page hero to match official Manus layout#178
Simpleyyt wants to merge 1 commit into
mainfrom
cursor/replicate-manus-homepage-9962

Conversation

@Simpleyyt

Copy link
Copy Markdown
Owner

Summary

Restyles the home page to follow the official Manus app's hero layout (centered greeting + large serif heading + task input + suggestion chips), based on a live visual review of manus.im.

  • HomePage.vue: hero block is now vertically and horizontally centered; small serif greeting line ("Hello, {name}") above a large serif heading ("What can I do for you?"); content column narrowed to 680px; added a centered row of pill-shaped suggestion chips (Create slides / Build website / Design / Create games) with a "More" chip that reveals four extra chips (Analyze data / Research / Write report / Create spreadsheet). Clicking a chip fills the input with a localized prompt starter and focuses the textarea.
  • ChatBox.vue: placeholder changed to "Assign a task or ask anything"; attach button restyled from a bordered paperclip to a borderless "+" icon button; exposes a focus() method for the chip interaction.
  • en.ts / zh.ts: new i18n keys for the placeholder, chip labels, and chip prompt starters (both locales).

Demo

manus_style_homepage_demo.mp4

Official reference Restyled home page
Official Manus reference Restyled homepage

Testing

  • npm run type-check — pass
  • npm run lint — pass (0 errors, pre-existing warnings only)
  • npm run test — 36/36 pass
  • npm run build — pass
  • Manual GUI testing via dev stack (./dev.sh up -d): verified hero layout, chip hover states, chip → prompt fill + focus, "More" expansion, send-button activation.

To show artifacts inline, enable in settings.

Open in Web Open in Cursor 

Co-authored-by: Simpleyyt <simpleyyt@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants