Adjust styling of tooltips

FIX: Give tooltips a somewhat lighter background so that they don't blend into the editor background.
codemirror · Nov 5, 2021 · e57a955 · e57a955
1 parent 59e15be
commit e57a955
Showing 1 changed file with 9 additions and 8 deletions.
diff --git a/src/one-dark.ts b/src/one-dark.ts
@@ -17,6 +17,7 @@ const chalky = "#e5c07b",
   darkBackground = "#21252b",
   highlightBackground = "#2c313a",
   background = "#282c34",
+  tooltipBackground = "#353a42",
   selection = "#3E4451",
   cursor = "#528bff"
 
@@ -71,16 +72,16 @@ export const oneDarkTheme = EditorView.theme({
   },
 
   ".cm-tooltip": {
-    border: "1px solid #181a1f",
-    backgroundColor: darkBackground
+    border: "none",
+    backgroundColor: tooltipBackground
   },
-  ".cm-tooltip.cm-tooltip-arrow:before": {
-    borderTopColor: darkBackground,
-    borderBottomColor: darkBackground
+  ".cm-tooltip .cm-tooltip-arrow:before": {
+    borderTopColor: "transparent",
+    borderBottomColor: "transparent"
   },
-  ".cm-tooltip.cm-tooltip-arrow:after": {
-    borderTopColor: "#181a1f",
-    borderBottomColor: "#181a1f"
+  ".cm-tooltip .cm-tooltip-arrow:after": {
+    borderTopColor: tooltipBackground,
+    borderBottomColor: tooltipBackground
   },
   ".cm-tooltip-autocomplete": {
     "& > ul > li[aria-selected]": {