From 7cef5acc3a9c957715e0fa47997f2a564e957b48 Mon Sep 17 00:00:00 2001 From: Claude Date: Wed, 11 Feb 2026 07:34:03 +0000 Subject: [PATCH 1/2] Fix example card footer height to be equal across cards in a row Use flexbox column layout on .example-card so the .example-info footer stretches to fill remaining space, ensuring consistent footer heights when cards share a grid row. https://claude.ai/code/session_01TnyFFkSnyusuY8ZAP1pWN2 --- site/css/style.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/site/css/style.css b/site/css/style.css index 6935ee3..f10281a 100644 --- a/site/css/style.css +++ b/site/css/style.css @@ -271,7 +271,8 @@ main { } .example-card { - display: block; + display: flex; + flex-direction: column; background: var(--color-card-bg); border: 1px solid var(--color-border); border-radius: 10px; @@ -294,6 +295,7 @@ main { } .example-info { + flex: 1; padding: 1.25rem; } From f56d87cc4ae00ccf15c14c88628e366f57068eba Mon Sep 17 00:00:00 2001 From: Claude Date: Wed, 11 Feb 2026 07:48:27 +0000 Subject: [PATCH 2/2] Fix card image height with fixed size and object-fit cover Give example card images a fixed 220px height with object-fit: cover so both cards have identically sized image areas. Uses object-position: top to show the top of each screenshot. https://claude.ai/code/session_01TnyFFkSnyusuY8ZAP1pWN2 --- site/css/style.css | 3 +++ 1 file changed, 3 insertions(+) diff --git a/site/css/style.css b/site/css/style.css index f10281a..93cc9d3 100644 --- a/site/css/style.css +++ b/site/css/style.css @@ -290,6 +290,9 @@ main { .example-card img { width: 100%; + height: 220px; + object-fit: cover; + object-position: top; display: block; border-bottom: 1px solid var(--color-border); }