Development #60228
refaire l'option form-titlebar-mode en duplicant le contenu du titre
0%
Description
De #60164#note-4 :
J'aime pas cette idée, j'ai fais ça sur Caen, et j'en suis pas vaiment content.
Je pense que la solution de garder 2 titres dans le code : 1 au niveau de la page et 1 au niveau du formulaire serait préférable.
L'un des 2 est en display none en desktop en fonction de l'option d'affichage choisi.
Fichiers
Révisions associées
Historique
Mis à jour par Frédéric Péters il y a plus de 2 ans
- Fichier 0001-misc-use-duplicated-element-to-provide-alternate-for.patch 0001-misc-use-duplicated-element-to-provide-alternate-for.patch ajouté
- Statut changé de Nouveau à Solution proposée
- Patch proposed changé de Non à Oui
La propriété display doublée d'une propriété visibility après avoir lu que dans certaines circonstances des lecteurs d'écran peuvent lire ce qui est en display: none et qu'ajouter visibility: hidden assure que non.
Activer l'option remet le rendu exactement comme il était avant, i.e. je ne passe pas en même temps une modification pour passer le h2 en h1, ou par avoir un comportement différent en mobile, si on veut des trucs comme ça ce sera à suivre.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
- Fichier 0001-scss-use-css-grid-to-provide-alternate-form-title-mo.patch 0001-scss-use-css-grid-to-provide-alternate-form-title-mo.patch ajouté
i.e. je ne passe pas en même temps une modification pour passer le h2 en h1, ou par avoir un comportement différent en mobile, si on veut des trucs comme ça ce sera à suivre.
Du coup ce n'est pas le même composant. Je ne vois pas trop l'intérêt
- d'appliquer alors les styles sur 2 selecteurs différents. Pour moi, c'est le même composant, donc la même class, il est juste dans un endroit différent. Si une différence de design doit être apporter en fonction de son emplacement, alors la cascade fait le job.
- de se retrouver avec un ordre de titre à nouveau bancal en mobile si on choisi cette option.
C'est une option de retour en arrière plutôt qu'une option de layout en desktop.
Je me permet de proposer autre chose : css grid permet de déplacer le titre à côté de la sidebar en desktop sans avoir à cloner le titre (oui, sorry, je change d'avis). Pas supporté par ie11, mais ne cassera pas non plus l'utilisabilité et la compatibilité de Publik sur ce vieux browser. Juste que le titre restera au dessus pour les browsers qui ne support pas grid (gracefull degradation).
Et on s'empêche pas d'utiliser un truc plus adapté pour 95% des utilisateurs.
Mis à jour par Frédéric Péters il y a plus de 2 ans
Du coup ce n'est pas le même composant. Je ne vois pas trop l'intérêt
Je n'ai pas de définition de "composant" whatever. La motivation à ce patch était de suivre ton commentaire, et la motivation à form-titlebar-mode était de ne pas avoir à taper dans _custom.scss quoique ce soit. Aussi ça permettait une réaction rapide pour les personnes qui n'ont pas fait attention à leur recette et qui soudainement verront en production que leur titre a changé.
Le patch maintenant ici proposé avec sa suppression de sélecteurs je ne mesure vraiment pas les impacts, j'imagine ça aller à l'envers de la possibilité "vite fait remettre sans risque la situation précédente", non seulement ça n'offrirait pas ça mais ça ouvre même la possibilité de casser des choses supplémentaires.
Les changements aux titres ont été passés en acceptant que ça soit moi qui gère les conséquences (#59725 ou #59995); partir sur ce patch c'est clairement toi qui reprend toute la responsabilité du suivi, on est d'accord ?
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
ça permettait une réaction rapide pour les personnes qui n'ont pas fait attention à leur recette et qui soudainement verront en production que leur titre a changé
Ok, c'est donc bien une option de reverse plus que de proposition d'option de layout basé sur le nouveau code et la nouvelle hiérarchie.
Je propose qu'on scinde les 2 (je ne pense pas que ce soit une bonne idée de mixer les 2).
Une variable `$title-legacy-position` ou nommé autrement, non documenté, qui permet de revenir en arrière rapidement si besoin. Variable provisoire pour restorer en urgence, destinée à disparaitre, ne pas utiliser sur les nouveaux thèmes.
et `form-titlebar-mode` ou `form-titlebar-position` avec mon idée de patch pour proposer une solution plus pérène (et sans taper dans _custom quoi que ce soit) aux thèmes qui souhaitent placer le titre à côté de la sidebar en respectant la nouvelle hiérarchie (comme Caen).
ça ouvre même la possibilité de casser des choses supplémentaires
Normalement non, puisque c'est scopé dans une variable utilisé nul part pour le moment.
Mis à jour par Frédéric Péters il y a plus de 2 ans
ça ouvre même la possibilité de casser des choses supplémentaires
Tous les changements de sélecteurs au-dessus.
Mis à jour par Frédéric Péters il y a plus de 2 ans
Une variable `$title-legacy-position` ou nommé autrement (...)
Ma proposition c'est mon patch et premier cycle on va pouvoir facilement repérer (vu qu'on nous les pointera) les endroits à basculer, et ensuite, à notre aise, on pourra modifier le position: form pour utiliser des nouvelles CSS, et ça se fera avec une vue précise des intégrations concernées.
Ça évite la possibilité de laisser du code legacy persister.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
Right, et comment je fais pour les nouveaux thèmes, quand il faut positionner le titre dans la nouvelle hiérarchie en mobile et au dessus du form en desktop ?
Mis à jour par Frédéric Péters il y a plus de 2 ans
Right, et comment je fais pour les nouveaux thèmes, quand il faut positionner le titre dans la nouvelle hiérarchie en mobile et au dessus du form en desktop ?
On le développerait à ce moment, je ne vois pas ce que l'utilisation de $form-titlebar-mode: form bloquerait comme évolutions ?
Mis à jour par Frédéric Péters il y a plus de 2 ans
Parce que je pensais depuis le début que c'était ça l'objectif du patch : partir de l'exemple de caen et proposer une option de layout basé sur la nouvelle hiérarchie (pour Caen et future). mal compris ?
Constater que pour Caen avant même le déploiement de la nouvelle hiérarchie il y avait du code _custom.scss pour la contourner + bien imaginer qu'il allait y avoir du monde à se réveiller un vendredi et nous signaler "oh ça a changé retour comme avant possible ?".
De là une option pour rapidement fournir un alignement du titre similaire à l'ancien.
Puis ton commentaire pour dire "je n'aurais pas fait cette option ainsi, plutôt dupliquer" et adapter pour suivre ça, en en profitant du coup pour que l'option retourne encore davantage encore à l'ancien rendu. (suite à un commentaire "c'est plus à la même hauteur").
Mais j'aimerai ne pas encore documenter la variable alors, si c'est pour se retouver avec des styles posés sur `.form-content--body--title` ou sur `div#rub_service h2` seul, qu'il faudra dénicher/patcher. Autant éviter d'ajouter du bordel de ce côté aussi.
L'option est déjà documentée et qu'elle soit utilisée fournira une indication claire des intégrations à considérer. Je pense à imio où il sera facile de dire "si vous voulez le titre au-dessus du formulaire uniquement utilisez form-titlebar-mode: form".
Et si la classe form-content--body--title est utilisée, ça se verra d'un grep rapide. (surtout on n'imagine pas soudainement 10 nouvelles intégrations semaine prochaine qui l'utiliserait).
Et div#rub_service > h2 c'est le balisage actuel déjà utilisé, il n'y a rien de neuf ici.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
- Statut changé de Solution proposée à Solution validée
J'ai déjà fait tapis, j'ai plus de coin.
Si les prochaines semaines me permettent de prendre du temps pour faire évoluer cette première version (et tu peux pas t'imaginer à quel point j'aimerais !) je prendrai le relais.
Mis à jour par Frédéric Péters il y a plus de 2 ans
- Statut changé de Solution validée à Résolu (à déployer)
commit 242de2ecdc58980215f2bc3ca206c830124ef07d
Author: Frédéric Péters <fpeters@entrouvert.com>
Date: Mon Jan 3 21:26:04 2022 +0100
misc: use duplicated element to provide alternate form title mode (#60228)
et je fais le tour des intégrations que tu pointais.
Mis à jour par Frédéric Péters il y a plus de 2 ans
- Statut changé de Résolu (à déployer) à Solution déployée
misc: use duplicated element to provide alternate form title mode (#60228)