From 2b81a2a2d85a93861146d9e04f4863f7689a5513 Mon Sep 17 00:00:00 2001 From: IliesAllali Date: Tue, 27 Oct 2026 17:44:50 +0100 Subject: [PATCH] =?UTF-8?q?Zones=20de=20tap=20d'au=20moins=2044=20px=20sur?= =?UTF-8?q?=20=C3=A9cran=20tactile,=20sans=20changement=20visible?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Croix de la recherche (36 px) et de la fiche (40 px), onglets de la fiche (34 px de haut), petits boutons, « + » en pastilles, ajout et retrait d'un lien : une zone invisible déborde autour de chacun sur écran tactile (pointer: coarse) jusqu'à 44 × 44 px. Rien ne bouge à l'œil, et rien ne change à la souris. Co-Authored-By: Claude Opus 5.5 --- frontend/src/styles/pz.css | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/frontend/src/styles/pz.css b/frontend/src/styles/pz.css index 8820844..ea9ce45 100644 --- a/frontend/src/styles/pz.css +++ b/frontend/src/styles/pz.css @@ -265,3 +265,15 @@ button:disabled:has(.pz-busy.is-busy) { opacity: 1; cursor: progress; } /* Dans la barre d'actions, séparé des boutons par un filet */ /* Sous les écrans d'accès et de connexion */ .pz-lang--screen { justify-self: center; } + +/* Zones de tap : sur écran tactile, chaque petit bouton se touche sur au moins 44 × 44 px (recommandation + d'Apple) sans grossir à l'œil : une zone invisible déborde autour de lui. :where() garde la position que le + bouton a déjà (une croix posée en absolu le reste) ; un bouton de 44 px ou plus ne déborde pas. */ +@media (pointer: coarse) { + :where(.pz-btn--icon, .pz-btn--sm, .pz-tab, .search-close-button, .pc-rel-remove, .pc-rel-add, .pc-fill-chip) { position: relative; } + :is(.pz-btn--icon, .pz-btn--sm, .pz-tab, .search-close-button, .pc-rel-remove, .pc-rel-add, .pc-fill-chip)::after { + content: ''; + position: absolute; + inset: min(0px, calc((100% - 44px) / 2)) min(0px, calc((100% - 44px) / 2)); + } +}