From 1456a67ca58dc7c5d4da0509c57649b26d48aa78 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Mon, 31 Jul 2023 11:50:43 -0300 Subject: css: fix image sizing inside grid items --- src/content/dependencies/image.js | 2 +- src/static/site4.css | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/content/dependencies/image.js b/src/content/dependencies/image.js index 45379629..24c91d0f 100644 --- a/src/content/dependencies/image.js +++ b/src/content/dependencies/image.js @@ -157,7 +157,7 @@ export default { let wrapped = content; wrapped = - html.tag('div', {class: 'image-container'}, + html.tag('div', {class: ['image-container', !originalSrc && 'placeholder-image']}, html.tag('div', {class: 'image-inner-area'}, wrapped)); diff --git a/src/static/site4.css b/src/static/site4.css index b4e23cf2..b92d088c 100644 --- a/src/static/site4.css +++ b/src/static/site4.css @@ -553,6 +553,11 @@ a.box img { height: auto; } +a.box .image-container.placeholder-image { + width: 100%; + height: 100%; +} + h1 { font-size: 1.5em; } @@ -871,7 +876,7 @@ img { .grid-item img { width: 100%; - height: 100%; + height: 100% !important; margin-top: auto; margin-bottom: auto; } -- cgit 1.3.0-6-gf8a5