Fix squashed Mermaid diagrams in markdown preview - #61260
Merged
ChristopherBiscardi merged 2 commits intoJul 24, 2026
Merged
Conversation
Wide diagrams were forced through max_w_full, so height shrank with width and text became unreadable. When code_block_overflow_x_scroll is enabled (markdown preview), keep the raster at intrinsic size and allow horizontal scroll, matching fenced code blocks. Compact UIs still fit to pane. Fixes zed-industries#61051
|
We require contributors to sign our Contributor License Agreement, and we don't have @atharvaajmera on file. You can sign our CLA at https://zed.dev/cla. Once you've signed, post a comment here that says '@cla-bot check'. |
Contributor
Author
|
@cla-bot check |
|
The cla-bot has been summoned, and re-checked this pull request! |
Contributor
|
please add screenshots for visual changes |
…agram scroll state Gives each mermaid diagram's horizontal-scroll container a stable id so scroll position doesn't get shared/reset across multiple diagrams in one document. Also trims comment verbosity from the prior commit.
Contributor
Author
|
Added screenshots showing the fix in action, using the diagram from this issue's original report. Before (current After (this PR - diagram renders at intrinsic size with pan/scroll, matching fenced code block behavior): |
ChristopherBiscardi
approved these changes
Jul 24, 2026
ChristopherBiscardi
left a comment
Contributor
There was a problem hiding this comment.
This makes sense to me as without it wider mermaid diagrams are unreadably small with no bailout to open them any other way.
mdz-axo
added a commit
to mdz-axo/zed-kask
that referenced
this pull request
Jul 25, 2026
Upstream changes (zed-industries/zed main, 27 commits): - agent: Add agent.compaction_model setting for context compaction (zed-industries#60012) - agent: Show effort selector for anthropic compatible providers (zed-industries#61579) - acp: Update agent-client-protocol SDK to 2.0.0 (zed-industries#61570) - client: Extract proxy handshakes into new proxy_handshake crate (zed-industries#61427) - collab: Fix multiworkspace location out of sync bugs (zed-industries#61598) - editor: Fix sticky header drag cancels autoscroll (zed-industries#53592) - editor: Fix crash when copying and pasting using multiple cursors (zed-industries#61545) - editor: Skip untitled buffers when saving a multi-buffer (zed-industries#61380) - gpui: Fix images not being drawn with rounded corners with ObjectFit::Cover (zed-industries#61383) - gpui: Fix deadlock in performance profiler and reenable it (zed-industries#61584) - git_ui: Prevent Git panel bindings in repository selector (zed-industries#61282) - language_model: Add explicit OpenAI conversation compaction and fix Anthropic compaction (zed-industries#61370) - markdown: Fix squashed Mermaid diagrams in markdown preview (zed-industries#61260) - Opus 5 BYOK Support (zed-industries#61596) - repl: Show add-cell controls in empty notebooks (zed-industries#61329) - search: Escape seeded buffer search query in regex mode (zed-industries#57748) - settings: Fix VS Code import appending duplicate file associations (zed-industries#61355) - settings: Split VSCode and Zed keymap files (zed-industries#61532) - Treat blank spawn_agent session IDs as absent (zed-industries#60893) - worktree: Reload git state when a watcher rescan covers a repository (zed-industries#61541) - Plus 7 more minor fixes. Merge fixes: - crates/agent/src/thread.rs: replay_tool_call used 'message_ix' (undefined) after auto-merge; renamed to 'owning_message_ix' (the parameter name). - Cargo.toml: Removed stale workspace members hkask-wallet and hkask-git-cas (both directories deleted in prior commits but workspace entries remained). - kask/crates/hkask-regulation/src/wallet_manager.rs: Stubbed consume() and settle_rjoules() on WalletBudgetPort — these were API-key encumbrance operations from the deleted hkask-wallet crate; regulation tracks per-agent gas balances, not per-key encumbrances. - kask/crates/hkask-regulation/src/wallet_gas_calibrator.rs: Fixed test to use crate::agent_wallet_store::WalletStore instead of hkask_storage::WalletStore. - kask/crates/hkask-regulation/Cargo.toml: Added tokio macros feature to dev-dependencies for #[tokio::test]. - kask/crates/kask_bridge/Cargo.toml: Added futures dependency (needed by context_injector.rs for futures::executor::block_on). - kask/crates/kask_bridge/src/context_injector.rs: Fixed futures_util::executor to futures::executor (futures-util doesn't include executor module). Release Notes: - N/A
jolutz
pushed a commit
to jolutz/zed
that referenced
this pull request
Aug 8, 2026
## Summary Wide Mermaid diagrams in Markdown Preview were forced through `max_w_full()`, so both width and height shrank to the pane and text became unreadable/blurry. There was no horizontal pan. Markdown Preview already sets `code_block_overflow_x_scroll: true` for fenced code blocks. Mermaid ignored that flag. This change gates layout on that style flag: - **Preview** (`code_block_overflow_x_scroll`): keep the raster at intrinsic size and enable `overflow_x_scroll` (with `restrict_scroll_to_axis`) so wide diagrams stay readable and can be panned horizontally. - **Compact UIs** (e.g. agent): keep previous `max_w_full()` fit-to-pane behavior. Fixes zed-industries#61051 ## Test plan - [ ] Open a markdown file with a wide ` ```mermaid ` flowchart (e.g. multi-column TB graph) in Markdown Preview - [ ] Confirm diagram is not crushed to pane width; text remains legible at default scale - [ ] Confirm horizontal scroll/pan works on the diagram without stealing vertical page scroll - [ ] Confirm compact surfaces that leave `code_block_overflow_x_scroll` off still fit diagrams to width - [ ] Confirm mermaid scale fence info still works (` ```mermaid 150 `) - [ ] Confirm Preview/Code tabs and copy button still work --- Release Notes: - Fixed wide Mermaid diagrams in Markdown Preview being squashed and illegible
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Wide Mermaid diagrams in Markdown Preview were forced through
max_w_full(), so both width and height shrank to the pane and text became unreadable/blurry. There was no horizontal pan.Markdown Preview already sets
code_block_overflow_x_scroll: truefor fenced code blocks. Mermaid ignored that flag.This change gates layout on that style flag:
code_block_overflow_x_scroll): keep the raster at intrinsic size and enableoverflow_x_scroll(withrestrict_scroll_to_axis) so wide diagrams stay readable and can be panned horizontally.max_w_full()fit-to-pane behavior.Fixes #61051
Test plan
```mermaidflowchart (e.g. multi-column TB graph) in Markdown Previewcode_block_overflow_x_scrolloff still fit diagrams to width```mermaid 150)Release Notes: