Merge pull request 'fix(glossaire): adjust section anchor offset for sticky header' (#217) from feat/glossaire-paradigmes-externes into main

Reviewed-on: #217

src/pages/glossaire/index.astro

@@ -61,25 +61,6 @@ const paradigmes = byPredicate((e) => e.data.kind === "paradigme");
     <nav class="glossary-toc" aria-label="Sommaire du glossaire">
       <a href="#reperes">Repères</a>
       <a href="#paradigmes">Paradigmes mobilisés</a>
-      {paradigmes.length > 0 && (
-        <section id="paradigmes" class="glossary-section">
-          <h2>Paradigmes mobilisés</h2>
-          <p class="glossary-intro">
-            Ces entrées ne relèvent pas du noyau conceptuel archicratique au sens strict.
-            Elles désignent les cadres théoriques, paradigmes ou traditions de pensée
-            avec lesquels l’archicratie entre en dialogue, en déplacement ou en différenciation.
-          </p>
-
-          <div class="glossary-cards">
-            {paradigmes.map((e) => (
-              <a class="glossary-card" href={hrefOf(e)}>
-                <strong>{e.data.term}</strong>
-                <span>{e.data.definitionShort}</span>
-              </a>
-            ))}
-          </div>
-        </section>
-      )}
       <a href="#alphabetique">Index alphabétique</a>
     </nav>
 
@@ -171,6 +152,31 @@ const paradigmes = byPredicate((e) => e.data.kind === "paradigme");
       )}
     </section>
 
+    <section id="paradigmes" class="glossary-section">
+      <h2>Paradigmes mobilisés</h2>
+      <p class="glossary-intro">
+        Cette section rassemble les grands cadres théoriques, régimes d’intelligibilité
+        et paradigmes de régulation avec lesquels l’archicratie dialogue, se distingue
+        ou entre en tension.
+      </p>
+
+      {paradigmes.length > 0 ? (
+        <div class="glossary-cards">
+          {paradigmes.map((e) => (
+            <a class="glossary-card" href={hrefOf(e)}>
+              <strong>{e.data.term}</strong>
+              <span>{e.data.definitionShort}</span>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <p class="glossary-empty">
+          Les paradigmes externes seront ajoutés progressivement pour cartographier
+          le paysage théorique mobilisé par l’essai-thèse.
+        </p>
+      )}
+    </section>
+
     <section id="alphabetique" class="glossary-section">
       <h2>Index alphabétique</h2>
 
@@ -200,6 +206,12 @@ const paradigmes = byPredicate((e) => e.data.kind === "paradigme");
 </SiteLayout>
 
 <style>
+
+  .glossary-empty{
+    opacity: .82;
+    font-style: italic;
+  }
+
   .glossary-home{
     padding: 8px 0 32px;
   }
@@ -236,7 +248,8 @@ const paradigmes = byPredicate((e) => e.data.kind === "paradigme");
   }
 
   .glossary-section{
-    margin-top: 34px;
+    margin-top: 40px;
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
   }
 
   .glossary-block{