Dashboard: inactive light/dark navbar logo remains an empty focusable link
维护者通常 1 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 2/5
- 预计耗时
- 1-3 小时
- 新手友好度
- 78/100
- Issue 类型
- 缺陷
- 描述清晰度
- 描述清楚
- 活跃度
- 冷清
- 技术栈
- css, html
调研方向
先从 src/resources/formats/dashboard/_nav-container.html 和 src/resources/formats/html/_quarto-rules.scss 开始,然后使用 axe 输出渲染所提供的 dashboard 复现。确保非活动主题变体隐藏其整个 logo link,从而在两种主题状态下都只保留一个可聚焦且有名称的 logo link,并且不存在 axe link-name 违规。
由索引模型根据 Issue 内容生成。
描述
I have:
- searched the issue tracker for similar issues
- installed the latest version of Quarto CLI
- formatted my issue following the Bug Reports guide
Bug description
A format: dashboard navbar logo is always rendered twice — a light-theme and a dark-theme copy, even when the author supplies a single logo: path (_nav-container.html#L3-L4). The theme CSS then hides the inactive copy — but the light-content/dark-content class sits on the <img>, not the wrapping <a>, and the hiding rules only match the image (_quarto-rules.scss#L765-L774).
So in every theme state the inactive logo's <a href="#"> remains rendered at 0×0: still in the keyboard tab order, exposed to assistive technology as a link with an empty accessible name (its only content is display: none, so it contributes nothing to name computation), and flagged by axe-core link-name (serious → WCAG 2.2 SC 2.4.4 Link Purpose (In Context)) — even when the author sets logo alt text. Keyboard and screen-reader users hit two consecutive logo links on every dashboard page, one of them invisible and unnamed.
The fix direction: put the visibility class on the <a> (or render the anchor conditionally), so hiding the theme variant removes the whole link from the tab order and accessibility tree. Authors can approximate this today with body.quarto-light .navbar-brand-container a:has(> .navbar-logo.dark-content) { display: none !important; } (and the quarto-dark/light-content mirror) — verified to leave one named logo tab stop and zero axe violations — but that shouldn't be required.
An AI assistant helped investigate, grounded in a local clone of quarto-cli (source pinned to 8577ed1c6), per CONTRIBUTING.md.
Steps to reproduce
---
title: "Logo repro"
format:
dashboard:
axe:
output: document
logo:
path: logo.png
alt: "Washington County, Oregon"
---
# Page one
## Row
Content.
quarto renderwith any smalllogo.pngalongside, and open the result in a browser.- Press
Tabfrom the top of the page, or run axe DevTools.
Actual behavior
Rendered navbar (both links always present):
<a href="#"><img src="logo.png" alt="Washington County, Oregon" class="navbar-logo light-content d-inline-block"></a>
<a href="#"><img src="logo.png" alt="Washington County, Oregon" class="navbar-logo dark-content d-inline-block"></a>
With body.quarto-light, the second link's <img> is display: none but the <a> computes to display: block at 0×0. Verified via CDP (Chrome 150) in both body.quarto-light and body.quarto-dark, with a single logo and with an explicit light:/dark: pair:
- Tab order:
navbar-toggler → logo link (light) → logo link (dark) → …— two logo stops, one invisible. - Accessibility tree: visible link
name="Washington County, Oregon"; inactive link exposed aslink, name="".
Axe-core:
Serious · WCAG 2.0 A (2.4.4, 4.1.2): Ensure links have discernible text
Links must have discernible text
a[href="#"]:nth-child(2)
Expected behavior
Only the active theme's logo link is focusable and exposed to assistive technology — one logo tab stop, no link-name violation. E.g. the light-content/dark-content class on the <a> so the existing hiding rules remove the whole link.
Your environment
- IDE: n/a (rendered from the command line; behavior is browser-side)
- OS: macOS 26.5.1 (build 25F80)
- Browsers checked: Chrome 150 (headless, CDP accessibility tree + simulated Tab)
Quarto check output
Quarto 1.10.12
[✓] Checking environment information...
Quarto cache location: /Users/charlottewickham/Library/Caches/quarto
[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.8.3: OK
Dart Sass version 1.87.0: OK
Deno version 2.7.14: OK
Typst version 0.14.2: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 1.10.12
Path: /Applications/quarto/bin
[✓] Checking tools....................OK
TinyTeX: v2026.04
Chrome Headless Shell: 150.0.7871.115
VeraPDF: 1.28.2
[✓] Checking LaTeX....................OK
Using: TinyTex
Path: /Users/charlottewickham/Library/TinyTeX/bin/universal-darwin
Version: 2026
[✓] Checking Chrome Headless....................OK
Using: Chrome Headless Shell installed by Quarto
Path: /Users/charlottewickham/Library/Application Support/quarto/chrome-headless-shell/chrome-headless-shell-mac-arm64/chrome-headless-shell
Version: 150.0.7871.115
[✓] Checking basic markdown render....OK
[✓] Checking R installation...........OK
Version: 4.6.0
[✓] Checking Knitr engine render......OK
[✓] Checking Python 3 installation....OK
Version: 3.12.2
[✓] Checking Jupyter engine render....OK
[✓] Checking Julia installation...
- 主要语言
- JavaScript
- 星标
- 6.1k
- 派生
- 466
- 平均合并
- 20 小时 28 分钟
- 30 天内合并 PR
- 64
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
quarto-dev/quarto-cli 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 60/100
quarto-dev/quarto-cli#15042 ·
维护者通常 1 天内回复
-
accessibility documentation revealjs
难度 2/5 1-3 小时 新手友好度 86/100
quarto-dev/quarto-cli#14971 ·
维护者通常 1 天内回复
-
accessibility revealjs
难度 2/5 1-3 小时 新手友好度 88/100
quarto-dev/quarto-cli#14970 · 1 条评论 ·
维护者通常 1 天内回复
-
accessibility revealjs themes
难度 2/5 1-3 小时 新手友好度 78/100
quarto-dev/quarto-cli#14963 ·
维护者通常 1 天内回复
-
accessibility revealjs themes
难度 1/5 1 小时以内 新手友好度 88/100
quarto-dev/quarto-cli#14962 ·
维护者通常 1 天内回复
查看 quarto-dev/quarto-cli 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 62/100
extendr/extendr.github.io#134 ·
-
OpenCode install copies the Pi harness directory (`.pi/`) into the OpenCode config root可能已有人在做 @gaurav0107 今天认领。 未关闭
难度 2/5 1-3 小时 新手友好度 75/100
维护者通常 3 天内回复
-
难度 2/5 1-3 小时 新手友好度 70/100
NaturalIntelligence/fast-xml-parser#890 · 1 条评论 ·
维护者通常 3 天内回复
-
Docs viewer: inverted grey colormap, Phantom CT window -20 to 35 HU, smoothing up to 40 mm可能已有人在做 关联的 PR 仍在进行中或已合并。 未关闭area: docs enhancement
难度 2/5 1-3 小时 新手友好度 64/100
PyTomography/PyTomography#331 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 68/100
pnpm/get.pnpm.io#68 ·