Estrella Pan 3ff0a64e89 feat(webui): mobile-first responsive redesign with 3-tier breakpoints ...

Implement a comprehensive mobile-first UI redesign with touch-friendly
navigation, responsive data display, and proper device adaptation.

Key changes:
- Add 3-tier breakpoint system: mobile (<640px), tablet (640-1023px), desktop (1024px+)
- Create core mobile components: bottom-sheet, pull-refresh, swipe-container, data-list, adaptive-modal
- Redesign navigation: bottom nav with labels on mobile, mini sidebar on tablet
- Mobile-first layout with dvh units, safe area insets, and column-reverse flex
- Forms stack labels vertically on mobile, inputs go full-width
- Popups render as bottom sheets on mobile devices
- Bangumi grid uses CSS Grid with responsive minmax columns
- RSS page uses card-based data-list on mobile instead of NDataTable
- Config actions get safe area padding and full-width buttons on mobile/tablet
- Touch targets enforced at 44px minimum throughout
- Add sheet/overlay/swipe CSS transitions
- Topbar search visible on tablet (previously desktop-only)

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

2026-01-24 07:37:50 +01:00

1.2 KiB

Raw Blame History

View Raw