2 files changed, 29 insertions, 2 deletions

diff --git a/src/static/css/site.css b/src/static/css/site.css
index d2c121e6..4fc2d8a3 100644
--- a/src/static/css/site.css
+++ b/src/static/css/site.css
@@ -500,9 +500,27 @@ summary .group-name {
 }
 
 .wiki-search-result {
+  position: relative;
   display: flex;
-  padding: 0 6px;
-  margin: 3px 0 5px 0;
+  padding: 4px 3px 4px 6px;
+}
+
+.wiki-search-result::before {
+  content: '';
+  position: absolute;
+  top: -2px;
+  bottom: -2px;
+  left: 0;
+  right: 0;
+
+  border: 2px solid var(--primary-color);
+  border-radius: 4px;
+  display: none;
+}
+
+.wiki-search-result:hover::before {
+  display: block;
+  background: var(--light-ghost-color);
 }
 
 .wiki-search-result-name {
@@ -517,6 +535,7 @@ summary .group-name {
   width: 1.8em;
   height: 1.8em;
   margin-right: 6px;
+  border-radius: 2px;
 }
 
 .wiki-search-result-image-placeholder {
diff --git a/src/static/js/client.js b/src/static/js/client.js
index 0a4dc0ff..93cbb902 100644
--- a/src/static/js/client.js
+++ b/src/static/js/client.js
@@ -5,6 +5,7 @@
 // that cannot 8e done at static-site compile time, 8y its fundamentally
 // ephemeral nature.
 
+import {getColors} from '../shared-util/colors.js';
 import {accumulateSum, atOffset, empty, filterMultipleArrays, stitchArrays}
   from '../shared-util/sugar.js';
 
@@ -3545,6 +3546,13 @@ function showSidebarSearchResults(results) {
     link.setAttribute('href', openTrack(result.directory));
     cssProp(link, '--primary-color', result.data.color);
 
+    try {
+      const colors = getColors(result.data.color, {chroma});
+      cssProp(link, '--light-ghost-color', colors.lightGhost);
+    } catch (error) {
+      console.warn(error);
+    }
+
     const span = document.createElement('span');
     span.classList.add('wiki-search-result-name');