zulip/static/templates/copy_code_button.hbs

<button class="btn pull-left copy_button_base copy_codeblock" data-toggle="tooltip" title="{{t "Copy code" }}" aria-label="{{t "Copy code" }}">
    {{> copy_to_clipboard_svg }}
</button>
css: Extract copy_button_base from copy_codeblock class. The base class will contain common styling which is used by both copy_codeblock and copy_message buttons. This sets us up nicely for following commit(s) which aims to unify the two button styling. 2020-08-27 16:41:30 +02:00			`<button class="btn pull-left copy_button_base copy_codeblock" data-toggle="tooltip" title="{{t "Copy code" }}" aria-label="{{t "Copy code" }}">`
templates: Extract and tweak copy_to_clipboard_svg from both buttons. Since both the original button svg's have their own individual height and width, this commit tweaks it to values height=20 and width=16 which works well for both buttons. 2020-08-28 04:52:26 +02:00			`{{> copy_to_clipboard_svg }}`
markdown: Add copy-to-clipboard button in codeblocks. Clicking on the copy-to-clipboard button triggers the clipboard.js API to dynamically set the text to be copied. This text is the actual code content from the sibling <code> element (extracted though jQuery text() method). The html structure would now look like: <div class="codehilite"> <pre> <button> The copy button </button> <span></span> <code>......</code> </pre> </div> Additionally, this preserves the original code formatting of the codeblock during copy-paste. Tests amended. Fixes: #15208 2020-08-20 16:11:08 +02:00			`</button>`