receptty.org/templates/search.html

44 lines
1.0 KiB
HTML

{% extends "base.html" %}
{% block content %}
<main>
<h2>Hledání a filtry</h2>
<div class="filters">
<input type="text" placeholder="Název" id="input">
</div>
<section class="list">
{% set section = get_section(path="_index.md") %}
{% for page in section.pages %}
{{ macro::print_recipe(recipe=page) }}
{% endfor %}
</section>
</main>
{% endblock content %}
{% block script %}
<script>
let input = document.getElementById("input");
input.oninput = function() { filter_name(input.value) };
let articles = document.getElementsByTagName("article");
function filter_name(str) {
str = str.toLowerCase();
if (str.length==0) {
for (let i=0; i<articles.length; i++) {
articles[i].style.display = "flex";
}
} else {
for (let i=0; i<articles.length; i++) {
let name = articles[i].getElementsByTagName("h3")[0].innerHTML.toLowerCase();
if (!name.includes(str)) {
articles[i].style.display = "none";
} else {
articles[i].style.display = "flex";
}
}
}
}
</script>
{% endblock script %}