Mobile Responsive Improvements
This release brings comprehensive mobile responsive fixes across the application, ensuring a polished experience on all screen sizes.
Gear Detail Page
- Header Layout: Gear name and action buttons now stack vertically on mobile for better readability
- Filter Controls: Category filter and sort dropdown stack on mobile, display side-by-side on larger screens
- Component Rows: Component cards adapt their layout on mobile with stacked stats and improved spacing
- Action Buttons: Added visual separator between edit and delete buttons on mobile
Home Dashboard
- Active Bikes Card: Fixed "Most Used" badge overlapping manufacturer text by stacking elements on mobile
- Stats Row: Components, Devices, and Reminders now wrap properly with consistent spacing
- Weekly Summary: Reduced stat text size and icon dimensions on mobile to prevent cramped layouts
- Recent Activities: Changed activity stats from 4-column to 2x2 grid on mobile for better readability
Sheet Components
- Create Component Sheet: Full-width on mobile, fixed 500px on desktop; footer buttons stack vertically
- Create Gear Sheet: Same responsive width treatment with stacked footer buttons
- Edit Component Sheet: Consistent mobile-first responsive behavior
All changes maintain the existing desktop experience while significantly improving mobile usability.