Skip to content

Horizontally scrollable code blocks for mdfx#101

Open
Dansoftowner wants to merge 7 commits intoJPro-one:mainfrom
Dansoftowner:scrollable-codeblocks
Open

Horizontally scrollable code blocks for mdfx#101
Dansoftowner wants to merge 7 commits intoJPro-one:mainfrom
Dansoftowner:scrollable-codeblocks

Conversation

@Dansoftowner
Copy link
Copy Markdown
Contributor

Overview

This PR adds optional horizontally scrollable Markdown code blocks to jpro-mdfx.

Sometimes wrapping source code makes it harder to read, especially when line structure, indentation, or long expressions are important for understanding the code. This change adds an optional scrollable mode for Markdown code blocks, allowing code to keep its original horizontal layout while still fitting cleanly inside the Markdown view.

Code blocks keep the existing wrapping behavior by default. A new styleable property, -mdfx-scrollable, enables the new behavior:

.markdown-code-block {
    -mdfx-scrollable: true;
}

Changes

  • Added a styleable -mdfx-scrollable boolean property to MarkdownCodeBlock.
  • Wrapped code content in a ScrollPane only when scrolling is enabled.
  • Preserved the existing non-scrollable implementation as the default.
  • Prevented code wrapping in scrollable mode by allowing horizontal overflow.
  • Kept TextMate theme backgrounds visually consistent across the scroll area.
  • Updated MDFX CSS so the outer scroll pane owns the frame styling in scrollable mode.

Sreenshots

Without horizontal scroll (-mdfx-scrollable: false;):
image

With horizontal scroll (-mdfx-scrollable: true;):
image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant