Skip to content

feat: mobile screen space optimizations#354

Merged
rjroy merged 7 commits intomainfrom
feat/hide-navs-on-mobile
Jan 18, 2026
Merged

feat: mobile screen space optimizations#354
rjroy merged 7 commits intomainfrom
feat/hide-navs-on-mobile

Conversation

@rjroy
Copy link
Copy Markdown
Owner

@rjroy rjroy commented Jan 18, 2026

Summary

  • Combine breadcrumb and Adjust button on same row in viewer toolbar
  • Eliminate duplicate path display on mobile - viewer header only shows when no file selected; each viewer now has its own mobile menu button in its toolbar
  • Unify adjust mode toolbar - Save/Cancel buttons share the same row as breadcrumb
  • Collapsible breadcrumbs - Long paths (>3 segments) collapse to Root / … / parent / file.md with tap-to-expand
  • Collapsible header on mobile - starts collapsed showing only logo button + toolbar; tap logo to expand full header, tap title to collapse
  • Semantic article element for viewer content wrapper

Test plan

  • On mobile, verify header starts collapsed (logo + toolbar only)
  • Tap logo to expand header, tap "Memory Loop" title to collapse
  • Navigate to a deeply nested file, verify breadcrumb shows Root / … / parent / file.md
  • Tap to expand full breadcrumb path
  • Open a file and tap Adjust - verify Save/Cancel on same row as breadcrumb
  • Verify mobile menu button appears in each viewer type (markdown, txt, json, csv, image, video, pdf, download)
  • On desktop, verify full header always shows (collapse state ignored)

🤖 Generated with Claude Code

rjroy and others added 6 commits January 18, 2026 08:05
Reduces vertical space usage by placing the breadcrumb navigation and
Adjust button in a shared toolbar row instead of separate rows.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Move the mobile menu button from browse-mode header into each viewer's
toolbar. The browse-mode viewer-header now only appears when no file is
selected. This prevents showing both a path and breadcrumb redundantly
on mobile devices.

Changes:
- BrowseMode: conditional viewer-header, pass onMobileMenuClick to viewers
- All viewers: add mobile menu button to toolbar/header
- MarkdownViewer: fix empty state check to use currentPath instead of
  currentFileContent so breadcrumb shows immediately when file selected

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Move Save/Cancel buttons into the toolbar alongside breadcrumb in adjust
mode for MarkdownViewer, TxtViewer, and JsonViewer. This ensures
consistent layout between normal and adjust modes, and includes the
mobile menu button in adjust mode.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
When a file path has more than 3 segments, the breadcrumb now shows:
  Root / … / parent / file.md

Tapping the ellipsis (…) expands to show the full path. The collapsed
state resets when navigating to a different file.

Applied to all viewers: MarkdownViewer, TxtViewer, JsonViewer, CsvViewer.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
On mobile, the header now starts collapsed showing only a logo button
next to the toolbar. Tapping the logo expands to show the full header
(app title, vault name, settings, version). Tapping the title collapses
it again.

This reclaims two rows of vertical space on mobile by default while
keeping all header functionality accessible.

Desktop layout is unchanged (always shows full header).

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@codecov
Copy link
Copy Markdown

codecov Bot commented Jan 18, 2026

Codecov Report

❌ Patch coverage is 99.71671% with 1 line in your changes missing coverage. Please review.

Files with missing lines Patch % Lines
frontend/src/App.tsx 95.45% 1 Missing ⚠️

📢 Thoughts on this report? Let us know!

Cover the new mobile menu button functionality and collapsible
breadcrumb behavior added in this PR.

- JsonViewer: empty/loading/error states, JSON rendering, breadcrumb
  navigation, collapsible breadcrumb, mobile menu button, adjust mode
- PdfViewer: basic rendering, download button, fallback, mobile menu
- VideoViewer: rendering, loading/error states, path changes, mobile menu

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@rjroy rjroy merged commit 5029150 into main Jan 18, 2026
2 checks passed
@rjroy rjroy deleted the feat/hide-navs-on-mobile branch January 18, 2026 17:14
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.

1 participant