{% 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 = Array.from(document.getElementsByTagName("article")); articles.forEach(article => article.dataset.title = article.dataset.title.normalize("NFD").replace(/\p{Diacritic}/gu, "")); function filter_name(str) { str = str.toLowerCase().normalize("NFD").replace(/\p{Diacritic}/gu, ""); if (str.length==0) { articles.forEach(article => article.style.display = "flex"); } else { articles.forEach(article => article.style.display = article.dataset.title.indexOf(str) === -1 ? "none" : "flex"); } } </script> {% endblock script %}