Skip to content

Fix mobile header layout and space selector dropdown alignment#921

Merged
Dhravya merged 4 commits into
mainfrom
fix/responsive
May 11, 2026
Merged

Fix mobile header layout and space selector dropdown alignment#921
Dhravya merged 4 commits into
mainfrom
fix/responsive

Conversation

@ved015
Copy link
Copy Markdown
Member

@ved015 ved015 commented May 10, 2026

Description

This PR fixes mobile responsiveness issues while preserving desktop layout:

Mobile-only fixes

  1. Logo spacing - Removed negative left margin on mobile only (md:-ml-2) so the Supermemory logo no longer sticks to the left edge of the screen on small devices. Desktop layout unchanged.
  2. Space selector dropdown - Changed dropdown alignment to align="end" with alignOffset={-16} for mobile. This positions the "My Spaces" menu on the right side and keeps it fully visible within the viewport when opened from the mobile header. Desktop continues using left alignment.

Before

Screenshot 2026-05-10 at 12 47 50 PM

After

Screenshot 2026-05-10 at 12 55 54 PM

@claude
Copy link
Copy Markdown

claude Bot commented May 10, 2026

Claude finished @ved015's task in 1m 5s —— View job


Review Complete

  • Analyzing PR changes
  • Reviewing code for bugs and security issues
  • Submitting review

Summary: Clean CSS-only changes for mobile responsiveness. No bugs, security issues, or breaking changes found. The negative margin fix in header.tsx and conditional dropdown positioning in space-selector.tsx are well-implemented and preserve existing desktop behavior.

Score: 10/10 — Good to ship.

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
supermemory-mcp 7bb2fe4 May 10 2026, 07:28 AM

Copy link
Copy Markdown

@claude claude Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overview: Fixes mobile header layout by making the logo's negative margin desktop-only and adjusts the space selector dropdown alignment/sizing for compact (mobile) mode.

Issues found: None — this looks good to ship.

The changes are focused and minimal:

  • header.tsx: Moving -ml-2 to md:-ml-2 preserves desktop layout while fixing mobile spacing
  • space-selector.tsx: The conditional props based on compact are well-structured, and since compact defaults to false, existing behavior is preserved for non-compact usage

Score: 10/10

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
supermemory-app 7bb2fe4 Commit Preview URL

Branch Preview URL
May 10 2026, 07:29 AM

@ved015 ved015 requested a review from MaheshtheDev May 10, 2026 07:57
@Dhravya Dhravya merged commit 2d44ecd into main May 11, 2026
8 checks passed
@graphite-app graphite-app Bot requested a review from Dhravya May 11, 2026 18:55
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