Merge User Stories page into Specs page

- SpecsPage: Add screen filter, scroll-to-story, selection highlight
- FeatureFilter: Add screen filter chips for both mobile and desktop
- Router: Redirect /stories/* routes to /specs/* for backward compatibility
- App: Remove UserStoriesPage routing, simplify navigation
- Gallery: Remove User Stories button, keep only Specs BDD
- Button: Add cursor-pointer to base styles

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Sylvain Duchesne
2026-01-18 20:02:39 +01:00
parent 4ae96b0e94
commit fd5fab5bd2
6 changed files with 162 additions and 63 deletions
+7 -27
View File
@@ -15,15 +15,14 @@ function useIsMobile(breakpoint = 768) {
interface GalleryProps {
onSelectScreen: (screenId: string) => void;
onShowStories: () => void;
onShowSpecs?: () => void;
onShowSpecs: () => void;
}
const MIN_SCALE = 0.32;
const MAX_SCALE = 0.75;
const DEFAULT_SCALE = 0.5;
export function Gallery({ onSelectScreen, onShowStories, onShowSpecs }: GalleryProps) {
export function Gallery({ onSelectScreen, onShowSpecs }: GalleryProps) {
const [scale, setScale] = useState(DEFAULT_SCALE);
const isMobile = useIsMobile();
@@ -67,42 +66,23 @@ export function Gallery({ onSelectScreen, onShowStories, onShowSpecs }: GalleryP
gap: isMobile ? 8 : 24,
flexWrap: 'wrap',
}}>
{/* User Stories button */}
{/* Specs BDD button */}
<button
onClick={onShowStories}
onClick={onShowSpecs}
style={{
background: 'none',
background: 'var(--tool-text)',
color: 'var(--tool-bg)',
border: '2px solid var(--tool-border)',
borderRadius: '255px 15px 225px 15px/15px 225px 15px 255px',
padding: isMobile ? '6px 12px' : '8px 16px',
fontFamily: 'var(--font-sketch)',
fontSize: isMobile ? 12 : 14,
cursor: 'pointer',
color: 'var(--tool-text)',
}}
>
User Stories
Specs BDD
</button>
{/* Specs BDD button */}
{onShowSpecs && (
<button
onClick={onShowSpecs}
style={{
background: 'var(--tool-text)',
color: 'var(--tool-bg)',
border: '2px solid var(--tool-border)',
borderRadius: '255px 15px 225px 15px/15px 225px 15px 255px',
padding: isMobile ? '6px 12px' : '8px 16px',
fontFamily: 'var(--font-sketch)',
fontSize: isMobile ? 12 : 14,
cursor: 'pointer',
}}
>
Specs BDD
</button>
)}
{/* Zoom control - hide on mobile */}
{!isMobile && (
<div style={{