Schematics
SCHEMATICS
<h2>Schematic Download</h2>
<label for="schemList"><h5>A list of schematics is below. You can click on the schematic name to download it.</h5>
</label>
<div class="input-group mb-3 w-75 p-3">
    <input type="text" autocomplete="off" autofocus class="form-control" oninput="filterTable(this.value)"
           placeholder="Search for a schematic...">
</div>
<table id="schemList" class="table table-striped table-bordered">
    <thead>
    <tr>
        <th scope="col">Name</th>
        <th scope="col">Size</th>
    </tr>
    </thead>
    <tbody>
    ${schematics}
    </tbody>
</table>
<script>
    let schemList = document.getElementById("schemList").getElementsByTagName("tbody")[0].getElementsByTagName("tr");

    function filterTable(query) {
        for (let i = 0; i < schemList.length; i++) {
            let th = schemList[i].getElementsByTagName("th")[0];
            let schemName = th.textContent || th.innerText;
            if (schemName.toLowerCase().includes(query.toLowerCase())) {
                schemList[i].style.display = "";
            } else {
                schemList[i].style.display = "none";
            }
        }
    }
</script>