Unify code block copy button and language selector styling

This commit is contained in:
Yuri Karamian
2026-06-19 14:00:38 +02:00
parent 80a6fdca69
commit a710603b0a
+14 -13
View File
@@ -1461,7 +1461,7 @@
if (!pre) return false; if (!pre) return false;
// Check if click is in the top-right corner (language button area) // Check if click is in the top-right corner (language button area)
const rect = pre.getBoundingClientRect(); const rect = pre.getBoundingClientRect();
if (event.clientX < rect.right - 70 || event.clientY > rect.top + 30) return false; if (event.clientX < rect.right - 100 || event.clientY > rect.top + 30) return false;
// Find the code block position // Find the code block position
const pos = view.posAtDOM(pre, 0); const pos = view.posAtDOM(pre, 0);
const resolved = view.state.doc.resolve(pos); const resolved = view.state.doc.resolve(pos);
@@ -1482,10 +1482,10 @@
// Virtual trigger for dropdown positioning // Virtual trigger for dropdown positioning
const triggerEl = document.createElement('div'); const triggerEl = document.createElement('div');
triggerEl.getBoundingClientRect = () => ({ triggerEl.getBoundingClientRect = () => ({
top: rect.top + 6, bottom: rect.top + 26, top: rect.top + 5, bottom: rect.top + 25,
left: rect.right - 60, right: rect.right - 6, left: rect.right - 100, right: rect.right - 34,
width: 54, height: 20, width: 66, height: 20,
x: rect.right - 60, y: rect.top + 6, x: rect.right - 100, y: rect.top + 5,
toJSON() { return this; }, toJSON() { return this; },
}); });
openCodeLangDropdown(cbPos + 1, cbNode.attrs.language || '', triggerEl as any); openCodeLangDropdown(cbPos + 1, cbNode.attrs.language || '', triggerEl as any);
@@ -7362,15 +7362,15 @@
:global(.tiptap-wrapper .tiptap .code-copy-btn) { :global(.tiptap-wrapper .tiptap .code-copy-btn) {
position: absolute; position: absolute;
top: 6px; top: 5px;
right: 76px; right: 5px;
padding: 3px 6px; padding: 2px 6px;
border-radius: 5px; border-radius: 4px;
background: transparent; background: transparent;
border: 1px solid transparent; border: 1px solid transparent;
color: var(--text-tertiary); color: var(--text-tertiary);
cursor: pointer; cursor: pointer;
opacity: 0.35; opacity: 0;
z-index: 2; z-index: 2;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -7400,8 +7400,8 @@
:global(.tiptap-wrapper .tiptap pre)::after { :global(.tiptap-wrapper .tiptap pre)::after {
content: attr(data-language); content: attr(data-language);
position: absolute; position: absolute;
top: 6px; top: 5px;
right: 6px; right: 34px;
padding: 2px 6px; padding: 2px 6px;
border-radius: 4px; border-radius: 4px;
background: transparent; background: transparent;
@@ -7412,6 +7412,7 @@
opacity: 0; opacity: 0;
pointer-events: none; pointer-events: none;
z-index: 1; z-index: 1;
transition: opacity 0.15s;
} }
:global(.tiptap-wrapper .tiptap pre[data-language=""])::after { :global(.tiptap-wrapper .tiptap pre[data-language=""])::after {
@@ -7419,7 +7420,7 @@
} }
:global(.tiptap-wrapper .tiptap pre:hover)::after { :global(.tiptap-wrapper .tiptap pre:hover)::after {
opacity: 0.7; opacity: 1;
} }
:global(.tiptap-wrapper .tiptap .secret-block) { :global(.tiptap-wrapper .tiptap .secret-block) {