be6b974150
Phase 2 of the mobile redesign: the catalog at `/` adapts to phone viewports without disrupting the desktop layout. The same filter form renders inline on desktop and inside a bottom sheet on mobile, and a dedicated sort sheet replaces the inline `<select>` below 640px. - MangaCard gains optional `unreadCount` and `progress` props that render a top-right pill badge and a bottom progress overlay on the cover. Both are no-ops when omitted, so existing callers don't change. Counts past 99 cap at "99+". - The filter form body is extracted into a Svelte 5 snippet and rendered conditionally — inline desktop panel OR mobile sheet, never both — so no testid is duplicated and the focus trap can't double- fire. A matchMedia listener tracks the 640px breakpoint and drives the snippet target. - Mobile catalog adds: Filter / Sort chip buttons, an always-visible active-filter chip row with per-facet remove buttons, full-width search, and a 2-column grid. - Auto-expanding the filter panel from URL params is now desktop-only — on mobile the active-filter chips signal applied facets without hiding the catalog under a scrim on first paint. - Vitest suite covers MangaCard badge / overlay behavior including clamp / hide edge cases. Playwright spec covers the mobile filter + sort sheet flow at 390px viewport, with a hydration gate to keep click dispatch from racing the SSR'd-but-not-yet-reactive button. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
33 lines
862 B
JSON
33 lines
862 B
JSON
{
|
|
"name": "mangalord-frontend",
|
|
"version": "0.57.0",
|
|
"private": true,
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite dev",
|
|
"build": "vite build",
|
|
"preview": "vite preview",
|
|
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
"test": "vitest run",
|
|
"test:watch": "vitest",
|
|
"test:e2e": "playwright test"
|
|
},
|
|
"devDependencies": {
|
|
"@lucide/svelte": "^1.16.0",
|
|
"@playwright/test": "^1.48.0",
|
|
"@sveltejs/adapter-node": "^5.2.0",
|
|
"@sveltejs/kit": "^2.7.0",
|
|
"@sveltejs/vite-plugin-svelte": "^4.0.0",
|
|
"@testing-library/jest-dom": "^6.6.0",
|
|
"@testing-library/svelte": "^5.2.0",
|
|
"@types/node": "^22.7.0",
|
|
"jsdom": "^25.0.0",
|
|
"svelte": "^5.0.0",
|
|
"svelte-check": "^4.0.0",
|
|
"tslib": "^2.7.0",
|
|
"typescript": "^5.6.0",
|
|
"vite": "^5.4.0",
|
|
"vitest": "^2.1.0"
|
|
}
|
|
}
|