Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

Revealjs: code block at the end of a callout lost its bottom spacing since 1.8.15

未关闭 适合新手
#15,014 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
72/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
html, scss
领域
frontend

调研方向

这两条规则位于 src/resources/formats/revealjs/quarto.scss 的第 919-926 行和第 975-977 行附近,它们匹配最后一个 div.sourceCode,但不匹配 HTML 后处理器添加的 div.code-copy-outer-scaffold 包装元素(参见 src/format/reveal/format-reveal.ts 第 260 行附近)。渲染一个 revealjs 幻灯片,其中的 callout 以代码块结尾,然后在浏览器中检查代码下方的间距。完成的标准是:两个选择器也都能匹配作为最后一个子元素的 scaffold,并且两种 callout 类型的间距都与 1.7.34 一致。

由索引模型根据 Issue 内容生成。

描述

bug callouts regression revealjs

In Revealjs, when a code block is the last element of a callout, it now sits against the bottom of the callout. With appearance="simple" and no title, the code block border touches the callout border.

Gap between the bottom of the code block and the bottom of the callout, measured with Chromium on the example below:

Callout 1.7.34 main
Default, titled, ending with code 12.03px 8.33px
Simple, untitled, ending with code 15.74px 0.93px

The 0.93px is only the 1px callout border. Callouts ending with a paragraph render the same in both versions.

#13024 is first released in 1.8.15, so I expect the change to start there. I only rendered with 1.7.34 and main, not with 1.8.14 or 1.8.15.

Reproducible example

---
title: Callout last child code
format: revealjs
---

## Titled ending with code

::: {.callout-note}
## Titled

Some text.

```python
x = 1
```
:::

## Simple untitled ending with code

::: {.callout-note appearance="simple"}
Some text.

```python
x = 1
```
:::

What happens

Since #13024, the HTML postprocessor wraps code blocks in a div.code-copy-outer-scaffold for the copy button. Revealjs uses the same postprocessor with copyCode: true:

https://github.com/quarto-dev/quarto-cli/blob/e63ace9e50f55dd3ab3152d068738ed44a0987d0/src/format/reveal/format-reveal.ts#L260

So the last child of .callout-content is now the scaffold div and not div.sourceCode. Two rules added in #11251 to handle a code block in last position no longer match.

For simple untitled callouts, #11251 added a margin below a last div.sourceCode so that the code border does not merge with the callout border. This rule never matches now, which is the visible part:

https://github.com/quarto-dev/quarto-cli/blob/e63ace9e50f55dd3ab3152d068738ed44a0987d0/src/resources/formats/revealjs/quarto.scss#L975-L977

For titled callouts, the last child gets padding-bottom: 0.5rem and no margin, except when it is a div.sourceCode, which keeps the var(--r-block-margin) margin. This exclusion was there to avoid the duplicated background color on a code block in last position. The scaffold is not excluded, so it gets the 8px padding instead of the 12px margin. This one is more cosmetic.

https://github.com/quarto-dev/quarto-cli/blob/e63ace9e50f55dd3ab3152d068738ed44a0987d0/src/resources/formats/revealjs/quarto.scss#L919-L926

We could make both selectors also target div.code-copy-outer-scaffold when it is the last child.

Related: #13446 and #13238 are about the same scaffold change on HTML callouts, which use different rules in the Bootstrap stylesheets.

主要语言
JavaScript
星标
6.1k
派生
463
平均合并
21 小时 10 分钟
30 天内合并 PR
61

环境准备

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

quarto-dev/quarto-cli 的其他 Issue

查看 quarto-dev/quarto-cli 的全部 Issue

相似的 Issue

更多 JavaScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。