From a773a63c2a3383f82964dd5a89f4061afb36532c Mon Sep 17 00:00:00 2001
From: Alf Eaton <alf.eaton@overleaf.com>
Date: Mon, 25 Nov 2024 11:01:27 +0000
Subject: [PATCH] Move tooltip styles to EditorView.theme (#22069)

GitOrigin-RevId: b4495732d8f72f18b00f32fe952251391258f5d6
---
 .../features/history/extensions/highlights.ts | 20 +++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/services/web/frontend/js/features/history/extensions/highlights.ts b/services/web/frontend/js/features/history/extensions/highlights.ts
index de314bc620..9fbc82888f 100644
--- a/services/web/frontend/js/features/history/extensions/highlights.ts
+++ b/services/web/frontend/js/features/history/extensions/highlights.ts
@@ -74,6 +74,16 @@ function highlightedLines(highlights: Highlight[], state: EditorState) {
   return lineStatuses
 }
 
+const tooltipTheme = EditorView.theme({
+  '.cm-tooltip': {
+    backgroundColor: 'transparent',
+    borderWidth: 0,
+    // Prevent a tooltip getting in the way of hovering over a line that it
+    // obscures
+    pointerEvents: 'none',
+  },
+})
+
 const theme = EditorView.baseTheme({
   ['.' + ADDITION_MARKER_CLASS]: {
     paddingTop: 'var(--half-leading)',
@@ -84,14 +94,7 @@ const theme = EditorView.baseTheme({
     textDecoration: 'line-through',
     color: 'hsl(var(--hue), 70%, 40%)',
   },
-  '.cm-tooltip': {
-    backgroundColor: 'transparent',
-    borderWidth: 0,
-    // Prevent a tooltip getting in the way of hovering over a line that it
-    // obscures
-    pointerEvents: 'none',
-  },
-  '.ol-cm-highlight-tooltip': {
+  '.cm-tooltip.ol-cm-highlight-tooltip': {
     backgroundColor: 'hsl(var(--hue), 70%, 50%)',
     borderRadius: '4px',
     padding: '4px',
@@ -389,6 +392,7 @@ export const highlightDecorationsField =
       ),
       EditorView.decorations.from(field, value => value.lineHighlights),
       theme,
+      tooltipTheme,
       highlightTooltipPlugin,
     ],
   })