Make Caravan/Coordinator Components Mobile Friendly and Responsive

Overview

This issue will track the work needed to make the Caravan Coordinator UI components mobile-friendly and responsive. This includes ensuring proper layout, readability, and interactivity across different screen sizes — especially phones and tablets.

---

Motivation

• Improve accessibility and usability on mobile devices
• Ensure better UX for users using Caravan on-the-go
• Support onboarding of new users from non-desktop platforms ( as per the long term vision )
• Align UI with modern responsive design principles

---

Scope

We will audit and progressively refactor components under the src/components/ directory and related layout files to support responsiveness. This may include applying flex/grid layouts, media queries, scalable typography, and collapsible menus.

---

Components Likely to be Affected (Initial Targets)

• Navbar.jsx
• Footer.tsx
• WalletInfoCard.jsx
• RegisterWallet/*
• Coldcard/*
• CreateAddress/*
• ClientPicker/*
• NetworkPicker.jsx
• QuorumPicker.jsx
• Help.tsx
• Disclaimer.tsx

---

Subtasks

• Audit all src/components views on mobile sizes
• Add responsive layout to WalletInfoCard (wrap address lines, etc.)
• Adjust tables in RegisterWallet for horizontal scroll or stacking
• Ensure Coldcard flow pages do not overflow on narrow screens
• Add responsive utilities using styled-components/tailwind/custom breakpoints
• Test across major mobile browsers

---

cc: @bucko13 @jbrauck-unchained