From 9244ad0666c4859569801508348fa83c6e4648f4 Mon Sep 17 00:00:00 2001 From: "Danilo M." Date: Fri, 26 Jun 2026 17:57:30 +0200 Subject: fix: row thumbnail cell is 3:2 landscape, holds its own aspect ratio Was stretching to body height via items-stretch; give the image cell aspect-[3/2] and self-start so a 3:2 thumbnail displays at its intended ratio instead of being cropped to the row height. --- assets/css/main.min.css | 43 +++++++++++++++++++-------------------- layouts/partials/project-row.html | 2 +- 2 files changed, 22 insertions(+), 23 deletions(-) diff --git a/assets/css/main.min.css b/assets/css/main.min.css index 44735f9..048b8e7 100644 --- a/assets/css/main.min.css +++ b/assets/css/main.min.css @@ -1648,11 +1648,6 @@ button, /* Legacy type-* classes for compatibility (with badge styling) */ -.type-tech { - color: var(--type-tech); - background-color: rgba(168, 85, 247, 0.1); -} - .type-life { color: var(--type-life); background-color: rgba(245, 158, 11, 0.1); @@ -1663,6 +1658,11 @@ button, background-color: rgba(0, 255, 136, 0.1); } +.type-link { + color: var(--type-link); + background-color: rgba(56, 189, 248, 0.1); +} + /* Card component */ .card { @@ -2460,6 +2460,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { margin-left: 0.5rem; } +.ml-auto { + margin-left: auto; +} + .mt-0\.5 { margin-top: 0.125rem; } @@ -2546,6 +2550,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { display: none; } +.aspect-\[3\/2\] { + aspect-ratio: 3/2; +} + .aspect-video { aspect-ratio: 16 / 9; } @@ -2554,10 +2562,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { height: 0.25rem; } -.h-24 { - height: 6rem; -} - .h-3 { height: 0.75rem; } @@ -2602,10 +2606,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { max-height: 24rem; } -.min-h-\[10rem\] { - min-height: 10rem; -} - .min-h-\[calc\(100vh-200px\)\] { min-height: calc(100vh - 200px); } @@ -2622,10 +2622,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { width: 5rem; } -.w-24 { - width: 6rem; -} - .w-3 { width: 0.75rem; } @@ -2856,6 +2852,10 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); } +.self-start { + align-self: flex-start; +} + .overflow-hidden { overflow: hidden; } @@ -2987,11 +2987,6 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay { background-color: var(--surface); } -.object-contain { - -o-object-fit: contain; - object-fit: contain; -} - .object-cover { -o-object-fit: cover; object-fit: cover; @@ -5279,6 +5274,10 @@ html.theme-light .hero-name { height: 12rem; } + .md\:h-64 { + height: 16rem; + } + .md\:w-1\/3 { width: 33.333333%; } diff --git a/layouts/partials/project-row.html b/layouts/partials/project-row.html index 5a65f35..7a1e209 100644 --- a/layouts/partials/project-row.html +++ b/layouts/partials/project-row.html @@ -24,7 +24,7 @@
-