Added search bar feature
This commit is contained in:
parent
86fbd9ee95
commit
fc2dc61c26
|
@ -12,6 +12,9 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="container-lg px-3 my-5 markdown-body">
|
||||
<div class="search-container">
|
||||
<input type="text" placeholder="Search...">
|
||||
</div>
|
||||
{% if site.title and site.title != page.title %}
|
||||
<h1><a href="{{ "/" | absolute_url }}">{{ site.title }}</a></h1>
|
||||
{% endif %}
|
||||
|
@ -23,6 +26,7 @@
|
|||
Awesome ChatGPT Prompts is open source. {% github_edit_link "Improve this page" %}.
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/4.1.0/anchor.min.js" integrity="sha256-lZaRhKri35AyJSypXXs4o6OPFTbTmUoltBbDCbdzegg=" crossorigin="anonymous"></script>
|
||||
<script>anchors.add();</script>
|
||||
|
@ -47,6 +51,21 @@
|
|||
}, false);
|
||||
x.previousElementSibling.previousElementSibling.prepend(button);
|
||||
});
|
||||
|
||||
// Add search functionality
|
||||
const searchBar = document.querySelector(".search-container input");
|
||||
searchBar.addEventListener("keyup", function() {
|
||||
const searchTerm = searchBar.value.toLowerCase();
|
||||
const prompts = document.querySelectorAll("h2[id^=act] + p + blockquote");
|
||||
prompts.forEach(prompt => {
|
||||
const promptText = prompt.innerText.toLowerCase();
|
||||
if (promptText.includes(searchTerm)) {
|
||||
prompt.style.display = "block";
|
||||
} else {
|
||||
prompt.style.display = "none";
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style>video { max-width: 100% !important; }</style>
|
||||
<!-- Google tag (gtag.js) -->
|
||||
|
|
Loading…
Reference in New Issue