# Étape 5 — Navigation et layout adaptatif

> **Prérequis :** [étape 4 — profil](etape-04-vue-profil.md) validée sur téléphone (OAuth `public` + `projects`).

## Objectif sujet

| Critère | Cette étape |
|---------|-------------|
| Retour vue 1 | `Navigator.push` / `pop` — flèche AppBar sur la vue 2 |
| Layout flexible | Scroll, marges, largeur max, 2 colonnes profil si écran large |
| Lisibilité | Rotation, clavier ouvert, petits écrans sans overflow |

---

## Navigation

```text
SearchScreen  --push-->  ProfileScreen
ProfileScreen --pop-->   SearchScreen (session OAuth conservée)
```

- Pas de `go_router` obligatoire : **Navigator 1.0** suffit.
- La vue 1 garde le token ; une nouvelle recherche ne refait pas OAuth.

---

## Fichiers ajoutés / modifiés

```
lib/
├── theme/
│   └── swifty_ui.dart          # couleur 42, padding, AppBar, scroll responsive
├── screens/
│   ├── search_screen.dart      # formulaire scrollable, centré
│   └── profile_screen.dart     # lignes détail adaptatives, UI partagée
└── main.dart                   # thème Material 3 (seed 42)
```

### `swifty_ui.dart`

| Widget / helper | Rôle |
|-----------------|------|
| `SwiftyUi.appBar` | AppBar turquoise identique sur les 2 vues |
| `ResponsiveScrollBody` | `SingleChildScrollView` + padding + `maxWidth` |
| `ErrorMessage` | Texte d’erreur sélectionnable, centré |
| `LoadingFilledButton` | Bouton avec spinner (connexion / recherche) |

### Vue recherche

- Contenu dans `ResponsiveScrollBody` (`maxWidth` ~480 px).
- Évite l’overflow quand le **clavier** est ouvert.

### Vue profil

- Breakpoint **720 px** : 1 colonne (téléphone) / 2 colonnes (tablette, paysage).
- `_DetailRow` : label + valeur en **colonne** si la ligne est trop étroite (< 400 px).

---

## Critères « étape 5 terminée »

| # | Test |
|---|------|
| 1 | Profil → retour → recherche sans déconnexion |
| 2 | Rotation paysage : pas de bande jaune / overflow |
| 3 | Clavier ouvert sur la recherche : boutons accessibles (scroll) |
| 4 | Tablette ou fenêtre large : profil en 2 colonnes lisible |
| 5 | Erreurs toujours visibles (couleur + message lisible) |

---

## Ensuite — étape 6

→ [etape-06-checklist-soutenance.md](etape-06-checklist-soutenance.md) : `flutter test`, démo peer-eval, préparation dépôt école.