- Removed hideMobileTopBar prop from MainLayout entirely
- Added STICKY_HEADER_CLASS constant in utils for consistent mobile-aware
sticky positioning (top-10 on mobile, top-0 on desktop)
- Updated all pages to use the shared constant: Search, KindFeed (Vines),
Hashtag, Wallet, Settings, Placeholder, NotFound, Bookmarks,
Notifications, and Profile
- Back arrows hidden on desktop where sidebar provides navigation
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
Right sidebar was 340px vs left sidebar 300px, causing the feed
column to appear shifted left. Now both sidebars are 300px with
max-w-[1200px] container for symmetric centering.
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
- Widen left sidebar from 280px to 300px to match Ditto
- Add max-w-[1240px] and mx-auto to center the three-column layout
- Adjust compose box textarea top padding (py-2 → pt-3 pb-2) for better vertical alignment of placeholder text with avatar
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
- Add Zap button to profile header (visible for other users with lightning address)
- Add posting streak counter with flame icon (36h window, caps at 99+)
- Create ProfileRightSidebar with Media grid and Profile Fields sections
- Handle $BTC profile field with copiable address, QR code modal, and mempool.space link
- Regular profile fields render as labels with linked URLs
- MainLayout now accepts optional custom right sidebar prop
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
The mobile layout now activates the moment the left sidebar would need
to shrink — at 688px (72px sidebar + 600px feed + padding). Added a
custom `sidebar` Tailwind screen breakpoint and replaced all `md:`
references that control the sidebar/mobile toggle with `sidebar:`.
This ensures the bottom nav, top bar, drawer, FAB, and full-width feed
kick in precisely when the sidebar can no longer fit alongside the feed.
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
Mobile UI (< md breakpoint):
- MobileTopBar: user avatar (opens drawer) + centered Mew logo
- MobileDrawer: left slide-out sheet with user profile, follower stats,
menu items (Profile, Wallet, Bookmarks, Mutes, Preferences, Domain blocks,
Logout), and expandable Switch accounts section
- MobileBottomNav: fixed bottom bar with Home, Notifications, Search, Vines
- FloatingComposeButton: purple FAB in bottom-right corner opens compose dialog
- Feed goes full-width on mobile, max-w-[600px] only on md+
- Left sidebar hidden on mobile, right sidebar hidden below lg
- Pages with their own headers use hideMobileTopBar to avoid double headers
- Safe area bottom padding for iOS devices
- Added routes for /bookmarks, /mutes, /domain-blocks placeholders
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
shakespeare.diy