From a0b39ca549d0f420b4f20144907b1309b62685da Mon Sep 17 00:00:00 2001
From: Valentin Maerten <maerten.valentin@gmail.com>
Date: Sun, 30 Aug 2026 14:22:59 +0200
Subject: [PATCH] fix(site): align the homepage panels and cards without fixed
 heights

The two code panels and the three journey cards were lined up with
min-height: 420px and min-height: 5.1rem, which break as soon as a
paragraph gains a line. Let the grid stretch the panels and push each
card's link list down with margin-top: auto instead.
---
 website/.vitepress/components/HomePage.vue | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/website/.vitepress/components/HomePage.vue b/website/.vitepress/components/HomePage.vue
index 9c2d993a..18a5fe94 100644
--- a/website/.vitepress/components/HomePage.vue
+++ b/website/.vitepress/components/HomePage.vue
@@ -353,7 +353,7 @@ function track(event: string) {
 }
 
 .code-panel :deep(pre) {
-  min-height: 420px;
+  flex: 1;
   min-width: 0;
   margin: 0;
   overflow: auto;
@@ -404,6 +404,8 @@ function track(event: string) {
 
 .path-grid article {
   position: relative;
+  display: flex;
+  flex-direction: column;
   min-width: 0;
   padding: 1.5rem;
   border: 1px solid var(--vp-c-divider);
@@ -425,7 +427,6 @@ function track(event: string) {
 }
 
 .path-grid p {
-  min-height: 5.1rem;
   margin: 0.75rem 0 1rem;
   color: var(--vp-c-text-2);
   font-size: 0.9rem;
@@ -435,7 +436,7 @@ function track(event: string) {
 .path-grid ul {
   display: grid;
   gap: 0.55rem;
-  margin: 0;
+  margin: auto 0 0;
   padding: 1rem 0 0;
   border-top: 1px solid var(--vp-c-divider);
   list-style: none;
@@ -468,14 +469,6 @@ function track(event: string) {
     border-top: 1px solid var(--vp-c-divider);
     border-left: 0;
   }
-
-  .code-panel :deep(pre) {
-    min-height: auto;
-  }
-
-  .path-grid p {
-    min-height: 0;
-  }
 }
 
 @media (max-width: 560px) {