From 1f133f8004a2ff4976f040b2daf55aaf17035f15 Mon Sep 17 00:00:00 2001
From: narcolepticinsomniac <therealdoctorgonzo@gmail.com>
Date: Tue, 27 Nov 2018 22:30:09 -0500
Subject: [PATCH] Fix search highlight conflict

Regular highlight styling and search highlight styling shouldn't both be applied at the same time. Search highlight styling should also be removed when search is closed. This PR resolves those conflicts.
---
 edit/edit.css          |  8 ++++----
 edit/global-search.css | 26 +++++++++++++++++++++-----
 edit/global-search.js  | 10 ++++++++--
 3 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/edit/edit.css b/edit/edit.css
index 22d9a110..6276fac1 100644
--- a/edit/edit.css
+++ b/edit/edit.css
@@ -364,13 +364,13 @@ input:invalid {
 .resize-grip-enabled .CodeMirror-scrollbar-filler {
   bottom: 7px; /* make space for resize-grip */
 }
-.cm-matchhighlight,
-.CodeMirror-selection-highlight-scrollbar {
+body:not(.find-open) .cm-matchhighlight,
+body:not(.find-open) .CodeMirror-selection-highlight-scrollbar {
   animation: fadein-match-highlighter 1s cubic-bezier(.97,.01,.42,.98);
   animation-fill-mode: both;
 }
-[data-match-highlight-count="1"] .cm-matchhighlight,
-[data-match-highlight-count="1"] .CodeMirror-selection-highlight-scrollbar {
+body:not(.find-open) [data-match-highlight-count="1"] .cm-matchhighlight,
+body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-highlight-scrollbar {
   animation: none;
 }
 @-webkit-keyframes highlight {
diff --git a/edit/global-search.css b/edit/global-search.css
index 51ec9111..4c84c0e0 100644
--- a/edit/global-search.css
+++ b/edit/global-search.css
@@ -181,17 +181,33 @@
   opacity: 1;
 }
 
-/*********** CodeMirror ****************/
-
-.search-target-editor {
-  outline: 1px solid darkorange;
+/*********** CM search highlight restyling, which shouldn't need color variables ****************/
+body.find-open .search-target-editor {
+  outline-color: darkorange !important;
 }
 
-#stylus .search-target-match {
+body.find-open .cm-searching {
+  background-color: rgba(255, 255, 0, .4);
+}
+
+body.find-open .cm-searching.search-target-match {
   background-color: darkorange;
   color: black;
 }
 
+body.find-open .CodeMirror-search-match {
+  background: gold;
+  border-top: 1px solid orange;
+  border-bottom: 1px solid orange;
+}
+
+/* hide default CM search highlight styling */
+body .cm-searching,
+body .CodeMirror-search-match {
+  background-color: transparent;
+  border-color: transparent;
+}
+
 @media (max-width: 500px) {
   #search-replace-dialog {
     left: 0;
diff --git a/edit/global-search.js b/edit/global-search.js
index c160de16..d6f18d13 100644
--- a/edit/global-search.js
+++ b/edit/global-search.js
@@ -752,8 +752,14 @@ onDOMready().then(() => {
   function makeTargetVisible(element) {
     const old = $('.' + TARGET_CLASS);
     if (old !== element) {
-      if (old) old.classList.remove(TARGET_CLASS);
-      if (element) element.classList.add(TARGET_CLASS);
+      if (old) {
+        old.classList.remove(TARGET_CLASS);
+        document.body.classList.remove('find-open');
+      }
+      if (element) {
+        element.classList.add(TARGET_CLASS);
+        document.body.classList.add('find-open');
+      }
     }
   }