From d0325e948e3081e5b24c3722f3e75cdf2331e465 Mon Sep 17 00:00:00 2001
From: Patrick Marsceill <patrick.marsceill@gmail.com>
Date: Tue, 13 Aug 2019 17:24:36 -0400
Subject: [PATCH] Fix up search results display

---
 _sass/search.scss          | 80 +++++++++++++++++++++-----------------
 assets/js/just-the-docs.js |  7 +++-
 2 files changed, 51 insertions(+), 36 deletions(-)

diff --git a/_sass/search.scss b/_sass/search.scss
index 3eaa24fc..bef2df73 100644
--- a/_sass/search.scss
+++ b/_sass/search.scss
@@ -106,52 +106,62 @@
 .search-result {
   display: block;
   padding-top: $sp-1;
+  padding-right: $sp-3;
   padding-bottom: $sp-1;
   padding-left: $sp-3;
-  padding-right: $sp-3;
 
-  &:hover, &.active {
-    background-color: darken($search-background-color, 5%);
+  &:hover,
+  &.active {
+    background-color: $sidebar-color;
   }
 
   @include mq(md) {
-    padding-left: $sp-4;
     padding-right: $sp-4;
+    padding-left: $sp-4;
   }
+}
 
-  .search-result-title {
-    display: block;
-    padding-top: $sp-2;
-    padding-bottom: $sp-2;
-    padding-right: $sp-4;
-
-    @include mq(sm) {
-      display: inline-block;
-      width: 40%;
-      vertical-align: top;
-      word-wrap: break-word;
-    }
+.search-result-title {
+  display: block;
+  padding-top: $sp-2;
+  padding-right: $sp-4;
+  padding-bottom: $sp-2;
+
+  @include mq(sm) {
+    display: inline-block;
+    width: 40%;
+    word-wrap: break-word;
+    vertical-align: top;
   }
+}
 
-  .search-result-preview {
-    display: block;
-    padding-top: $sp-2;
-    padding-bottom: $sp-2;
-    padding-left: $sp-4;
-    border-left: $border;
-    border-left-color: $border-color;
-    color: $search-result-preview-color;
-    @include fs-2;
-
-    @include mq(sm) {
-      display: inline-block;
-      width: 60%;
-      vertical-align: top;
-    }
-  }
+.search-result-rel-url {
+  display: block;
+  overflow: hidden;
+  color: $search-result-preview-color;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  @include fs-1;
+}
 
-  .search-result-highlight {
-    color: $link-color;
-    font-weight: bold;
+.search-result-preview {
+  display: block;
+  padding-top: $sp-2;
+  padding-bottom: $sp-2;
+  padding-left: $sp-4;
+  color: $search-result-preview-color;
+  border-left: $border;
+  border-left-color: $border-color;
+  @include fs-2;
+
+  @include mq(sm) {
+    display: inline-block;
+    width: 60%;
+    vertical-align: top;
   }
 }
+
+.search-result-highlight {
+  font-weight: bold;
+  color: $link-color;
+}
diff --git a/assets/js/just-the-docs.js b/assets/js/just-the-docs.js
index 344a3551..02e15a7b 100644
--- a/assets/js/just-the-docs.js
+++ b/assets/js/just-the-docs.js
@@ -194,6 +194,11 @@ function initSearch() {
           resultTitle.innerText = doc.title;
           resultLink.appendChild(resultTitle);
 
+          var resultRelUrl = document.createElement('span');
+          resultRelUrl.classList.add('search-result-rel-url');
+          resultRelUrl.innerText = doc.relUrl;
+          resultTitle.appendChild(resultRelUrl);
+
           var metadata = result.matchData.metadata;
           var contentFound = false;
           for (var j in metadata) {
@@ -286,4 +291,4 @@ jtd.onReady(function(){
 
 })(window.jtd = window.jtd || {});
 
-{% include_relative _custom.js %}
\ No newline at end of file
+{% include_relative _custom.js %}
-- 
GitLab