From 6a42188853435ffc07246158ce282cd1e8bbbb89 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=87=A1=E6=A2=A6=E6=98=9F=E5=B0=98?= <elkan1788@139.com>
Date: Thu, 6 Oct 2022 12:00:10 +0800
Subject: [PATCH] :lipstick: Design search box footer with pagination & fixed
 toc enable in home page.

---
 .../components/third-party/search.scss        | 58 +++++++++----------
 assets/js/next-boot.js                        |  4 +-
 .../partials/_thirdparty/search/algolia.html  | 12 ++--
 3 files changed, 38 insertions(+), 36 deletions(-)

diff --git a/assets/css/_common/components/third-party/search.scss b/assets/css/_common/components/third-party/search.scss
index 9b2b7a5..f73dcbb 100644
--- a/assets/css/_common/components/third-party/search.scss
+++ b/assets/css/_common/components/third-party/search.scss
@@ -78,45 +78,41 @@
       height: calc(100% - 55px);
       overflow: auto;
       padding: 0px 25px;
-
-      hr {
-        margin: 5px 0 10px;
-
-        &:first-child {
-          display: none;
-        }
-      }
     }
 
     .search-footer {
       background: var(--content-bg-color);
       border-bottom-left-radius: 5px;
       border-bottom-right-radius: 5px;
-      display: flex;
       padding: 0 5px;
+      color: var(--text-color);
 
-      div {
-        color: var(--text-color);
-        padding: 5px;
+      .search-meta-info {
+        height: 26px;
+        display: flex;
+        padding: 5px 0;
+        
+        .search-hit-stats {
+          font-size: $font-size-smaller;
+          width: 65%;
+          padding: 2px 8px;
+        }
+
+        .search-vendor {
+          width: 34%;
+          text-align: right;
+          font-size: $font-size-small;
+          font-weight: bold;
+          
+          img {
+            width: 68px;
+            margin: 5px;
+            vertical-align: middle;
+            display: inline;
+          }      
+        }
       }
 
-      .search-hit-stats {
-        width: 65%;
-        font-size: $font-size-smaller;
-        
-      }
-      .search-vendor {
-        width: 35%;
-        text-align: right;
-        font-size: $font-size-small;
-        
-        img {
-          width: 68px;
-          margin: 5px;
-          vertical-align: middle;
-          display: inline;
-        }      
-      }
     }
 
     .search-result-list {
@@ -164,9 +160,11 @@
 
   .algolia-pagination {
     // Override default style of ul
-    margin: 40px 0;
+    //margin: 40px 0;
     opacity: 1;
     padding: 0;
+    font-size: $font-size-smallest;
+    margin-bottom: -16px;
 
     .pagination {
       visibility: visible;
diff --git a/assets/js/next-boot.js b/assets/js/next-boot.js
index e17456b..e04c5e6 100644
--- a/assets/js/next-boot.js
+++ b/assets/js/next-boot.js
@@ -10,7 +10,9 @@ NexT.boot.registerEvents = function() {
 
   NexT.utils.registerScrollPercent();
   // NexT.utils.registerCanIUseTag();
-  NexT.utils.registerToolButtons();
+  if (NexT.CONFIG.page.isPage) {
+    NexT.utils.registerToolButtons();
+  }
 
   // Mobile top menu bar.
   document.querySelector('.site-nav-toggle .toggle').addEventListener('click', event => {
diff --git a/layouts/partials/_thirdparty/search/algolia.html b/layouts/partials/_thirdparty/search/algolia.html
index b86200a..9fe07fa 100644
--- a/layouts/partials/_thirdparty/search/algolia.html
+++ b/layouts/partials/_thirdparty/search/algolia.html
@@ -9,12 +9,14 @@
 </div>
 <div class="search-result-container">
   <div class="algolia-hits"></div>
-  <div class="algolia-pagination"></div>
 </div>
 <div class="search-footer">
-  <div class="search-hit-stats algolia-stats"></div>
-  <div class="search-vendor">
-    <span>Search By</span>
-    <img src="/imgs/algolia-logo.svg"/>
+  <div class="algolia-pagination"></div>
+  <div class="search-meta-info">
+    <div class="search-hit-stats algolia-stats"></div>
+    <div class="search-vendor">
+      <span>Search By</span>
+      <img src="/imgs/algolia-logo.svg"/>
+    </div>
   </div>
 </div>
\ No newline at end of file