From 886d8c1cab48ba9d09e722f0245309505b2f0fc6 Mon Sep 17 00:00:00 2001
From: Marshall Bowers <git@maxdeviant.com>
Date: Tue, 4 Mar 2025 17:44:29 -0500
Subject: [PATCH] markdown: Ensure code block copy button stays in the right
 spot (#26074)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This PR makes it so the copy button on Markdown code blocks stays
absolutely positioned even when scrolled:

<img width="1297" alt="Screenshot 2025-03-04 at 5 28 48 PM"
src="https://github.com/user-attachments/assets/b0d0fae9-ccd6-43c1-bef3-44d8d3c3e669"
/>

We achieve this by inserting a new parent element around both the copy
button and the code block itself so we can position the copy button
absolutely within that element.

Release Notes:

- N/A
---
 crates/markdown/src/markdown.rs | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/crates/markdown/src/markdown.rs b/crates/markdown/src/markdown.rs
index c160b647cb31e176537741948cf7ff48d5129f5c..e8313ea91282f4f66b01557302e9de3c4f8e143c 100644
--- a/crates/markdown/src/markdown.rs
+++ b/crates/markdown/src/markdown.rs
@@ -611,6 +611,9 @@ impl Element for MarkdownElement {
                                 None
                             };
 
+                            // This is a parent container that we can position the copy button inside.
+                            builder.push_div(div().relative().w_full(), range, markdown_end);
+
                             let mut code_block = div()
                                 .id(("code-block", range.start))
                                 .rounded_lg()
@@ -750,6 +753,12 @@ impl Element for MarkdownElement {
                     MarkdownTagEnd::CodeBlock => {
                         builder.trim_trailing_newline();
 
+                        builder.pop_div();
+                        builder.pop_code_block();
+                        if self.style.code_block.text.is_some() {
+                            builder.pop_text_style();
+                        }
+
                         if self.markdown.read(cx).options.copy_code_block_buttons {
                             builder.flush_text();
                             builder.modify_current_div(|el| {
@@ -792,11 +801,8 @@ impl Element for MarkdownElement {
                             });
                         }
 
+                        // Pop the parent container.
                         builder.pop_div();
-                        builder.pop_code_block();
-                        if self.style.code_block.text.is_some() {
-                            builder.pop_text_style();
-                        }
                     }
                     MarkdownTagEnd::HtmlBlock => builder.pop_div(),
                     MarkdownTagEnd::List(_) => {