From b1ffa283034cd02e27923be7d7cdacb1643a7254 Mon Sep 17 00:00:00 2001
From: Bhwa233 <404174262@qq.com>
Date: Sat, 16 Mar 2024 14:34:03 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=93=8D=E4=BD=9C?=
 =?UTF-8?q?=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/AlgoliaSearchModal.js | 28 +++++++++++++++++++++++++++-
 components/ShortcutTag.js        |  7 +++++++
 2 files changed, 34 insertions(+), 1 deletion(-)
 create mode 100644 components/ShortcutTag.js

diff --git a/components/AlgoliaSearchModal.js b/components/AlgoliaSearchModal.js
index 54465826..49cad8b2 100644
--- a/components/AlgoliaSearchModal.js
+++ b/components/AlgoliaSearchModal.js
@@ -1,4 +1,4 @@
-import { useState, useImperativeHandle, useRef, useEffect } from 'react'
+import { useState, useImperativeHandle, useRef, useEffect, Fragment } from 'react'
 import algoliasearch from 'algoliasearch'
 import replaceSearchResult from '@/components/Mark'
 import Link from 'next/link'
@@ -6,6 +6,23 @@ import { useGlobal } from '@/lib/global'
 import throttle from 'lodash/throttle'
 import { siteConfig } from '@/lib/config'
 import { useHotkeys } from 'react-hotkeys-hook';
+import ShortcutTag from '@/components/ShortcutTag'
+
+const ShortCutActions = [
+  {
+    key: '↑ ↓',
+    action: '选择'
+  },
+  {
+    key: 'Enter',
+    action: '跳转'
+  },
+  {
+    key: 'Esc',
+    action: '关闭'
+  }
+
+]
 
 /**
  * 结合 Algolia 实现的弹出式搜索框
@@ -234,6 +251,15 @@ export default function AlgoliaSearchModal({ cRef }) {
         </ul>
         <Pagination totalPage={totalPage} page={page} switchPage={switchPage} />
         <div className='flex items-center justify-between mt-2 sm:text-sm text-xs dark:text-gray-300'>
+          {totalHit === 0 && (<div className='flex items-center'>
+            {
+              ShortCutActions.map((action, index) => {
+                return <Fragment key={index}><div className={`border-gray-300 dark:text-gray-400 text-gray-400 px-1 rounded border inline-block `}>{action.key}</div>
+                  <span className='ml-2 mr-4  text-gray-600 dark:text-gray-300'>{action.action}</span></Fragment>
+              })
+            }
+          </div>)
+          }
           <div>
             {totalHit > 0 && (
               <p>
diff --git a/components/ShortcutTag.js b/components/ShortcutTag.js
new file mode 100644
index 00000000..4e36e8be
--- /dev/null
+++ b/components/ShortcutTag.js
@@ -0,0 +1,7 @@
+// 操作提示标签
+import React from 'react';
+
+const ShortcutTag = ({ children, className }) => {
+    return <div className={`border-gray-300 dark:text-gray-400 text-gray-400 text-xs px-1 rounded border inline-block ${className}`}>{children}</div>
+}
+export default ShortcutTag
\ No newline at end of file

From c0acdbff4336cf9c7d8f1cc55228395d86516b76 Mon Sep 17 00:00:00 2001
From: Bhwa233 <404174262@qq.com>
Date: Sat, 16 Mar 2024 14:50:07 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=8C=E5=88=A0=E9=99=A4=E5=A4=9A=E4=BD=99=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/AlgoliaSearchModal.js | 3 +--
 components/ShortcutTag.js        | 7 -------
 2 files changed, 1 insertion(+), 9 deletions(-)
 delete mode 100644 components/ShortcutTag.js

diff --git a/components/AlgoliaSearchModal.js b/components/AlgoliaSearchModal.js
index 49cad8b2..8fc62d91 100644
--- a/components/AlgoliaSearchModal.js
+++ b/components/AlgoliaSearchModal.js
@@ -6,7 +6,6 @@ import { useGlobal } from '@/lib/global'
 import throttle from 'lodash/throttle'
 import { siteConfig } from '@/lib/config'
 import { useHotkeys } from 'react-hotkeys-hook';
-import ShortcutTag from '@/components/ShortcutTag'
 
 const ShortCutActions = [
   {
@@ -254,7 +253,7 @@ export default function AlgoliaSearchModal({ cRef }) {
           {totalHit === 0 && (<div className='flex items-center'>
             {
               ShortCutActions.map((action, index) => {
-                return <Fragment key={index}><div className={`border-gray-300 dark:text-gray-400 text-gray-400 px-1 rounded border inline-block `}>{action.key}</div>
+                return <Fragment key={index}><div className={`border-gray-300 dark:text-gray-300 text-gray-600 px-2 rounded border inline-block `}>{action.key}</div>
                   <span className='ml-2 mr-4  text-gray-600 dark:text-gray-300'>{action.action}</span></Fragment>
               })
             }
diff --git a/components/ShortcutTag.js b/components/ShortcutTag.js
deleted file mode 100644
index 4e36e8be..00000000
--- a/components/ShortcutTag.js
+++ /dev/null
@@ -1,7 +0,0 @@
-// 操作提示标签
-import React from 'react';
-
-const ShortcutTag = ({ children, className }) => {
-    return <div className={`border-gray-300 dark:text-gray-400 text-gray-400 text-xs px-1 rounded border inline-block ${className}`}>{children}</div>
-}
-export default ShortcutTag
\ No newline at end of file

From a407cd548d5eaff2a32e2ecfd91834f190809384 Mon Sep 17 00:00:00 2001
From: Bhwa233 <404174262@qq.com>
Date: Sat, 16 Mar 2024 15:01:18 +0800
Subject: [PATCH 3/3] =?UTF-8?q?format=20=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/AlgoliaSearchModal.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/AlgoliaSearchModal.js b/components/AlgoliaSearchModal.js
index 8fc62d91..ea727a48 100644
--- a/components/AlgoliaSearchModal.js
+++ b/components/AlgoliaSearchModal.js
@@ -253,7 +253,7 @@ export default function AlgoliaSearchModal({ cRef }) {
           {totalHit === 0 && (<div className='flex items-center'>
             {
               ShortCutActions.map((action, index) => {
-                return <Fragment key={index}><div className={`border-gray-300 dark:text-gray-300 text-gray-600 px-2 rounded border inline-block `}>{action.key}</div>
+                return <Fragment key={index}><div className='border-gray-300 dark:text-gray-300 text-gray-600 px-2 rounded border inline-block'>{action.key}</div>
                   <span className='ml-2 mr-4  text-gray-600 dark:text-gray-300'>{action.action}</span></Fragment>
               })
             }