Maintenance et ajustements des bandeaux du privé.
En 2 mots :
- On remplace les icônes pochoirs du bando par des icônes simples, ce qui permettra d'utiliser les couleurs qu'on veut.
- Quelques ajustements visuels : calages, espacements, une touche de responsive en plus.
- Grosse refacto et rangement de la CSS
- Et on affiche le beau logo dans le pied de page
La seule différence vraiment notable, c'est que les sous-menus du plan des rubriques passe en column-count, donc l'ordre des items change (de haut en bas au lieu de gauche à doite). Mais ça fait gagner pas mal de place et ça simplifie beaucoup. C'est peut-être le point à bien tester pour qu'il n'y ait pas de régressions.
S'il y a d'autres changements qui plaisent pas (couleurs des textes etc.), on peut ajuster, pas de souci.
Les logs des commits :
Les différences visuelles sont mineures, il s'agit juste de caler un peu les éléments, les gouttières, etc. Par contre en arrière-plan on fait un gros ménage pour préparer et simplifier les évolutions futures.
- Menu principal du privé : remplacement des icônes svg pochoirs par des icônes "simples". On peut leur donner les couleurs que l'on veut en ciblant les classes .foreground et .background. Les icônes sont légèrement ajustées : épaisseurs des traits, alignements, etc
- Pied de page du privé : afficher fièrement le logo, avec un lien vers spip.net
- Rangement et reformatage complet de la CSS : mutualiser les règles, supprimer celles en double ou en triple, ajout de commentaires, etc.
- Markup : Ajout de classes utiles là où il n'y en avait pas, et notamment d'attributs data pour cibler plus facilement les éléments du menu selon la profondeur, pour faire par exemple .item[data-profondeur="2"] au lieu de ul>li>ul>li
- Menu identité : espacer les liens, textes plus foncés, traits de séparations inutiles, et icône de langue alternative.
- Menu rubriques : rétablit les carets pour les entrées depliables. Les sous-menu en colonnes sont fait avec column-count : cela permet de gagner de la place par rapport à display flex, grid ou autre, et cela simplifie les règles.
- Bien indiquer les prises de focus de tous les liens.
- Menus déroulants : refaire fonctionner la navigation au clavier qui était hs, purement en CSS pour l'instant. À voir s'il ne faut garder qu'une des 2 solutions, ou les 2 en compléments (le JS ajoutait un petit délai en plus, non reproductible en CSS).
- Ajout d'un peu de responsive
Pied de page :
Menu des rubriques en 2 colonnes :