Code block should be easily copyable.

[iandunn]

Discussed in #6

^{Originally posted by StevenDufresne May 22, 2022}
Right now, if you copy the code block, you also copy the line numbers making it difficult to copy and paste code into your environment.

#6 (comment) has some implementation ideas

[StevenDufresne]

Huddle Chat Notes:

• Dion: Be cautious of not using current syntax plugin -> May lose important functionality
• If line numbers only exist on source code blocks, probably don't have to worry about copying line numbers, nobody really copies source code blocks anyways

Ideas:

• Maybe add a copy button?
  • If you click the button, should we have a copy confirmation? (Button copy change? Banner? Toast?)
• If the double click to turn code block into a <textarea> is only for selecting all content, or because of previous limitations in selecting code, try to turn that functionality off. We could replace the copy-all functionality with the "copy" button suggested above.

[iandunn]

If line numbers only exist on source code blocks, probably don't have to worry about copying line numbers, nobody really copies source code blocks anyways

It'd be nice to use the same "editor"/styles/etc throughout the dev site and handbooks, though.

If you click the button, should we have a copy confirmation? (Button copy change? Banner? Toast?)

💯 , otherwise I think a lot of people wouldn't feel confident that it worked. Changing the button text seems good, but maybe also change the button bg color, so folks don't miss it.

[ryelle]

With the switch in #44, the line numbers on code blocks are not selectable anymore:

Is that enough to mark this as fixed (assuming that PR is merged), or do we want to add in a copy function?

That could be a copy button to each code block, or convert to a textarea to manually copy. Personally I dislike the "switch to textarea" function, since it usually looses my highlight location, but there's also been feedback that some people edit the code in the textarea before copying it.

[iandunn]

I think having a copy button is nice. It remove several clicks, and gives folks the peace of mind that they won't accidentally miss part of the code, and won't have to deal with the kind of selection issues that #44 fixed.

I like the icon used at https://jestjs.io/docs/mock-function-api#mockfnmockcalls, but IMO it should always be visible (related #46)

I also dislike the "switch to textarea" technique.

[iandunn]

Even better than an icon, though, would be just Copy, like https://docs.docker.com/engine/api/v1.41/#operation/ContainerList