fix: Projects vertical spacing

src/assets/css/src/2.blocks.project.css

@@ -14,6 +14,7 @@
   font-family: var(--font-serif);
   font-size: var(--text-lg);
   margin-bottom: var(--space-8);
+  position: initial;
 }
 .project-item p {
   font-size: var(--text-sm);

src/components/Projects.vue

@@ -71,9 +71,6 @@ section {
   --flow-space: var(--space-16);
   min-height: calc(100vh - 8.5rem);
 }
-section > * {
-  display: block;
-}
 section:empty::after {
   content: "Aucun projet pour le moment.";
   position: absolute;

src/components/project/Project.vue

@@ -1,35 +1,38 @@
 <template>
-  <router-link
+  <article class="project-item | flex | rounded-2xl | px-32 py-32">
-    :to="isEmptyBrief(project) ? project.uri + '/client-brief' : project.uri"
+    <hgroup>
-  >
+      <h3>
-    <article class="project-item | flex | rounded-2xl | px-32 py-32">
+        <router-link
-      <hgroup>
+          :to="isEmptyBrief(project) ? project.uri + '/client-brief' : project.uri"
-        <h3>{{ project.title }}</h3>
+          class="link-full"
-        <p>
-          Dernière mise à jour le
-          <time :datetime="project.modified">{{
-            frenchFormattedModified
-          }}</time>
-        </p>
-      </hgroup>
-      <img :src="project.logo" alt="Logo" class="project-logo | rounded-sm" />
-      <ol
-        class="project-steps"
-        :data-steps="project.steps.length"
-        :style="'--steps:' + project.steps.length"
-      >
-        <li
-          v-for="step in project.steps"
-          class="project-step"
-          :data-status="setStatus(project.steps, project.currentStep, step)"
         >
-          <span class="pill" :data-icon="step.id">
+        {{ project.title }}
-            <span>{{ step.label }}</span>
+        </router-link>
-          </span>
+      </h3>
-        </li>
+      <p>
-      </ol>
+        Dernière mise à jour le
-    </article>
+        <time :datetime="project.modified">{{
-  </router-link>
+          frenchFormattedModified
+        }}</time>
+      </p>
+    </hgroup>
+    <img :src="project.logo" alt="Logo" class="project-logo | rounded-sm" />
+    <ol
+      class="project-steps"
+      :data-steps="project.steps.length"
+      :style="'--steps:' + project.steps.length"
+    >
+      <li
+        v-for="step in project.steps"
+        class="project-step"
+        :data-status="setStatus(project.steps, project.currentStep, step)"
+      >
+        <span class="pill" :data-icon="step.id">
+          <span>{{ step.label }}</span>
+        </span>
+      </li>
+    </ol>
+  </article>
 </template>
 
 <script setup>