Development #58200
sélecteurs "placeholder" pour les cellules et leur partie "liste de liens"
0%
Description
Aujourd'hui on aligne des sélecteurs :
div.a2-continue,
div#services > ul > li,
div.a2-block,
.gru-content .cell,
.block {
text-align: left;
[...]
div#rub_service div.category ul,
div#services > ul > li > ul,
div#account-management ul,
div.links-list ul,
div.menucell ul,
div.wcsformcell,
div.categoriescell ul,
div.wcscurrentdraftscell ul,
div.wcscurrentformscell ul {
[...]
Par facilité d'extension, et permettre à terme une réduction de ces sélecteurs spécifiques, on pourrait avoir %cell et %cell-links-list. On n'a pas discuté de nomenclature pour ces éléments, ça peut être discuté, exemple adopter les doubles tirets comme pour des classes, CSS, façon %cell--links-list ?
Fichiers
Révisions associées
Historique
Mis à jour par Frédéric Péters il y a plus de 2 ans
- Fichier 0001-scss-introduce-use-new-cell-and-cell-links-list-sele.patch 0001-scss-introduce-use-new-cell-and-cell-links-list-sele.patch ajouté
- Statut changé de Nouveau à Solution proposée
- Patch proposed changé de Non à Oui
Occasion d'unifier également, div.links-list ul n'était pas repris, et dans certains intégrations était précisé façon .cell:not(.pk-button) div.links-list ul.
Côté code ça fait un bilan bien positif, 15 files changed, 41 insertions(+), 157 deletions(-), mais côté fichier css généré ça augmente un peu les tailles (mais sur des trucs qui se répètent beaucoup la compression doit être très bonne et ça doit devenir insignifiant).
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
- Assigné à changé de Frédéric Péters à Benjamin Dauvergne
Pour. J'ai proposé un truc similaire qui a été rejeté https://dev.entrouvert.org/issues/49878
Mais je suis vraiment plus pour l'utilisation de class css plutôt qu'un truc sass proprio.
Je vais relire
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
- Assigné à changé de Benjamin Dauvergne à Frédéric Péters
Mis à jour par Frédéric Péters il y a plus de 2 ans
qui a été rejeté
Au final parce que si on veut une liste de liens il y a une cellule pour, plutôt qu'appliquer le style "liste de liens" à la cellule "lien vers une démarche". #49878#note-7.
Mais je suis vraiment plus pour l'utilisation de class css plutôt qu'un truc sass proprio.
"proprio" je ne sais pas ce que tu mets derrière ce mot.
L'avantage à utiliser un sélecteur placeholder (%), un peu noté dans un précédent ticket, c'est qu'il n'y a pas de possibilité de détourner de l'infrastructure (%cell) en l'utilisant directement dans de l'html. Ça construit ainsi un espace "infrastructure", précis, clairement distinct de l'espace "un tas de classes, à utiliser ou pas".
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
en l'utilisant directement dans de l'html
Ben si, au final c'est mieux d'avoir la class `cell-link-list` dans le template des cellule sur les balises ul.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
C'était pour le principe (la class cell-link-list ne respect pas la convention de nommage) mais une class permet de simplifier la création de nouvelle cellule ou la lecture d'un template html. De la même façon que j'ai commencé à généraliser l'utilisation de la class `.links-list` qui est une bonne pratique.
Mis à jour par Frédéric Péters il y a plus de 2 ans
Ben si, au final c'est mieux d'avoir la class `cell-link-list` dans le template des cellule sur les balises ul.
C'était mon souhait il y a dix mois (réduire les sélecteurs) : « Bref je préférerais que ça commence par là, concrètement. »
Ça n'a pas tellement bougé.
Reste que le code est déjà présent et que ce ticket ne change pas ça : il est possible d'aller taper la classe "links-list" sur le <div> englobant.
Ça n'empêche pas non plus si on veut de taper un ul.cell-link-list { @extend %cell-link-list } si on veut pouvoir taper ça sur le <ul> plutôt que le <div> au-dessus.
~~
Mais je trouve pratique de pouvoir isoler ce qui relève de l'infrastructure, c'est l'objet principal ici.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 2 ans
Ça n'a pas tellement bougé.
Et donc il faut changer d'objectif ?
L'un n'empêche pas l'autre.
Ça n'empêche pas non plus si on veut de taper un ul.cell-link-list { @extend %cell-link-list }
Je trouve que ça fait doublon inutilement.
Mais je sens que ça ne sert à rien que j'insiste.
Mis à jour par Frédéric Péters il y a plus de 2 ans
L'un n'empêche pas l'autre.
Donc tout à fait ce ticket, qui permet de nettoyer et n'empêche pas un travail sur le balisage.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 2 ans
Enfin pris le temps de tester.
Seul réserve sur `.cell:not(.pk-button) div.links-list ul`
- Qui est un selecteur qui me parait complexe pour le core. Quand ça devient compliqué comme ça, c'est qu'il y a un problème ailleurs. Surement du côté du markup de link-cell, qui devrait surement être juste un a qui hérite links-list > a sans tout le reste.
- Qui me semble présent pour icitoyen uniquement, et pour autant ne suffit pas; icitoyen doit être patché car form-cell.pk-button a besoin d'hériter des style de links-list du core mais ne pas appliquer les styles du theme.
- qui va casser tous les form-cell.pk-button sur tous les thèmes puisque list-style: none; qui provient de .links-liost ne sera plus appliqué.
Je dirais de garder `div.links-list ul` et juste patcher icitoyen (je veux bien faire le patch)
Mis à jour par Frédéric Péters il y a environ 2 ans
Ok en pratique pk-button ne devrait de toute façon pas être appliqué à une cellule avec une liste, la documentation cadre correctement :
Les classes pk-button et pk-big-button peuvent également être appliquées aux cellules de type « Lien ».
— https://doc-publik.entrouvert.com/admin-fonctionnel/modifier-le-contenu-des-portails/classes-css/#classes-pour-des-elements-de-texte
Mis à jour par Frédéric Péters il y a environ 2 ans
(et donc ça rejoint le commentaire sur le balisage de linkcell, qui dans publik-base-theme se met dans une liste)
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 2 ans
et donc ça rejoint le commentaire sur le balisage de linkcell, qui dans publik-base-theme se met dans une liste
Ça me semble une autre problématique, un bug déjà existant, qui sera à traiter dans un autre fil (#62721)
Je suis pour passer ce patch qui facilite déjà bien la personnalisation des listes de liens, simplement en supprimant `.cell:not(.pk-button) div.links-list ul` et en ajoutant un patch pour Roanne.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a environ 2 ans
- Fichier 0001-scss-patch-icitoyen-.link-cell.pk-button.patch 0001-scss-patch-icitoyen-.link-cell.pk-button.patch ajouté
voici le patch à ajouter qui corrige .link-cell.pk-button pour roanne et supprime le selecteur :not(.pk-button)
Mis à jour par Frédéric Péters il y a environ 2 ans
- Statut changé de Solution proposée à Résolu (à déployer)
Voilà poussé en intégrant ce patch + une correction à celui-ci pour virer un espace parasite,
.git/rebase-apply/patch:36: space before tab in indent.
> a {
warning: 1 ligne a ajouté des erreurs d'espace.
commit c5124a69071b7ec7c8f6ee939fee098ac8734d4b
Author: Frédéric Péters <fpeters@entrouvert.com>
Date: Tue Oct 26 14:36:28 2021 +0200
scss: introduce/use new %cell and %cell-links-list selectors (#58200)
Mis à jour par Transition automatique il y a environ 2 ans
- Statut changé de Résolu (à déployer) à Solution déployée
scss: introduce/use new %cell and %cell-links-list selectors (#58200)