Grid listing ignores image-height, so thumbnails render at full size
维护者通常 1 天内回复
还没有人认领这个 Issue。
评估
调研方向
首先追踪网格列表如何渲染 image 字段,以及列表的 image-height 选项如何传递到该渲染路径;payload 未指出实现文件或测试。将默认高度和显式高度情况下生成的缩略图标记与 Quarto 1 示例进行比较。完成标准是两种情况下都应用预期的高度和 card-img 类,且不更改源图像。
由索引模型根据 Issue 内容生成。
描述
Summary
In a grid listing, q2 ignores image-height. Quarto 1 gives each thumbnail an inline height (150px by default, or the image-height value) and the class card-img. q2 gives neither, so a large image shows at its full size. In our site, the thumbnails overlapped the next cards and made the page about 2,000px wide.
Versions
- q2 0.44.0-nightly.20261110
- Quarto 1.10.18 (expected output)
- macOS, arm64
Repro
_quarto.yml:
project:
type: website
render:
- "*.qmd"
- "posts/*.md"
default.qmd:
---
title: Default height
listing:
contents: "posts/*.md"
type: grid
fields: [image, title]
---
explicit.qmd:
---
title: Explicit height
listing:
contents: "posts/*.md"
type: grid
image-height: 100px
fields: [image, title]
---
posts/alpha.md, with posts/wide.png as any large image (we used 1600x1000):
---
title: "Alpha"
image: wide.png
---
Text.
Command:
q2 render
Expected (Quarto 1)
<!-- default.html -->
<img loading="lazy" src="./posts/wide.png" class="thumbnail-image card-img" style="height: 150px;">
<!-- explicit.html -->
<img loading="lazy" src="./posts/wide.png" class="thumbnail-image card-img" style="height: 100px;">
Actual (q2)
<!-- default.html -->
<img src="posts/wide.png" class="thumbnail-image" alt="" loading="lazy">
<!-- explicit.html -->
<img src="posts/wide.png" class="thumbnail-image" alt="" loading="lazy">
There is no warning.
Workaround
A stylesheet rule on the listing page:
.quarto-grid-item .card-img-top img.thumbnail-image {
height: 150px;
width: 100%;
object-fit: cover;
}
- 主要语言
- Rust
- 星标
- 302
- 派生
- 22
- 平均合并
- 5 小时 6 分钟
- 30 天内合并 PR
- 207
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 没有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
quarto-dev/q2 的其他 Issue
-
难度 1/5 1 小时以内 新手友好度 88/100
quarto-dev/q2#1135 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 82/100
quarto-dev/q2#1133 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 76/100
quarto-dev/q2#1103 · 1 条评论 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 75/100
quarto-dev/q2#1095 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 77/100
quarto-dev/q2#1031 ·
维护者通常 1 天内回复
相似的 Issue
-
难度 1/5 1 小时以内 新手友好度 94/100
维护者通常 1 天内回复
-
bug
难度 2/5 1-3 小时 新手友好度 65/100
维护者通常 2 天内回复
-
enhancement good first issue help wanted
难度 2/5 1-3 小时 新手友好度 78/100
维护者通常 1 天内回复
-
area:ui
难度 2/5 1-3 小时 新手友好度 78/100
openfootmanager/openfootmanager#1365 ·
维护者通常 1 天内回复
-
documentation
难度 1/5 1-3 小时 新手友好度 90/100
JackMechem/marbble#305 ·
维护者通常 1 天内回复