Mise en place / uniformisation de la marge entre le header et le début du contenu (titre de la page)

[lucaa]

Lors des différentes implémentations UI/UX et suite à #1035 , la marge en haut de la page entre le header et le début du contenu est pas du tout claire et est hétérogène, aussi entre le mode visualisation et édition. L'objectif d'espacement est celui des mockups sur figma, e.g. https://www.figma.com/file/kG2znZqEzySDPUxiWbrEme/JDMA?node-id=611%3A56809 .

Quelques exemples:

• une page de contenu / d'aide:
• page de la démarche, en mode visualisation et édition:
• formulaire d'ajout de la nouvelle démarche
• page de connexion

Note: le fil d'Ariane, pour les utilisateurs qui en ont (admin Dinum), peut-être placé directement sous le header, si nécessaire (le DSFR peut être consulté aussi, pour réference), mais aussi avec un espace, en fonction de la solution choisie. Le profil visé par cette tâche est le profil porteur / admin ministeriel.

Note: ces modifications ne doivent avoir aucun impacte sur le formulaire d'avis qui a été implémenté et mesuré précisément pour correspondre à son mockup.

[lucaa]

L'espacement avec le message implémenté pour #1093 doit être aussi vérifié lors de l'implémentation de ce ticket.

[lucaa]

Affichage mobile à vérifier et à implémenter aussi.

[lucaa]

à valider, à chaque changement, les écrans "spéciaux" qui ne sont pas visés par cette tâche mais qui ne doivent pas souffrir des régressions suite à ce travail:

• page d'accueil
• page de présentation du produit JDMA
• page observatoire
• formulaire d'avis.

[clemdee]

Le haut de page est désormais correctement espacé par rapport au header. Cela s'applique pour :

• pages de contenu / d'aide
• pages de démarche
• pages de connexion / inscription
• pages d'édition inline / wiki / object / class

Les marges sont responsives, et s'adaptent à la présence d'une boite de message en haut de la page, ainsi que des breadcrumbs.

Les pages spéciales (Main, JDMA, Obvservatoire, formulaire d'avis) n'ont pas subi de régression.

[lucaa]

@ClemDee Je rouvre pour répondre au commentaire ici https://github.com/DISIC/observatoire/commit/0c25e09bdfdc4da4350e62a3f5f1ba2b32efd4e3#r75445951 (une modification fait pour ce ticket change un comportement définit ailleurs).

[clemdee]

Fixed https://github.com/DISIC/observatoire/commit/0c25e09bdfdc4da4350e62a3f5f1ba2b32efd4e3#r75445951

[clemdee]

@lucaa J'ai séparé les styles totemize des styles de l'uniformisation de la marge du haut de page comme convenu.

[ugodtn]

Ça me semble ok, je valide.