github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-09-14 06:50:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix search-popup animation using template

Browse Source
This commit is contained in:
Mimi 2026-08-14 16:45:16 +08:00
parent 120d41d0fa
commit 66e3095a31
3 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
layout/_partials/search/index.njk
View File

@ -1,5 +1,7 @@
{%- if theme.algolia_search.enable or theme.local_search.enable %} {%- if theme.algolia_search.enable or theme.local_search.enable %}
<div class="search-pop-overlay"> {# Keep the popup out of the render tree to prevent Safari from animating it before main.css is applied.
When main.css loads slowly, the unstyled search popup briefly appears and shrinks away. #}
<template id="search-popup-template"><div class="search-pop-overlay">
<div class="popup search-popup"> <div class="popup search-popup">
<div class="search-header"> <div class="search-header">
<span class="search-icon"> <span class="search-icon">
@ -20,5 +22,5 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div></template>
{%- endif %} {%- endif %}

1
source/js/third-party/search/algolia-search.js vendored
View File

@ -1,6 +1,7 @@
/* global CONFIG, NexT, pjax */ /* global CONFIG, NexT, pjax */
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
document.body.appendChild(document.querySelector('#search-popup-template').content.cloneNode(true));
const { indexName, appID, apiKey, hits } = CONFIG.algolia; const { indexName, appID, apiKey, hits } = CONFIG.algolia;
const client = window['algoliasearch/lite'].liteClient(appID, apiKey); const client = window['algoliasearch/lite'].liteClient(appID, apiKey);

1
source/js/third-party/search/local-search.js vendored
View File

@ -6,6 +6,7 @@ document.addEventListener('DOMContentLoaded', () => {
console.warn('`hexo-generator-searchdb` plugin is not installed!'); console.warn('`hexo-generator-searchdb` plugin is not installed!');
return; return;
} }
document.body.appendChild(document.querySelector('#search-popup-template').content.cloneNode(true));
const localSearch = new LocalSearch({ const localSearch = new LocalSearch({
path : CONFIG.path, path : CONFIG.path,
top_n_per_article: CONFIG.localsearch.top_n_per_article, top_n_per_article: CONFIG.localsearch.top_n_per_article,