adhit-r / adhit-r/holocron

Mobile parity audit — every state touch-reachable

Aperta
#18 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub
area: a11y area: ux good first issue
Lingua principale
TypeScript
Stelle
0
Fork
1
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Descrizione

> **Skills:** TypeScript · mobile testing · DevTools debugging · responsive CSS
> **Time:** ~8 hours
> **Good for:** QA-minded engineers · mobile-first devs · iPad / phone Star Wars readers
> **Difficulty:** Beginner-friendly to Intermediate

---

## Context

The desktop layout has been the development focus. The mobile layout exists
(`md:hidden` branch in `AppShell`, `DatapadDrawer` for the bottom sheet) but
hasn't been systematically validated.

## Goal

Test every interactive state at 375px width. Document failures. Fix.

## Where to start

States to verify:
- Galaxy view: orbit + zoom on touch, planet click, Atlas toggle, plot-route mode
- Timeline view: scrubber drag on touch, era marker visibility, faction
territory legibility
- Lineage view: 3D force-graph touch handling
- Datapad drawer: peek/expand, scroll inside, Crawl button, pivot buttons
- Search palette: keyboard alternatives via mobile UI
- Holo-stage: full-bleed on mobile (no clipped overlays)
- Opening crawl: skip controls reachable

Test at 375px (iPhone SE), 414px (iPhone Pro Max), 768px (iPad portrait).

## Acceptance criteria

- A list of issues found, with severity (P0 = blocking, P1 = degraded, P2 = nit)
- All P0s fixed
- A "mobile checklist" doc added under `docs/`
- No new horizontal scrollbars on the chrome (canvas can pan)

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Start in the AppShell `md:hidden` branch and `DatapadDrawer`, then exercise every listed state at 375px, 414px, and 768px using touch and DevTools. Record P0/P1/P2 failures, fix all P0 issues, add the mobile checklist under `docs/`, and verify that chrome has no new horizontal scrollbar while canvas panning remains allowed.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
nextjs, react, tailwindcss, threejs, typescript
Ambito
accessibility, frontend, mobile, testing
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
1-2 giorni
Stato di attività
Tranquilla
Chiarezza
Abbastanza chiara
Idoneità per principianti
52/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.