search

rothsandro / eleventy-notes

A template for Eleventy to publish your personal notes or docs.
https://eleventy-notes.sandroroth.com/
138 stars 16 forks source link

Add code copy buttons #34

Closed uncenter closed 1 year ago

uncenter commented 1 year ago

I added this as just a script to my own Eleventy Notes instance a while back, see: https://github.com/uncenter/learn-eleventy/commit/6ab3da21c882922731f0d41521c9c935e98ba132

Probably not the best approach, I'm curious as to what you come up with. Since the script is in a template, we could use the existing shortcode for adding SVGs instead of manually having those SVG strings. The buttons are designed after GitHub's buttons in Markdown files, and I think it works quite well (though it can be hard to see in light mode?).

rothsandro commented 1 year ago

Sorry for my late response, I took a break from coding.

Good idea to add a copy button. The button can be added when processing the markdown content (via markdown-it) to reduce client-side JS and the copy action can be handled using Alpine.

uncenter commented 1 year ago

Sorry for my late response, I took a break from coding.

Good idea to add a copy button. The button can be added when processing the markdown content (via markdown-it) to reduce client-side JS and the copy action can be handled using Alpine.

Sounds good!

uncenter commented 1 year ago

I was a little worried I would have trouble updating because of my customizations but it worked perfectly! Well thought out solution, looks great. Thank you!

rothsandro commented 1 year ago

Thanks, glad you like it 👍