User Guide · 03
Interface Overview
3.1 Main Interface Layout
text
┌──────────┬──────────────────────────────────────┐
│ Sidebar │ │
│ (240px) │ Content Area │
│ │ │
│ ┌──────┐ │ │
│ │User │ │ │
│ │row + │ │ │
│ │gear │ │ │
│ ├──────┤ │ │
│ │ │ │ │
│ │Conv │ │ │
│ │list /│ │ │
│ │Settings│ │ │
│ │menu │ │ │
│ ├──────┤ │ │
│ │Logo │ │ │
│ │+theme│ │ │
│ │+file │ │ │
│ │+... │ │ │
│ │+exit │ │ │
│ └──────┘ │ │
└──────────┴──────────────────────────────────────┘Sidebar elements (top to bottom):
- User row: avatar + username + settings gear button (enters Settings Center)
- Content area: conversation page shows conversation list; settings page shows settings nav menu
- Brand area: JellyfishBot Logo + name (click to collapse sidebar from 240px → 64px)
- Bottom quick actions: System Prompt / Subagent / User Profile / File Panel (all with tooltips) + Theme toggle (Sun/Moon/Terminal three-state cycle)
- Bottom user area: Avatar + username + logout button
Top right: File panel button (visible only on chat page).
3.2 Page Navigation
| Path | Page | Entry |
|---|---|---|
/ | Chat | Default home |
/settings/prompt | Operation Rules (System Prompt + Memory & Soul + Capability Prompts) | Settings → Prompt |
/settings/subagents | Subagent Management | Settings → Subagent Management |
/settings/packages | Python Environment | Settings → Python Environment |
/settings/inbox | Inbox | Settings → Inbox (with unread badge) |
/settings/general | General (API Key + Timezone + Theme + Batch Run + Advanced) | Settings → General |
/settings/services | Service Management | Settings → Service Management |
/settings/scheduler | Scheduled Tasks | Settings → Scheduled Tasks |
/settings/wechat | WeChat Integration | Settings → WeChat |
3.3 Multi-Theme Switching
The sidebar bottom Sun/Moon/Terminal icon cycles through themes, or choose in Settings → General → Theme.
| Theme | Style |
|---|---|
| dark (default) | Warm pink-purple dark |
| cyber-ocean | Cyan-blue light |
| terminal | Phosphor-green CRT terminal (global monospace + no border radius + phosphor glow + scanlines) |
Theme choice persists in browser localStorage.