Merge pull request 'fix(css): handle title + lists in bio' (#111) from fix/members_bio into master

Reviewed-on: #111

src/members/laurelene-hard.md

@@ -10,27 +10,24 @@ socialLinkedin: 'https://www.linkedin.com/in/laurelenehard/'
 #socialMastodon: 'https://framapiaf.org/@AstrolabeCAE'
 url: '/members/laurelene-hard'
 emailSlug: 'laurelene.hard'
-tags: [ web, design, graphisme, creation ]
+tags: [web, design, graphisme, creation]
 location: [48.10517, -1.680833]
 ---
 
-# Vous avez un projet digital en tête, mais vous ne savez pas par où commencer ?
+## Vous avez un projet digital en tête, mais vous ne savez pas par où commencer ?
 
-
+### Je vous accompagne dès les premières étapes de votre projet :
-## Je vous accompagne dès les premières étapes de votre projet :
 
 - En vous proposant un accompagnement en UX design, de la phase de recherche à celle des tests et des itérations, pour vous fournir les clés nécessaires à l’adhésion de vos utilisateurs.
 
 - En réalisant un audit UX de votre site, application mobile ou logiciel, afin de vous aider à mieux convertir vos utilisateurs.
 
-
+### Je peux également intervenir dans :
-## Je peux également intervenir dans :
 
 - La création de votre identité visuelle (logo, charte graphique, branding sur LinkedIn) pour que vous soyez immédiatement reconnaissable.
 
 - La conception ou la refonte de votre site, application mobile ou logiciel.
 
-
 Avec 10 ans d'expérience dans le domaine de l'optique, un secteur à la fois médical et commercial, je peux également vous apporter des conseils avisés si votre projet touche à ces domaines.
 
 En tant qu’ancienne manager, d’équipes allant jusqu’à 10 collaborateurs, vous pourrez vous attendre à une collaboration structurée et rigoureuse, avec des points d'avancement réguliers (méthode agile) et un espace personnel dédié sur Notion.

src/scss/components/_member.scss

@@ -14,7 +14,7 @@
 
   &__wrapper {
     display: grid;
-    grid-template-columns: .4fr .6fr;
+    grid-template-columns: 0.4fr 0.6fr;
     grid-template-rows: 1fr;
     grid-column-gap: 1.5rem;
     grid-row-gap: 0;
@@ -63,9 +63,38 @@
   &__bio {
     position: relative;
 
-    + p,
+    p:not(:last-child),
-    p + p {
+    ul:not(:last-child) {
-      margin-top: 1.5rem;
+      margin-bottom: 1.5rem;
+    }
+
+    h2:not(:first-child) {
+      margin-top: 1.1428em;
+    }
+
+    h3:not(:first-child) {
+      margin-top: 1.3333em;
+    }
+
+    h1 {
+      margin-bottom: 0.5em;
+    }
+
+    h2 {
+      margin-bottom: 0.5714em;
+    }
+
+    h3 {
+      margin-bottom: 0.6666em;
+    }
+
+    ul {
+      list-style: disc outside;
+      margin-inline-start: 2em;
+    }
+
+    li + li {
+      margin-top: 0.5em;
     }
 
     &:not(.member-contact)::before {