ADR 0061 – Densité réglable, barre d’actions en bas et gestes sur mobile

Statut : Accepté (2026-10-16, mode autonome ; ligne 29 du backlog, prise sur la recommandation du fil coordinateur)

La ligne 29 du backlog (jalon 3, vague 2) demande trois choses : une densité réglable, une barre d’actions en bas de l’écran sur mobile, et des gestes tactiles. La mise en page « Atlas dense » (ADR 0024) est pensée pour la souris, avec des lignes de 24 px. Sur téléphone (PWA, ADR 0034), elle devient des tiroirs sous 900 px, mais les cibles restent petites et les actions sont en haut, loin du pouce.

Décision

Densité : trois niveaux, et « Automatique »

Paramètres (roue de l’en-tête) › Densité propose quatre choix :

Choix	Lignes (arbre, listes)	Texte de l’interface	Lignes de grille	Cibles tactiles
Compacte	24 px	13 px	28 px	30 px
Confortable	30 px	14 px	34 px	36 px
Tactile	40 px	15 px	44 px	44 px
Automatique (défaut)	Compacte avec une souris ; Tactile avec un écran tactile seul (pointer: coarse)

• Mécanisme. Le choix est posé en data-density sur l’élément racine, comme le thème et la palette (ADR 0031). La charte (charte-c3.css) en dérive les variables --sb-row, --sb-text-ui, --sb-grid-row et --sb-touch, que l’arbre, les listes (au moins 28 px), l’inbox, la barre de lot, les grilles AG Grid et les boutons d’icône lisent. En Tactile, les petits boutons de l’en-tête (Précédent, Suivant) prennent aussi la taille du doigt. Le script de démarrage de index.html pose déjà data-density, comme le thème : pas de saut de mise en page à l’ouverture.
• Mémorisation. Le choix est retenu dans le navigateur, comme les autres préférences d’affichage. Ce n’est pas une donnée.

Barre d’actions en bas, sur mobile

Sous 900 px :

• Sur la fiche d’un nœud. Les actions de la ligne de titre (Enregistrer, Déplacer, Remettre dans l’inbox, Corbeille) passent dans une barre fixe en bas de l’écran. Elle est à portée du pouce, avec une icône et un libellé court, et respecte la zone sûre de l’écran (env(safe-area-inset-bottom)). Le contenu garde une marge pour ne pas passer dessous. Les barres restent sous le fond et les tiroirs de la coquille : un tiroir ouvert les recouvre. Dans l’ordre du clavier, la barre reste dans la ligne de titre (une fenêtre étroite au clavier est rare).
• Sur une sélection en lot (ADR 0041). La barre d’actions en lot se fixe aussi en bas de l’écran, au lieu de rester en haut de la liste ; la liste garde une marge pour défiler au-dessus.
• Ailleurs. Rien ne change, et au-delà de 900 px les actions restent où elles sont.

Gestes

Une directive appSwipe reconnaît un glissement horizontal net : au moins 60 px, et plus horizontal que vertical, pour ne pas gêner le défilement. Elle émet swipeLeft et swipeRight. Elle ne réagit qu’au toucher et au stylet, pas à la souris, pour ne pas voler la sélection de texte. Un glissement qui a sélectionné du texte, un second doigt (pincement), ou le dépôt d’une carte de kanban ne comptent pas. Le pincement pour zoomer reste permis (touch-action: pan-y pinch-zoom).

Où	Geste	Effet
Bande de 40 px au bord gauche (mobile)	glisser vers la droite	ouvre le tiroir de navigation
Bande de 40 px au bord droit (mobile)	glisser vers la gauche	ouvre le panneau de contexte
Tiroir ouvert	glisser vers son bord	le ferme
Ligne d’une vue en liste	glisser vers la droite	applique sa première action rapide (ADR 0041), avec « Annuler »
Ligne d’une vue en liste	glisser vers la gauche	coche ou décoche la ligne pour une action en lot

Chaque geste a son équivalent visible (bouton de menu, cases, boutons d’actions rapides) : le geste accélère, il n’est jamais le seul chemin.

Un même glissement ne déclenche qu’un geste : une ligne de liste passe avant les bords de la zone centrale. Le tout premier bord de l’écran est souvent pris par le geste Retour du système (Android, Safari) ; partir un peu à l’intérieur de la bande évite le conflit.

Reporté

• Glisser pour réordonner, et appui long pour un menu contextuel.
• Densité par page (une grille compacte dans une interface confortable).
• Gestes sur les cartes du kanban (le glisser-déposer y a déjà la priorité).

Conséquences

• Les lignes et boutons touchés par les gestes lisent --sb-row ou --sb-touch (et --sb-grid-row pour AG Grid). Quelques petits éléments restent figés (le chevron de l’arbre) : à reprendre si la densité Tactile les rend gênants.
• Sur téléphone, l’interface s’ouvre directement en densité Tactile, sans réglage.