feat(5.9): US-006 - fundatie responsive (viewport, nav, modal full-screen mobil)
- base.html: conventie breakpoint unic 767px documentata + bloc @media mobil extins - modal full-screen pe mobil (100vw/100vh, fara backdrop lateral, x >=44px, scroll intern) - header/nav colapsat sub 768px + tinte touch >=44px (.icon-btn/.tab-link/.cont-menu) - tests/test_web_responsive.py NOU (3 teste) + prd.json/progress.txt US-006 passes Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -68,3 +68,31 @@ Note: PRD APROBAT 2026-06-24 cu revizii obligatorii R1-R12 (raport AUTOPLAN). R1
|
||||
- US-004 (detaliu editabil in-place + butoane in modal), US-005 (poll nu inchide modalul), US-006/007/008 (responsive).
|
||||
- VERIFY: ruleaza gstack E2E pe `/` pentru AC requiresBrowserCheck (eticheta sub pill, fara chevron, cod fara prefix, click deschide modal).
|
||||
---
|
||||
|
||||
## US-006: Fundatie responsive — viewport, header/nav, modal full-screen mobil, breakpoint-uri
|
||||
|
||||
### Ce s-a livrat:
|
||||
- app/web/templates/base.html: CONVENTIE breakpoint unic 768px documentata (CSS custom props nu
|
||||
merg in @media -> folosim consecvent `@media (max-width:767px)` pentru mobil; >=1024px = desktop
|
||||
neschimbat). Blocul `@media (max-width:767px)` extins cu:
|
||||
- Modal full-screen pe mobil: overlay fara padding + align/justify:stretch (fara backdrop lateral);
|
||||
dialog 100vw/100vh, fara border-radius/umbra, padding-top:56px, scroll intern; modal-close 44x44px.
|
||||
- Header colapsat: flex-wrap + gap + padding redus; h1 mai mic; main padding 16px.
|
||||
- Tinte touch >=44px: .icon-btn (toggle tema/cont hamburger), .tab-link, itemii .cont-menu.
|
||||
- Comentariul CSS desktop al modalului actualizat (full-screen mobil livrat, nu „vine in US-006").
|
||||
- tests/test_web_responsive.py NOU: test_viewport_meta_prezent, test_modal_fullscreen_clasa_mobil,
|
||||
test_nav_colapsabil_sub_breakpoint (markup/CSS in HTML randat prin TestClient).
|
||||
|
||||
### Learnings:
|
||||
- meta viewport era DEJA prezent (base.html:5) -> AC „confirmat/adaugat" = confirmat, neatins.
|
||||
- Nav colapsabil (hamburger cont #cont-menu-toggle ☰ + dropdown hidden; tab-bar cu overflow-x:auto)
|
||||
era deja livrat de PRD-uri anterioare (5.5 US-006, 5.3 tab-bar). US-006 5.9 a adaugat DOAR
|
||||
tratamentul touch 44px sub breakpoint + modalul full-screen (modalul e nou din US-003 5.9).
|
||||
- Desktop nefatat: regula de baza `.modal-dialog { max-width:680px }` ramane; doar media mobil o
|
||||
suprascrie. Test asigura ambele (max-width:680px prezent + media 767px cu 100vw/100vh/44px).
|
||||
|
||||
### Next:
|
||||
- US-007 (responsive pagini continut), US-008 (responsive Acasa + login/signup) — depind de US-006 (gata).
|
||||
- VERIFY: gstack browser la 375px pe `/` — fara scroll orizontal de pagina; ☰ deschide meniul cont;
|
||||
modal deschis ocupa tot ecranul si se inchide din `x` (requiresBrowserCheck + requiresDesignReview).
|
||||
---
|
||||
|
||||
Reference in New Issue
Block a user