From 4dfbb262c60a9b14bc533f817b273d9905ebc637 Mon Sep 17 00:00:00 2001 From: Eltrac Date: Fri, 30 May 2025 15:52:05 +0800 Subject: feat: better image style - centered image - rounded image - hide redundant `

` tag unexpectedly rendered in `{{< gallery >}}` - prettier SCSS code --- assets/css/components/_markdown.scss | 14 ++++++-------- assets/css/components/_shortcodes.scss | 25 ++++++++++++------------- 2 files changed, 18 insertions(+), 21 deletions(-) diff --git a/assets/css/components/_markdown.scss b/assets/css/components/_markdown.scss index 0cb8bb9e..71a99edb 100644 --- a/assets/css/components/_markdown.scss +++ b/assets/css/components/_markdown.scss @@ -114,18 +114,16 @@ $em-text-color: #889E73; img { max-width: 100%; display: block; - margin-right: auto; - margin-top: 6px; + margin: 1rem auto; } figure { margin: 0; - } - - figure figcaption h4 { - font-size: 0.9rem; - color: var(--secondary-text-color); - font-weight: 400; + figcaption h4 { + font-size: 0.9rem; + color: var(--secondary-text-color); + font-weight: 400; + } } ul { diff --git a/assets/css/components/_shortcodes.scss b/assets/css/components/_shortcodes.scss index 92ed9fbf..f61295ed 100644 --- a/assets/css/components/_shortcodes.scss +++ b/assets/css/components/_shortcodes.scss @@ -138,21 +138,20 @@ a.blog-link img { scroll-behavior: smooth; gap: 1rem; white-space: nowrap; + & > figure { + display: inline-block; + margin: 0; + flex-shrink: 0; + img { + height: 20rem; + object-fit: cover; + display: block; + border-radius: 4px; + } + } + & > p { display: none } } -.inline-image > figure { - display: inline-block; - margin: 0; - flex-shrink: 0; -} - -.inline-image > figure img { - height: 20rem; - object-fit: cover; - display: block; -} - - /* gallery */ .gallery-img { -- cgit v1.2.3