Éditeur : compteur de lignes dans les onglets, scrollbar plus large et libellés d’action plus longs
Les grandes évolutions (shadow DOM, mode sombre, l’AI Helper) font les gros titres. Le polish UX, non — et pourtant c’est lui qui change la façon dont vous utilisez un outil au quotidien. En v3.2.80–82, nous avons livré quatre éléments qui, ensemble, rendent le travail avec l’éditeur de règles nettement plus agréable.
Compteur de lignes dans les onglets CSS / JS / Actions (v3.2.82)
Chaque onglet de l’éditeur de règles — CSS, JS, Actions — porte désormais un badge de comptage de lignes à côté de son nom. À l’image de l’onglet Actions, qui affiche depuis longtemps le nombre d’actions.
Pourquoi : quand vous regardez un jeu de règles, vous voyez tout de suite où se trouve l’essentiel. 87 lignes de CSS + 12 lignes de JS + 3 actions — un coup d’œil suffit pour savoir que ce jeu est moyennement complexe et que la logique réside surtout dans le CSS. Avant, il fallait ouvrir chaque onglet pour s’en faire une idée.
Petit détail technique : le compteur se met à jour en direct pendant la frappe (debounce de 200 ms), pour que le badge ne clignote pas à chaque touche.
Scrollbar plus large dans les fenêtres : 10 → 14 px (v3.2.80)
Le scrollbar interne des fenêtres de développement (panneau CSS, panneau JS, JS Console, Output Console, AI Helper) faisait 10 px de large — ce qui entrait en conflit avec la poignée de redimensionnement de 8 px sur le bord droit. Il était facile d’attraper la poignée au lieu du scrollbar et de redimensionner la fenêtre par accident.
Après le changement, le scrollbar fait 14 px de large — plus facile à saisir, et la poignée de redimensionnement reste présente, mais clairement sous le bord du scrollbar. Plus de conflit, plus de frustration.
Libellés d’action 8 → 12 caractères (v3.2.81)
Les libellés d’action dans la barre avaient une limite codée en dur de 8 caractères. C’était suffisant pour « Dark », « Hide » et compagnie — mais quand vous travailliez avec l’AI Helper, il voulait souvent proposer un nom plus long et plus descriptif (« Hide ads », « Wide column ») — et il se faisait couper.
La nouvelle limite est de 12 caractères. UI et backend sont synchronisés — l’AI Helper, l’éditeur, le rendu de la barre, le panneau de réglages — tous parlent de la même longueur. Les libellés peuvent maintenant porter davantage de contexte sur ce que fait chaque action.
Barre d’outils de dossier réorganisée (v3.2.80)
La barre d’outils de l’en-tête de dossier (panneau d’édition de dossier) avait tout sur une seule ligne : Export, Import, Delete + Group, Bar, Window. Six boutons côte à côte — visuellement, ils se confondaient et il était difficile de trouver rapidement ce que vous cherchiez.
Le nouveau layout est en deux lignes :
- En haut : Export / Import / Delete — opérations sur le dossier dans son ensemble, au-dessus du champ URL patterns.
- En bas : + Group / + Bar / + Window — création d’éléments enfants, séparée des opérations sur le dossier.
Deux groupes logiques, immédiatement reconnaissables d’un coup d’œil.
Autres petits gains de la même série
À côté des changements principaux, quelques retouches plus modestes mais agréables sont passées :
- Padding symétrique sur le conteneur
.rules-area— 14 px (v3.2.88) — auparavant 24 px à droite, une asymétrie héritée d’une précédente itération de l’UI. - Préservation du scroll dans l’éditeur lors d’une synchronisation depuis un autre appareil (v3.2.82) — quand un autre appareil modifie la règle, CodeMirror ne saute plus à la position 0, il vous laisse là où vous étiez.
- Bouton ancre de dropdown — un second clic le ferme (v3.2.89) — correction d’un bug où un dropdown ouvert par le bouton ne pouvait être fermé qu’en cliquant à l’extérieur, et non en re-cliquant sur le bouton.
Voir aussi
- Fenêtres sur la page — aperçu de toutes les fenêtres de développement couvertes par le scrollbar plus large
- Raccourcis clavier JustZix — l’antisèche clavier complète
- Panneau d’édition à côté de votre page — une autre manière de gérer l’édition de règles au quotidien
Installez JustZix — et sentez la différence dans les détails.
Notez cet article
Aucune note — soyez le premier.