hexo 搜索调整标红方式

themes/hexo/LayoutSearch.js

@@ -21,14 +21,16 @@ export const LayoutSearch = props => {
       // 自动聚焦到搜索框
       cRef.current.focus()
       if (currentSearch && !handleTextColor) {
-        const container = document.getElementById('container')
-        if (container && container.innerHTML) {
-          const re = new RegExp(`${currentSearch}`, 'gim')
-          container.innerHTML = container.innerHTML.replace(
-            re,
+        const targets = document.getElementsByClassName('replace')
+        for (const container of targets) {
+          if (container && container.innerHTML) {
+            const re = new RegExp(`${currentSearch}`, 'gim')
+            container.innerHTML = container.innerHTML.replace(
+              re,
             `<span class='text-red-500 border-b border-dashed'>${currentSearch}</span>`
-          )
-          handleTextColor = true
+            )
+            handleTextColor = true
+          }
         }
       }
     }, 100)

themes/hexo/components/BlogPostCard.js

@@ -10,11 +10,11 @@ const BlogPostCard = ({ post, showSummary }) => {
   const showPreview = CONFIG_HEXO.POST_LIST_PREVIEW && post.blockMap
   return (
     <div className='w-full shadow hover:shadow-2xl border border-gray-100 dark:border-gray-600 rounded-xl bg-white dark:bg-gray-800 duration-300'>
-       <div key={post.id} className='animate__animated animate__fadeIn flex flex-col-reverse lg:flex-row justify-between duration-300'>
+      <div key={post.id} className='animate__animated animate__fadeIn flex flex-col-reverse lg:flex-row justify-between duration-300'>
 
       <div className='lg:p-8 p-4 flex flex-col w-full'>
         <Link href={`${BLOG.PATH}/article/${post.slug}`} passHref>
-          <a className={`cursor-pointer hover:underline text-2xl font-sans ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
+          <a className={`replace cursor-pointer hover:underline text-2xl font-sans ${showPreview ? 'justify-center' : 'justify-start'} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}>
             {post.title}
           </a>
         </Link>
@@ -27,7 +27,7 @@ const BlogPostCard = ({ post, showSummary }) => {
           </div>
         </div>
 
-        {(!showPreview || showSummary) && <p className='my-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7'>
+        {(!showPreview || showSummary) && <p className='replace my-4 text-gray-700 dark:text-gray-300 text-sm font-light leading-7'>
           {post.summary}
         </p>}
 

themes/hexo/components/BlogPostListPage.js

@@ -13,6 +13,7 @@ import BlogPostListEmpty from './BlogPostListEmpty'
  */
 const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
   const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
+  const showPagination = posts.length === BLOG.POSTS_PER_PAGE
 
   if (!posts || posts.length === 0) {
     return <BlogPostListEmpty />
@@ -25,7 +26,7 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
             <BlogPostCard key={post.id} post={post} />
           ))}
         </div>
-        <PaginationNumber page={page} totalPage={totalPage} />
+       {showPagination && <PaginationNumber page={page} totalPage={totalPage} /> }
       </div>
     )
   }

themes/hexo/components/SearchInput.js

@@ -21,7 +21,10 @@ const SearchInput = props => {
     const key = searchInputRef.current.value
     if (key && key !== '') {
       setLoadingState(true)
-      location.href = '/search/' + key
+      router.push({ pathname: '/search/' + key }).then(r => {
+        setLoadingState(false)
+      })
+      // location.href = '/search/' + key
     } else {
       router.push({ pathname: '/' }).then(r => {})
     }