Estudio de escritura

Mobile editor layout (vs desktop)

Lectura de 3 min

A phone screen is ~10% of a desktop's — shrinking the desktop UI doesn't work. Slima on mobile is a redesigned editor: bottom navigation + sheets replace the side panels. This article compares to desktop; exact mobile elements may vary by device.

Desktop editor as a reference: activity bar, file tree, editor, Notes panel — mobile collapses both side panels into bottom sheets

Mobile vs desktop

Element Desktop Mobile
Activity bar Far-left vertical strip Folded into "More" sheet
Left panel (file tree) Always visible, resizable Bottom sheet swipes up
Right panel (AI Coach / Notes) Always visible Bottom sheet swipes up
Editor area Centre, one of 3 columns Full-screen (after panels collapse)
Format toolbar Top of the editor Floats above the on-screen keyboard
Sync / word count Bottom strip Folded into top header + More sheet

Mobile-specific elements

Top mini header

  • Left: ← back to shelf
  • Centre: current chapter title
  • Right: ⋯ more / settings

No toolbar at the top — the toolbar lives at the bottom, attached to the keyboard.

Editor area (centre, the largest region)

  • Same Markdown editor as desktop, larger default font (phones are usually closer to the eye)
  • No right-click → long-press selects and shows a context menu
  • Inline AI suggestion / smart enter still work

Bottom nav

Four large buttons at the bottom (exact icons vary by version; typical contents):

  • 📖 Chapter list sheet
  • ✏️ Editor
  • 💬 AI Coach sheet
  • ⋯ More sheet (settings / sync / word count)

What's in each sheet

  • Chapter sheet: all files in the current book + reorder / add / rename / search
  • AI Coach sheet: same conversation UI as desktop
  • More sheet: preferences / sync status / word counts / export / etc.

PWA differences

If installed as a PWA, the mobile experience is closer to a native app — launcher icon, offline support.

Related

Was this helpful?