Bug #36765
Affichage des étapes d'une démarche
0%
Description
Ticket général pour différentes directions,
- côté code, le fonctionnement date d'un temps où les media queries n'étaient pas prises en charge partout, la conséquence a été que le rendu mobile doit poser quantités de propriétés pour défaire le rendu desktop; faire évoluer ça permettrait de combiner des options de rendu;
- côté rendu, ça peut varier assez d'intégration en intégration mais il n'y presque pas de paramétrage global, il y a juste $form-sidebar-position (left/right/top) et $responsive-steps (horizontal, ou none/whatever, horizontal est le seul rendu "mobile" existant);
- mon idée serait décomposer et standardiser les variations, pour obtenir par exemple :
- $form-steps-direction: horizontal / vertical;
- $form-steps-mode: blocks / discs / metro / whatever; // #14143 est un ticket qui demande des disques
- $form-steps-collapse: false / true; // l'idée ici c'est de ne plus afficher toutes les étapes mais à la place un compteur et le nom de l'étape courante (c'est quelque chose qui se trouve aujourd'hui à Toulouse/Lille, avec actuellement un balisage différent, voir ce qui pourrait être adapté).
- $form-steps-hide-when-single: false / true; // l'idée ici étant #26730.
- et pareille granularité pour le mobile, $mobile-form-steps-direction, etc.
- mon idée serait décomposer et standardiser les variations, pour obtenir par exemple :
Le gabarit par défaut est wcs/templates/wcs/formdata_steps.html (dans le dépôt w.c.s.), il y a moyen de l'adapter dans une version dans publik-base-theme, qui serait templates/wcs/front/formdata_steps.html ("front" pour toucher uniquement le rendu frontoffice).
Fichiers
Demandes liées
Révisions associées
scss: use '.site-header' class name to refer to site header (#36765)
Commit messages are not applicable!
(╯°□°）╯︵ ┻━┻
alfortville: update steps (#36765)
alpes-maritimes-2018: updates steps (#36765)
blois-2018: updates steps (#36765)
arles: updates steps (#36765)
amiens-metropole: update steps (#36765)
arpagon: update steps (#36765)
auch: update steps (#36765)
cnil: update steps (#36765)
chateauroux: update steps (#36765)
clapiers: update steps (#36765)
clermont-metropole: update steps (#36765)
clisson: update steps (#36765)
clisson-agglo: update steps (#36765)
gorges: update steps (#36765)
haute-goulaine: update steps (#36765)
cotes-d-armor: updates steps (#36765)
dauphine: update steps (#36765)
fontenay-sous-bois-2018: update steps (#36765)
grenoble-metropole-2019: update steps (#36765)
groupe-up: update steps (#36765)
haute-garonne-cd31: update steps (#36765)
lille: update steps (#36765)
metz-metropole-2019: update steps (#36765)
meyzieu-2018: update steps (#36765)
montlouis-sur-loire: update steps (#36765)
montpellier: update steps (#36765)
montreuil: update steps (#36765)
nancy-en-direct: update steps (#36765)
pre-saint-gervais: updates steps (#36765)
quimper: update steps (#36765)
roannais-agglomeration: update steps (#36765)
saint-chamond: update steps (#36765)
saone-et-loire-cd71-2019: update steps (#36765)
saone-et-loire-cd71: update steps (#36765)
seine-et-marne-apa: updates steps (#36765)
signal-publik: update steps (#36765)
strasbourg-2018: update steps (#36765)
signal-publik: update steps (#36765)
publik: update steps (#36765)
thonon-agglomeration: update steps (#36765)
omonville-la-rogue: update steps (#36765)
toodego: update steps (#36765)
toulouse: update steps (#36765)
toulouse-metropole: update steps (#36765)
tournai: update steps (#36765)
venissieux: update steps (#36765)
villeurbanne-2018: update steps (#36765)
grand-chambery: update steps (#36765)
castelnau-le-lez: update steps (#36765)
fondettes: update steps (#36765)
meaux: update steps (#36765)
nanterre: update steps (#36765)
castries: update steps (#36765)
saint-lo-agglo: update steps (#36765)
seine-et-marne-apa: update steps (#36765)
lille-metropole: update steps (#36765)
rouen: update steps (#36765)
avray: update steps (#36765)
coprec: update steps (#36765)
malakoff: update steps (#36765)
concarneau: update steps (#36765)
Historique
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Est-ce qu'on ne peut pas aussi commencer à isoler le code de ce module dans un fichier scss propre. L'idée étant:
1 module/template html = 1 fichier scss ?
_publik.scss _wcs.scss wcs/ |_ _steps.scss |_ _bulk.scss
et dans _wcs.scss
@import 'wcs/steps'; @import 'wcs/bulk'
Mis à jour par Frédéric Péters il y a plus de 4 ans
1 module/template html = 1 fichier scss ?
Pas bien sûr que cette règle puisse s'appliquer aussi simplement mais tout à fait ok pour découper les fichiers et créer des répertoires.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Branche wip/36765_new-form-steps
Première Proposition¶
modes RWD¶
- max very small: Affichage uniqumement de la step en current, avec marker composé du numéro de la step et du nombre total de steps + label
- min-width small: Affichage des markers côte à côte avec uniquement label de la step current
- min-width desktop & sidebar left or right: affichage vertical des steps avec marker et label pour chaque step. Disposition des labels à côté des markers, pour gagner de la place. Important dans le cas d'un nombre important de steps (jusqu'à 21 !)
Obsolète var :¶
$responsive-steps: L'affichage ds steps est conditionné à la position de la sidebar. If sidebar top: steps horizontal. If sidebar left or right : steps vertical.
New vars :¶
$wcs-steps_background: transparent !default; $wcs-steps_spacing: 0.35rem; // half of default 0.7rem used in publik $wcs-step_color: #868686 !default; $wcs-step_background: transparent !default; $wcs-step_marker-color: $wcs-step_color !default; $wcs-step_marker-background: $wcs-step_background !default; $wcs-step_marker-background-type: solid !default; // solid || gradient $wcs-step_current-marker-color: $title-color !default; $wcs-step_current-marker-background: $title-background !default; $wcs-step_current-label-color: $title-color !default;
Sémantique HTML & accessibilité¶
- utilisation
<header> - <abbr> pour le marker av attr
title&aria-label - attr
aria-hiddenpour les steps non current
CSS naming convention¶
Première tentative d'ajout d'une convention de nommage type BEM
Si ok, il reste à ajouter
- @$wcs-step_marker-type: square !default; ∕∕ square || circle
- les préfixes navigateurs
Avertissement
le nouveau markup HTML ainsi que les nouveau styles dégomment les thèmes qui ont customisé les steps. Chercher à conserver leur fonctionnement m'a paru vraiment compliqué. Une mise à jour de ces thèmes seront probablement nécessaires (37 thèmes). La cause est essentiellement dût au changement du markup HTML. Les surcouches custom incluant systématiquement des selecteurs CSS par tag.
Mis à jour par Serghei Mihai il y a plus de 4 ans
Thomas Jund a écrit :
Avertissement
le nouveau markup HTML ainsi que les nouveau styles dégomment les thèmes qui ont customisé les steps. Chercher à conserver leur fonctionnement m'a paru vraiment compliqué. Une mise à jour de ces thèmes seront probablement nécessaires (37 thèmes). La cause est essentiellement dût au changement du markup HTML. Les surcouches custom incluant systématiquement des selecteurs CSS par tag.
IMO, on devrait adapter ces 37 thèmes à ce nouveau markup. Il y en a qui sont relativement simples.
Mis à jour par Frédéric Péters il y a plus de 4 ans
IMO, on devrait adapter ces 37 thèmes à ce nouveau markup. Il y en a qui sont relativement simples.
C'est bien sûr prévu.
Mis à jour par Frédéric Péters il y a plus de 4 ans
Par contre on avait zappé les intégrations graphiques réalisées côté imio, un git grep #steps en affiche 27 autres... Ça me fait dire que les modifications au balisage (div→header, span→abbr) seraient peut-être à laisser de côté (je ne mesure pas le temps à passer dessus).
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
J'ai tiré le dépôt et regardé.
J'ai 21 réponses pour `#steps` au sein de fichiers `_custom.scss`
Seul les thèmes liege et liege-spirit ont surchargés le design standard des steps.
Les 19 autres se limitent juste à 3 déclarations (toujours les même) sur le selecteur `div#steps ol li.current`.
Donc on pourrait appliquer le même patch sur les 19 et juste s'occuper de manière plus attentive des 2 autres.
J'ai quand même l'impression que le bloc Steps est l'un des bloc qui a été le plus surchargé en custom. Pour la refactorisation des suivants je me dis que ça devrait être plus simple.
Et virer les sélecteurs de balises est une chose à faire.
On peut pas se dire « On a des selecteurs css pourris, qui nous empêchent de faire évoluer le markup HTML ». Virons ces sélecteurs et avançons.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Quelques nouveautés:
// Step // Step border Bottom: pour retro compatibilité avec l'ancienne version $wcs-step-border-bottom: 1px solid lighten($wcs-step_color, 15%) !default; $wcs-step-current-border-bottom: 3px solid lighten($title-color, 15%) !default; // Faire se superposer les steps-before pour gros gain de place en mode vertical $wsc-step-before-piled: false !default; // Step marker $wcs-step-marker-type: square !default; // square || tied || disc || disc tied || square tied // taille du marker $wcs-step-marker-size: 2.1em !default; // Possibilité de générer un léger dégradé basé sur le background color du marker $wcs-step-marker-background-type: solid !default; // solid || gradient // if marker_type = tied: couleur et épaisseur de la ligne $wcs-step-marker-tie-color: $wcs-step_color !default; $wcs-step-marker-tie-width: 5px !default;
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
- Fichier 0002-SCSS-All-custom-themes-header-is-now-.site-header-36.patch ajouté
- Fichier 0003-alfortville-update-steps-36765.patch ajouté
- Fichier 0004-alpes-maritimes-2018-updates-steps-36765.patch 0004-alpes-maritimes-2018-updates-steps-36765.patch ajouté
- Fichier 0005-blois-2018-updates-steps-36765.patch 0005-blois-2018-updates-steps-36765.patch ajouté
- Fichier 0006-arles-updates-steps-36765.patch 0006-arles-updates-steps-36765.patch ajouté
- Fichier 0007-amiens-metropole-update-steps-36765.patch 0007-amiens-metropole-update-steps-36765.patch ajouté
- Fichier 0008-arpagon-update-steps-36765.patch 0008-arpagon-update-steps-36765.patch ajouté
- Fichier 0009-auch-update-steps-36765.patch 0009-auch-update-steps-36765.patch ajouté
- Fichier 0010-cnil-update-steps-36765.patch 0010-cnil-update-steps-36765.patch ajouté
- Tracker changé de Project management à Bug
- Statut changé de Nouveau à Solution proposée
- Patch proposed changé de Non à Oui
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier
0003-alfortville-update-steps-36765.patchsupprimé
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier
0002-SCSS-All-custom-themes-header-is-now-.site-header-36.patchsupprimé
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
J'ai modifié 48 themes. Je ne pense pas qu'il soit nécessaire de pousser les 48 patches. Ils sont visible dans la branche pour ceux qui veulent les inspecter.
J'ajoute pas contre le patch qui met à jour la documentation pour relecture
Mis à jour par Frédéric Péters il y a plus de 4 ans
La modification à la documentation produit un fichier qui ne passe pas, 1/ il n'y a pas de balise <br>, 2/ il manque la troisième colonne sur la ligne $wcs-step-current-label-color.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
Patch bien plus lisible :)
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Patch misc.scss help file
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-grand-chambery-update-steps-36765.patch 0001-grand-chambery-update-steps-36765.patch ajouté
Patch pour grand-Chambery
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
- fusion de la doc dans le patch
- masquer les h2 par défaut
Mis à jour par Frédéric Péters il y a plus de 4 ans
(pour suivi review collective du rendu : https://pad.libre-entreprise.org/p/eo-wcs-steps)
En plus de l'affichage de Étapes, déjà mentionné/traité, j'y note deux points qui reviennent :
- On a 4 étapes plutôt que le 1/4 (et je vais arrêter de l'écrire partout, je me ferai expliquer quand on a plutot 1/4 que les 4 étapes).
"(tjund: par défaut on bascule entre le mode mobile (1/4) et le mode horizontale à partir d'un viewport 480px) La capture est donc prise au delà de 480."
Là-dessus je pense quand même préférer qu'on ait un unique mode mobile, pas ce mode hybride (je cite du pad : « Ça rend pas terrible terrible »); mais je m'interroge un peu sur le rendu 1/4 quand même, est-ce suffisamment explicite ? (le problème étant je pense qu'il vient la plupart du temps avant le titre, qui doit sans doute être un truc modifié, plus tard)
"le bloc courant n'est plus sur fond <insérer ici une couleur>"
Je note que c'est un choix concernant le nouveau rendu par défaut, de plutôt taper une bordure plus épaisse et de couleur, moi ça me va.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Dans le rendu par défaut je suis un peu compact en mode horizontal. J'ai vraiment pensé aux formulaires avec un grand nombre de Steps.Là-dessus je pense quand même préférer qu'on ait un unique mode mobile, pas ce mode hybride (je cite du pad : « Ça rend pas terrible terrible »);
Quelques améliorations possibles à mon avis.
La point de bascule entre le mode mobile et horizontal est paramétrable via $bq-max--wcs-steps-small-layout (que je vais renommer $wcs-steps-small-layout-limit)
- agrandir la valeur de $very-small-limit, que je trouve pertinent même pour la grille) cf #36765
- aéré un peu le mode horizontal.
mais je m'interroge un peu sur le rendu 1/4 quand même, est-ce suffisamment explicite ? (le problème étant je pense qu'il vient la plupart du temps avant le titre, qui doit sans doute être un truc modifié, plus tard)
+1 On doit vraiment trouver une solution pour remonter le titre de la démarche au-dessus du bloc étape. J'ai vu que tu as déjà modifié certains thèmes dans sens
"le bloc courant n'est plus sur fond <insérer ici une couleur>"
Je note que c'est un choix concernant le nouveau rendu par défaut, de plutôt taper une bordure plus épaisse et de couleur, moi ça me va.
Oui, en mode mobile, 3 blocs successifs récupéraient le style `title`: étapes, code de suivi et titre de la démarche. Ce qui agrégeait 3 éléments visuellement identiques comme étant des titres de niveau 1. Je pensais important de créer une différenciation et de me baser sur $primary-color plutôt que sur $title-*
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Il y a 3 modeje suis pour mobile/desktop, pas de mode intermédiaire (découvert par hasard parce que selenium ne voulait pas réduire davantage la largeur de fenêtre lors de mes premières captures).
- mode vertical quand sidebar == left || right. Le mode vertical est dépendant de la position de la sidebar
- mode horizontal
- mode mobile
Le débat est à quel moment on bascule du mode mobile au mode horizontal par défaut
Pour Fred: basculer à partir de $mobile-limit qui est à 800px par défaut (le même point de rupture que la basculement de la sidebar)
Pour Thomas: le mode horizontal est plus pertinent que le mode mobile car il ajoute une information visuelle de progression, une information graphique informe l'utilisateur qu'il a bien changer de page et avancé (feedback textuel + graphique). En mode mobile l'utilisateur n'a cette information que par un processus de lecture (feedback textuel uniquement). Le basculement doit se faire à partir du moment où le mode horizontal n'est plus viable, et il peut être viable encore vers 600px.
Mis à jour par Frédéric Péters il y a plus de 4 ans
- Fichier gorges-mobile.png gorges-mobile.png ajouté
Pour Thomas: le mode horizontal est plus pertinent que le mode mobile car il ajoute une information visuelle de progression (...)
Oui mais je recite « Ça rend pas terrible terrible », et je pense que comme tu l'écris c'est parce que c'est très compact. (pour référence, capture attachée).
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier gorges-steps-modified.png gorges-steps-modified.png ajouté
« Ça rend pas terrible terrible »
Je peut être assez d'accord sur certains thèmes.
Voici une version où je double l'espace. Et où le titre passe au dessus.
Je trouve ça minimaliste et relativement efficace sans être "pas terrible terrible".
Et puis avec juste quelques vars scss il est possible d'être encore plus efficace.
Mis à jour par Serghei Mihai il y a plus de 4 ans
- Fichier 0001-villeurbanne-2018-reduce-margins-around-steps.patch 0001-villeurbanne-2018-reduce-margins-around-steps.patch ajouté
Je rajoute une correction au thème de Villeurbanne pour remettre au plus proche le rendu initial.
Mis à jour par Serghei Mihai il y a plus de 4 ans
- Fichier 0001-grenoble-metropole-2019-center-form-steps-in-mobile.patch 0001-grenoble-metropole-2019-center-form-steps-in-mobile.patch ajouté
Centrage les étapes en mobile, comme avant.
Mis à jour par Serghei Mihai il y a plus de 4 ans
- Fichier 0001-arles-keep-active-step-text-color.patch 0001-arles-keep-active-step-text-color.patch ajouté
Préservation la couleur du texte de l'étape active sur le thème d'Arles.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-publik-base-theme-update-steps-36765.patch 0001-publik-base-theme-update-steps-36765.patch ajouté
Patch du thème de Rouen.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-arles-updates-steps-36765.patch 0001-arles-updates-steps-36765.patch ajouté
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
- Fichier 0001-grenoble-metropole-2019-update-steps-36765.patch 0001-grenoble-metropole-2019-update-steps-36765.patch ajouté
- Fichier 0001-villeurbanne-2018-update-steps-36765.patch 0001-villeurbanne-2018-update-steps-36765.patch ajouté
scss: steps: change breakpoint var name
scss: steps: increase horizontal layout markers margin
scss: steps: hide step-1 by default on horizontal & small layout
- Arles
- Grenoble metropole 2019
- villeurbanne 2018
Merci Serghei
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-avray-update-steps-36765.patch 0001-avray-update-steps-36765.patch ajouté
- Fichier 0002-coprec-update-steps-36765.patch 0002-coprec-update-steps-36765.patch ajouté
- Fichier 0003-malakoff-update-steps-36765.patch 0003-malakoff-update-steps-36765.patch ajouté
- Fichier 0004-concarneau-update-steps-36765.patch 0004-concarneau-update-steps-36765.patch ajouté
Update des sites Atreal
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-alpes-maritimes-2018-updates-steps-36765.patch 0001-alpes-maritimes-2018-updates-steps-36765.patch ajouté
- Fichier 0001-amiens-metropole-update-steps-36765.patch 0001-amiens-metropole-update-steps-36765.patch ajouté
- Fichier 0001-castelnau-le-lez-update-steps-36765.patch 0001-castelnau-le-lez-update-steps-36765.patch ajouté
- amien-metropole
- alpes-maritime-2018
- castelnau-le-lez
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-fondettes-update-steps-36765.patch 0001-fondettes-update-steps-36765.patch ajouté
- Fichier 0001-metz-metropole-2019-update-steps-36765.patch 0001-metz-metropole-2019-update-steps-36765.patch ajouté
- Fichier 0001-meyzieu-2018-update-steps-36765.patch 0001-meyzieu-2018-update-steps-36765.patch ajouté
- Fichier 0001-montlouis-sur-loire-update-steps-36765.patch 0001-montlouis-sur-loire-update-steps-36765.patch ajouté
- Fichier 0002-meaux-update-steps-36765.patch 0002-meaux-update-steps-36765.patch ajouté
- Fichier 0003-nanterre-update-steps-36765.patch 0003-nanterre-update-steps-36765.patch ajouté
Patchs pour les thèmes
- fondettes
- meaux
- metz-metropole-2019
- meyzieu-2018
- montlouis-sur-loire
- nanterre
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-castries-update-steps-36765.patch 0001-castries-update-steps-36765.patch ajouté
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
- Fichier 0001-publik-update-steps-36765.patch 0001-publik-update-steps-36765.patch ajouté
- Fichier 0001-quimper-update-steps-36765.patch 0001-quimper-update-steps-36765.patch ajouté
- Fichier 0001-saint-lo-agglo-update-steps-36765.patch 0001-saint-lo-agglo-update-steps-36765.patch ajouté
- Fichier 0001-seine-et-marne-apa-updates-steps-36765.patch 0001-seine-et-marne-apa-updates-steps-36765.patch ajouté
- Fichier 0001-strasbourg-2018-update-steps-36765.patch 0001-strasbourg-2018-update-steps-36765.patch ajouté
- Fichier 0001-toodego-update-steps-36765.patch 0001-toodego-update-steps-36765.patch ajouté
- scss: steps: add flexbox prefix for IE10
- scss: steps: add condition to apply enlarge markup option
- toodego: patch steps
- Sauf "étendre sur la longeur" impossible sans générer des défauts de position de la ligne -- défauts déjà existant sur la version current.
- strasbourg-2018: patch steps
- seine-et-marne-apa: patch steps
- saint-lo-agglo: patch steps
- quimper: patch steps
- publik: patch steps
- castries: patch steps
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-grand-chambery-update-steps-36765.patch 0001-grand-chambery-update-steps-36765.patch ajouté
- Fichier 0001-lille-metropole-update-steps-36765.patch 0001-lille-metropole-update-steps-36765.patch ajouté
- Fichier 0001-SCSS-All-custom-themes-header-is-now-.site-header-36.patch 0001-SCSS-All-custom-themes-header-is-now-.site-header-36.patch ajouté
- grand-chambery: patch Steps
- Lille-metropole: patch Steps
- Lille-metropole: header -> .site-header
Mis à jour par Frédéric Péters il y a plus de 4 ans
J'ai remis des notes dans le pad mais c'est peut-être plus facile désormais de suivre ici ?
- fontenay-sous-bois-2018, roannais, saint-chamond, les libellés des étapes ne sont plus centrés
- nancy-en-direct, curieusement en ligne les étapes apparaissent à droite, https://demarches.nancy.fr/dechets-et-nettoiement/demande-d-enlevement-de-graffiti/ , pas en local
- strasbourg-2018, en desktop les points ne se réduisent plus quand il y a beaucoup d'étapes, en mobile les nombres sont un peu moins bien centrés dans les pastilles
- toulouse et toulouse-metropole, la ligne des étapes en desktop n'est plus correctement alignée
- toulouse-metropole, le texte "Étapes" apparait
Captures dans https://perso.entrouvert.org/~fred/36765-steps/shots-20191127/
Mis à jour par Serghei Mihai il y a plus de 4 ans
En rapport avec la remarque de Frédéric sur les thèmes fontenay-sous-bois-2018, roannais, saint-chamond, je pense qu'on devrait systèmatiquement center les libellés des étapes quant les étapes horizontale.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
C'est vrai que quand $form-sidebar-position == top, #gauche est forcé en text-align-center;
Je vais modifier dans ce sens pour centrer les markers et le label
Mis à jour par Frédéric Péters il y a plus de 4 ans
Roannais et Saint-Chamond https://perso.entrouvert.org/~fred/36765-steps/shots-20191127/roannais-agglomeration-desktop.png et https://perso.entrouvert.org/~fred/36765-steps/shots-20191127/saint-chamond-desktop.png, ont les étapes latérales.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Pour Nancy, la sidebar est à droite en ligne et pas en local car Nancy utilise une page combo "demarches" et surcharge le layout avec le selecteur "body.page-demarches" (page qui n'existe pas en local).
Surcharge inutile car `$form-sidebar-position: right;` aurait suffit :/
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-core-refactorisation-of-wcs-steps-component-36765.patch 0001-core-refactorisation-of-wcs-steps-component-36765.patch ajouté
- Fichier 0001-fontenay-sous-bois-update-steps-36765.patch 0001-fontenay-sous-bois-update-steps-36765.patch ajouté
- Fichier 0001-roannais-agglomeration-update-steps-36765.patch 0001-roannais-agglomeration-update-steps-36765.patch ajouté
- Fichier 0001-saint-chamond-update-steps-36765.patch 0001-saint-chamond-update-steps-36765.patch ajouté
- Fichier 0001-strasbourg-2018-update-steps-36765.patch 0001-strasbourg-2018-update-steps-36765.patch ajouté
- Fichier 0001-toulouse-metropole-update-steps-36765.patch 0001-toulouse-metropole-update-steps-36765.patch ajouté
- Fichier 0001-toulouse-update-steps-36765.patch 0001-toulouse-update-steps-36765.patch ajouté
- fontenay-sous-bois-2018: patch steps
- roannais: patch steps
- saint-chamond: patch steps
- strasbourg-2018: patch steps (finalement retour au design actuel :/ )
- toulouse: patch steps
- toulouse-metropole: patch steps
- Steps Core: alignement centré des markers et du label par défaut en "desktop horizontal layout".
Mis à jour par Frédéric Péters il y a plus de 4 ans
Tu pourras mettre ça dans la branche ? (je viens de regénérer des captures avant de me rendre compte que la branche n'avait pas bougé…)
Mis à jour par Frédéric Péters il y a plus de 4 ans
Fontenay-sous-Bois, il y a un espace blanc sous les étapes excessif (2× margin-bottom 2em), en desktop. En tablette aussi, mais moindre.
Mis à jour par Frédéric Péters il y a plus de 4 ans
Pour aller avec "SCSS: All custom themes: header is now .site-header (#36765)" :
--- a/static/includes/_header.scss
+++ b/static/includes/_header.scss
@@ -1,5 +1,5 @@
body.has-header-background {
- header {
+ .site-header {
background: url(/assets/header:background) top center no-repeat;
background-size: cover;
}
(et idéalement le message de commit serait de la forme que les autres, par exemple "scss: use class name to refer to site header").
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-fontenay-sous-bois-2018-update-steps-36765.patch 0001-fontenay-sous-bois-2018-update-steps-36765.patch ajouté
- Fichier 0001-scss-use-.site-header-class-name-to-refer-to-site-he.patch 0001-scss-use-.site-header-class-name-to-refer-to-site-he.patch ajouté
- Fontenay-sous-bois-2018: patch steps
- use '.site-header' on includes/_header.scss and rename commmit message
Mis à jour par Serghei Mihai il y a plus de 4 ans
Pour Fontenay, en desktop l'espace entre le numéro et le libellé de l'étape est trop étroit. Il manque un padding-top: 0.5rem.
Go pour le patch sur les header.
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Fichier 0001-fontenay-sous-bois-2018-update-steps-36765.patch 0001-fontenay-sous-bois-2018-update-steps-36765.patch ajouté
fontenay-sous-bois: add padding-top on label
Mis à jour par Serghei Mihai il y a plus de 4 ans
- Statut changé de Solution proposée à Solution validée
Go
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Statut changé de Solution validée à Solution déployée
commit 580b9db318749d5fe847e7db9e789f5be6ed6b3a (HEAD -> master, tag: 4.98, origin/wip/36765_new-form-steps, origin/master, origin/HEAD)
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 27 11:15:19 2019 +0100
lille-metropole: update steps (#36765)
commit 13c7c4dc8642a06affe5b8c2f67dbd1035d1ece6
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Nov 25 17:07:19 2019 +0100
seine-et-marne-apa: update steps (#36765)
commit 6862b82b88c2b4cbdf31635d403afbf5887b6534
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Nov 25 16:58:00 2019 +0100
saint-lo-agglo: update steps (#36765)
commit 16ea88d4a17385595fa9d516384b1058d593257c
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Nov 25 15:30:35 2019 +0100
castries: update steps (#36765)
commit 699000c542882bfe83067679b8592e526d84b2e9
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Nov 22 16:35:27 2019 +0100
nanterre: update steps (#36765)
commit 54f635a1c30cc7235aee33e60fb32de8d62f364d
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Nov 22 15:00:47 2019 +0100
meaux: update steps (#36765)
commit 722440d91b49e57a27fe4938d3d680eaae6e0d41
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Nov 22 14:41:47 2019 +0100
fondettes: update steps (#36765)
commit 81481db7739891de61b602aaeffa0e6e10e3f501
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Nov 21 17:47:32 2019 +0100
castelnau-le-lez: update steps (#36765)
commit 44f5c66903b09a0ce62dca297e4d523be2ab166d
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Nov 18 17:22:45 2019 +0100
grand-chambery: update steps (#36765)
commit 9e5d7b32218227f94a40b263a8340091d396b233
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Nov 15 11:56:25 2019 +0100
villeurbanne-2018: update steps (#36765)
commit ca8fd514e380f9f4fd46dad255fb103d72d4dc2a
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Nov 14 14:20:48 2019 +0100
venissieux: update steps (#36765)
commit 989bd2deb4fc08c6fba432ac94f8890db3f7517e
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Nov 14 12:19:20 2019 +0100
tournai: update steps (#36765)
commit b012b584eca662e530b294e6188db568cd397598
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Nov 14 11:50:38 2019 +0100
toulouse-metropole: update steps (#36765)
commit c912e5532ef7ae57d9ff542e2985cd4ef5ef83a7
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Nov 14 11:45:23 2019 +0100
toulouse: update steps (#36765)
commit acfd6fab63589e724bcd211ed70589d76e806620
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 17:45:43 2019 +0100
toodego: update steps (#36765)
commit 59e983633260bc4e11c5d863881971b09735772a
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 16:57:12 2019 +0100
omonville-la-rogue: update steps (#36765)
commit 58b34df4c9655045a46278914265ea7d283fa218
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 16:45:56 2019 +0100
thonon-agglomeration: update steps (#36765)
commit f25225ad675b7e56122d4c088ae7cd33910df4cd
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 16:28:21 2019 +0100
publik: update steps (#36765)
commit e815d0bdee12075f5167d7a0dcbf969f2747e719
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 15:52:26 2019 +0100
signal-publik: update steps (#36765)
commit eff129da19de1b3b7f6b7da40964e1c82314541b
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 13:06:29 2019 +0100
strasbourg-2018: update steps (#36765)
commit 3412d29b76e75d059f253f4ba37b230973f0b07c
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Nov 13 11:35:08 2019 +0100
signal-publik: update steps (#36765)
commit 5a470ec68bf0a51f7e28e3ffecd44c2893cf406a
Author: Thomas JUND <tjund@entrouvert.com>
Date: Tue Nov 12 15:39:54 2019 +0100
seine-et-marne-apa: updates steps (#36765)
commit fb325ef067a71224db7273110f868cbb7c615637
Author: Thomas JUND <tjund@entrouvert.com>
Date: Tue Nov 12 15:14:48 2019 +0100
saone-et-loire-cd71: update steps (#36765)
commit 525529bb154acf672607380044ebf6c6b12b6e1e
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 17:44:49 2019 +0100
saone-et-loire-cd71-2019: update steps (#36765)
commit 76893edd313b3e2a898e1258c786ec520b8d765c
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 17:21:26 2019 +0100
saint-chamond: update steps (#36765)
commit c51193053670aed00577711dd4ba85993aefc72d
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 17:11:50 2019 +0100
roannais-agglomeration: update steps (#36765)
commit 8b1d4d80fe9ce5ddb7b52426868fac406317da73
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 16:41:31 2019 +0100
quimper: update steps (#36765)
commit 732d55c3cf63f491ab71152f34aeb8e2ee37515b
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 16:05:22 2019 +0100
pre-saint-gervais: updates steps (#36765)
commit 126aed5f80d04e53def9277939616d98b7e888a5
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 15:22:16 2019 +0100
nancy-en-direct: update steps (#36765)
commit 52e2f1690b52f9d52c7a09a569ed06882af95a4b
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 14:34:20 2019 +0100
montreuil: update steps (#36765)
commit a90fca217d6978d706d66f2f626b6f7d26382aae
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 13:05:08 2019 +0100
montpellier: update steps (#36765)
commit 88106a2c0f0ff9603e70ba2dc7a45ddd5d899380
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 12:27:42 2019 +0100
montlouis-sur-loire: update steps (#36765)
commit d356c6f01104df33dfb663253ccc23c56bb34354
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 11:58:37 2019 +0100
meyzieu-2018: update steps (#36765)
commit 489e44703e282a7fb4b7399d8f9af11533a75f1a
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 11:05:06 2019 +0100
metz-metropole-2019: update steps (#36765)
commit c2952f82da88d9c783371e48f3b0d13bd4444f69
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 31 10:13:23 2019 +0100
lille: update steps (#36765)
commit 927ab208aa80ffde45317fc9a336492b4cceb09f
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 17:16:22 2019 +0100
haute-garonne-cd31: update steps (#36765)
commit f17ecaebdb0cb04af78722aa81d2c77d59a6b8db
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 16:49:55 2019 +0100
groupe-up: update steps (#36765)
commit b7341419d1225224c0938cb6829a9b327dad3b77
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 16:37:41 2019 +0100
grenoble-metropole-2019: update steps (#36765)
commit c8a6da6b8c1cf5eb50ae0c2bce1c49ddeac80642
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 15:48:35 2019 +0100
fontenay-sous-bois-2018: update steps (#36765)
commit 12f6fadca15be22e3553d275c3489d0277f1a069
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 13:14:33 2019 +0100
dauphine: update steps (#36765)
commit f9dfca698fabfc5d5c8167e375309e8be704060a
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 13:01:44 2019 +0100
cotes-d-armor: updates steps (#36765)
commit c3c262890c480d87c185cddaf2fe17b36823ff84
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:42:54 2019 +0100
haute-goulaine: update steps (#36765)
commit 3070c52606cd4e1ad97d74ed2e4e7856bee0cef8
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:34:50 2019 +0100
gorges: update steps (#36765)
commit 48aeb1b1c1a8bad05de64c0708cc6347faec2923
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:26:59 2019 +0100
clisson-agglo: update steps (#36765)
commit 871589bbf5578c3dd57be225b14dc04f678c4786
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:15:53 2019 +0100
clisson: update steps (#36765)
commit 840f5117472bfd470bb1fd43b5916c10e1bfe967
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:09:10 2019 +0100
clermont-metropole: update steps (#36765)
commit eb70183c1bab0db0a969adc3bcd099868a23fb1d
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 12:02:35 2019 +0100
clapiers: update steps (#36765)
commit 099d929cc758de39ef1aef5b44523b62c7673d83
Author: Thomas JUND <tjund@entrouvert.com>
Date: Wed Oct 30 11:55:50 2019 +0100
chateauroux: update steps (#36765)
commit f89b1091e49b617e9ca3b1e4493b147cb36c42a4
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Oct 28 17:47:11 2019 +0100
cnil: update steps (#36765)
commit 501a874bdc1a0523cd58f795d5f1ed4c2336837e
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Oct 28 15:05:21 2019 +0100
auch: update steps (#36765)
commit 664f9a4770980886edaaba51bd1e87f5f8a95e86
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Oct 28 14:58:14 2019 +0100
arpagon: update steps (#36765)
commit e41fce8fd484846446e3a92881a59d6bc621fc62
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Oct 25 17:49:53 2019 +0200
amiens-metropole: update steps (#36765)
commit 1bc705e78fd4c50eefe9a1a5729f7274e7275abf
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Oct 25 17:13:59 2019 +0200
arles: updates steps (#36765)
commit e6031742841c47f3bae14d052cd1edf729ff3da1
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Oct 25 15:18:27 2019 +0200
blois-2018: updates steps (#36765)
commit e34d8e621373f182adb1e3d4da953d6912ace383
Author: Thomas JUND <tjund@entrouvert.com>
Date: Thu Oct 24 16:44:00 2019 +0200
alpes-maritimes-2018: updates steps (#36765)
commit 190bd35d6513964059c241d3500499fb9ff71462
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Oct 21 16:31:27 2019 +0200
alfortville: update steps (#36765)
commit ecccf98018466c4b8b37b5297ae0b3b9e9818da1
Author: Thomas JUND <tjund@entrouvert.com>
Date: Fri Nov 29 11:39:51 2019 +0100
scss: use '.site-header' class name to refer to site header (#36765)
commit b144e00e3119e80acc3e10d1872edfc3afac4ad6
Author: Thomas JUND <tjund@entrouvert.com>
Date: Mon Oct 14 13:05:20 2019 +0200
core: refactorisation of wcs steps component (#36765)
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Sur dépôt rouen-publik-theme
commit 37b7a5296a1fa6d6d12a2c86c77f505d90152bad (HEAD -> master, tag: 0.12, origin/master, origin/HEAD)
Author: Thomas JUND <tjund@tj.entrouvert.lan>
Date: Tue Nov 19 15:55:20 2019 +0100
publik-base-theme: update steps (#36765)
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
Sur dépôt atreal-publik-themes
commit 788a7270eb1dfb66ee6c52b3afa3649d299ba507 (HEAD -> master, origin/master, origin/HEAD, wip/36765_update-steps)
Author: Thomas JUND <tjund@tj.entrouvert.lan>
Date: Thu Nov 21 16:06:55 2019 +0100
concarneau: update steps (#36765)
commit ceff226c59e030a89de7dbe7aaa8310f4a1c6882
Author: Thomas JUND <tjund@tj.entrouvert.lan>
Date: Thu Nov 21 15:29:37 2019 +0100
malakoff: update steps (#36765)
commit bfe622146bd1488c15bb921e7e3c782500b5a3bf
Author: Thomas JUND <tjund@tj.entrouvert.lan>
Date: Thu Nov 21 15:19:59 2019 +0100
coprec: update steps (#36765)
commit b478594850bf4dd4250fcace0a2c809bdac2cb00
Author: Thomas JUND <tjund@tj.entrouvert.lan>
Date: Thu Nov 21 15:12:11 2019 +0100
avray: update steps (#36765)
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Lié à Development #14143: Améliorer le graphisme des étapes sur les pages de formulaires ajouté
Mis à jour par Thomas Jund (congés, retour le 29/04) il y a plus de 4 ans
- Lié à Development #26730: quand une seule étape serait affichée, ne pas afficher les étapes ajouté
core: refactorisation of wcs steps component (#36765)