diff options
| author | Eltrac <hi@guhub.cn> | 2025-07-14 19:28:29 +0800 |
|---|---|---|
| committer | Eltrac <hi@guhub.cn> | 2025-07-14 19:28:29 +0800 |
| commit | 60adda60f9c8a99adea4daf28c105f6cfe5f6b05 (patch) | |
| tree | 76acf6bec623118ac995a7374fdf178ab8ce633e /layouts/_partials | |
| parent | 29af8b6c2bd89c1966512b4305af345b8ee1ef82 (diff) | |
refactor: separate global search css
Diffstat (limited to 'layouts/_partials')
| -rw-r--r-- | layouts/_partials/components/global-search.html | 79 |
1 files changed, 0 insertions, 79 deletions
diff --git a/layouts/_partials/components/global-search.html b/layouts/_partials/components/global-search.html index 769d0d2d..4f8ea499 100644 --- a/layouts/_partials/components/global-search.html +++ b/layouts/_partials/components/global-search.html @@ -11,85 +11,6 @@ </div> <div id="global-search-overlay"></div> - <style> - #global-search-overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(250,250,250,0.75); - @media (prefers-color-scheme: dark) { - background-color: rgba(30,30,30,0.75); - } - backdrop-filter: blur(10px); - -webkit-backdrop-filter: blur(10px); - - z-index: -10; - opacity: 0; - transition-duration: 0.3s; - transition-property: opacity; - } - #global-search-overlay.shown { - z-index: 10; - opacity: 1; - } - - #global-search { - position: fixed; - z-index: -10; - display: none; - top: 0; - left: 0; - right: 0; - bottom: 0; - align-items: center; - justify-content: center; - #global-search-close { - position: absolute; - top: 0; - right: 0; - padding: 0 1rem; - font-size: 3rem; - cursor: pointer; - } - } - - #global-search #pagefind { - max-height: 90vh; - overflow-y: auto; - width: 100%; - margin: 1rem; - } - - @media screen and (min-width: 768px) { - #global-search #pagefind { - width: 600px - } - } - - #global-search #pagefind input { - outline: none - } - - #global-search.shown { - z-index: 15; - display: flex; - animation: fade-in 0.3s ease-in-out; - } - - @keyframes fade-in { - from { - opacity: 0; - transform: translateY(1rem); - } - to { - opacity: 1; - transform: translateY(0); - } - } - </style> - <script> (() => { const search = document.getElementById("global-search"); |
