Skip to content

Add click-to-copy for fenced code blocks#4

Open
bganesh wants to merge 1 commit intoJackYoung27:mainfrom
bganesh:click-to-copy
Open

Add click-to-copy for fenced code blocks#4
bganesh wants to merge 1 commit intoJackYoung27:mainfrom
bganesh:click-to-copy

Conversation

@bganesh
Copy link
Copy Markdown

@bganesh bganesh commented Apr 21, 2026

Clicking any fenced code block in the preview now copies its content to the clipboard.

Changes:

  • Each <pre><code> block is decorated with a code-block--copyable class, a role="button", and keyboard support (Enter/Space) for accessibility
  • Labels "Click to copy" / "Copied" / "Copy failed" indicate status on hover / click
  • Outline appears on hover/focus to indicate interactivity
  • Selection-aware: clicking while text is selected inside the block does nothing, so normal text selection still works
  • The copy label is hidden on print (@media print)

Ensured CSS won't clash if other PRs are accepted. .document pre.code-block--copyable::after can be merged with with previous entry for display: none;

Fixes #9

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.

Feature: Add click-to-copy for fenced code blocks

2 participants