Skip to content

feat: add copy button for code blocks#186

Open
Yatharth-coding wants to merge 1 commit intoCollaboraOnline:masterfrom
Yatharth-coding:feature/copy-code-button
Open

feat: add copy button for code blocks#186
Yatharth-coding wants to merge 1 commit intoCollaboraOnline:masterfrom
Yatharth-coding:feature/copy-code-button

Conversation

@Yatharth-coding
Copy link
Copy Markdown

What this PR does

Adds a copy-to-clipboard button for all code blocks across the website.

Details

  • Automatically adds a copy button to <pre><code> blocks
  • Uses the modern Clipboard API
  • Provides visual feedback on successful copy
  • Does not affect existing layout or content

Testing

  • Tested locally using hugo server
  • Verified copy functionality on multiple pages with code blocks

Copy link
Copy Markdown
Contributor

@Darshan-upadhyay1110 Darshan-upadhyay1110 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @Yatharth-coding,

Welcome to the community, and thank you for implementing the copy code feature. It is a much needed improvement.

I think we can refine it a bit further. Could you please take a look at the behavior shown in the video and see if we can adjust it accordingly?

Also, in a few cases the icon overlaps with the content. Maybe we could slightly reduce the icon size, or explore another approach to prevent overlapping. I am open to suggestions, as long as the content remains clearly visible.

Looking forward to your thoughts.

Image
Screencast.from.2026-02-18.18-19-34.webm

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.

2 participants