diff --git a/help/view-the-markdown-source-of-a-message.md b/help/view-the-markdown-source-of-a-message.md index bb01188faf..5c9e242329 100644 --- a/help/view-the-markdown-source-of-a-message.md +++ b/help/view-the-markdown-source-of-a-message.md @@ -33,7 +33,7 @@ formatted, or to copy the Markdown source for a reply. menu option for editable messages that you have sent. 1. Click the **Copy and close** - ( copy) + () widget in the upper right corner of the message. !!! keyboard_tip "" diff --git a/static/images/help/copy_to_clipboard.svg b/static/images/help/copy_to_clipboard.svg deleted file mode 100644 index d14cdde6f9..0000000000 Binary files a/static/images/help/copy_to_clipboard.svg and /dev/null differ diff --git a/web/src/message_edit.ts b/web/src/message_edit.ts index b643b6c53c..5e32d57f72 100644 --- a/web/src/message_edit.ts +++ b/web/src/message_edit.ts @@ -449,9 +449,10 @@ function create_copy_to_clipboard_handler( }); clipboard.on("success", () => { - // Hide the Tippy and source box after a 600ms delay - const tippy_timeout_in_ms = 600; + // Hide the Tippy and source box after a 1000ms delay + const tippy_timeout_in_ms = 1000; show_copied_confirmation(the($row.find(".copy_message")), { + show_check_icon: true, timeout_in_ms: tippy_timeout_in_ms, on_hide_callback() { end_message_row_edit($row); diff --git a/web/styles/message_row.css b/web/styles/message_row.css index 376d70f4c4..d218799936 100644 --- a/web/styles/message_row.css +++ b/web/styles/message_row.css @@ -655,6 +655,7 @@ } .edit-content-container { + position: relative; border-radius: 4px; border: 1px solid var(--color-message-content-container-border); transition: border 0.2s ease; diff --git a/web/styles/zulip.css b/web/styles/zulip.css index e63050f45f..3c4274af98 100644 --- a/web/styles/zulip.css +++ b/web/styles/zulip.css @@ -632,18 +632,12 @@ li, } .copy_message { - float: right; - position: relative; - cursor: pointer; - top: 30px; - /* To make sure the svg doesn't occupy any vertical space. */ - margin-top: -30px; - right: 2px; - padding-top: 2px; - - #clipboard_image { - margin: 0; - } + position: absolute; + top: 5px; + right: 5px; + height: 1em; + backdrop-filter: blur(20px); + outline: 1px solid var(--color-copy-btn-square-bg-active); } #copy_generated_link_container { diff --git a/web/templates/copy_message_button.hbs b/web/templates/copy_message_button.hbs deleted file mode 100644 index 66682e9bae..0000000000 --- a/web/templates/copy_message_button.hbs +++ /dev/null @@ -1,3 +0,0 @@ -
- {{> copy_to_clipboard_svg }} -
diff --git a/web/templates/message_edit_form.hbs b/web/templates/message_edit_form.hbs index afa63af49b..0e9ac39fbd 100644 --- a/web/templates/message_edit_form.hbs +++ b/web/templates/message_edit_form.hbs @@ -4,7 +4,9 @@
- {{> copy_message_button message_id=this.message_id}} + + +