From 3ebf7b51f8cc7b08dbf2990a282cbf5d5b2f1713 Mon Sep 17 00:00:00 2001
From: Dario Martins Silva <dario@live.ca>
Date: Tue, 21 Mar 2017 10:35:59 -0400
Subject: [PATCH] less disruptive hover effect for the omnibox result list
 (#397)

https://coveord.atlassian.net/browse/JSUI-1485
---
 sass/_OmniboxResultList.scss                  | 15 +++++++++++----
 src/ui/OmniboxResultList/OmniboxResultList.ts | 12 ++++++------
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/sass/_OmniboxResultList.scss b/sass/_OmniboxResultList.scss
index de15d205de..adb32cdf16 100644
--- a/sass/_OmniboxResultList.scss
+++ b/sass/_OmniboxResultList.scss
@@ -1,6 +1,13 @@
 .CoveoResult {
-	&.coveo-omnibox-selectable {
-	  padding: 10px 10px 10px 36px;
-	  margin: 0;
-	}
+  &.coveo-omnibox-selectable {
+    padding: 10px 10px 10px 36px;
+    margin: 0;
+    box-sizing: border-box;
+  }
+  &.coveo-omnibox-result-list-element.coveo-omnibox-selectable.coveo-omnibox-selected {
+    padding: 7px 7px 8px 33px;
+    background-color: white;
+    border: $default-border;
+    border-width: 3px;
+  }
 }
\ No newline at end of file
diff --git a/src/ui/OmniboxResultList/OmniboxResultList.ts b/src/ui/OmniboxResultList/OmniboxResultList.ts
index 3b23ed380e..6f715ea66e 100644
--- a/src/ui/OmniboxResultList/OmniboxResultList.ts
+++ b/src/ui/OmniboxResultList/OmniboxResultList.ts
@@ -134,13 +134,13 @@ export class OmniboxResultList extends ResultList implements IComponentBindings
    */
   public buildResults(results: IQueryResults): HTMLElement[] {
     return _.map(results.results, (result: IQueryResult) => {
-      let resultElement = this.buildResult(result);
-      $$(resultElement).addClass('coveo-omnibox-selectable');
-      $$(resultElement).on('keyboardSelect', () => {
-        this.options.onSelect.call(this, result, resultElement, this.lastOmniboxRequest.omniboxObject);
+      let resultElement = $$(this.buildResult(result));
+      resultElement.addClass(['coveo-omnibox-selectable', 'coveo-omnibox-result-list-element']);
+      resultElement.on('keyboardSelect', () => {
+        this.options.onSelect.call(this, result, resultElement.el, this.lastOmniboxRequest.omniboxObject);
       });
-      this.autoCreateComponentsInsideResult(resultElement, result);
-      return resultElement;
+      this.autoCreateComponentsInsideResult(resultElement.el, result);
+      return resultElement.el;
     });
   }