Untitled

<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<style>


p{

    font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
}

a{
    text-decoration:none;
    font-family: Tahoma, "DejaVu Sans Condensed", Arial, Helvetica, sans-serif;
    font-weight:700;
    color:#006bdf;
}

a:hover{
    color:#f79726;
}

a:focus{
  outline: none;
}

#myInput {

    height:35px;
    font-size:1.35em;
    margin:auto;
    display:block;
    border-radius:25px;
    padding:5px 15px;
    margin-bottom:10px;
    text-align:center;
}

#myInput:hover, #myInput:focus{
    background-color:skyblue;
}

#myTable {
  width:55%;
  margin:auto;
  border: 1px solid #ddd;
  font-size: 20px;
}

#myTable th, #myTable td {
  padding: 12px;
}

#myTable tr {
  border-bottom: 1px solid #ddd;
}

#myTable tr.header{
  background-color: #e0e0e0;
}

td{
    text-align:center;
    border-spacing: 0 0.125rem;
}

td:hover{
    background-color:#f7f7e6;
}

tr:nth-child(even){
    background-color:#eef5fc;
}
</style>
</head>
<body>

<script>
function fu() {
  var input, filter, table, tr, td, i;
  var count = 0;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();

  table = document.getElementById("myTable");
  tr = table.getElementsByTagName("tr");

  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[0];
    if (td) {
    var result = td.innerHTML;
    result = result.toUpperCase();
      if ((result.indexOf(filter) > -1) || (i==0)) {
        tr[i].style.display = "";
        count++;
      }else{
        tr[i].style.display = "none";
      }
    }
  }

  show_status(count-1);

}

function show_status(count){

    if(count==-1){
        var links;
        links = document.getElementsByTagName('a');
        count = links.lenght+5;
    }

    var text;
    if(!count){
        text = 'Aucun topic :c';
    }else if(count==1){
        text = '1 topic';
    }else{
        text = count + ' topics';
    }
    document.getElementById("status").innerHTML = text;

}

document.addEventListener('keyup', (event) => {
  const keyName = event.key;
  var setInput = document.getElementById("myInput");
  if (keyName === 'Enter') {
    setInput.value ="";
    window.scrollTo(0, 0);
    setInput.focus();
    fu();
  }
}, false);

</script>

<table id="myTable">
<tr><td>
<p>JVFav</p>
<input type="text" id="myInput" onkeyup="fu()" placeholder="Search item" title="Type in a name">

</td></tr>

  <tbody><tr class="header">
    <th style="width:50%;" id="status" >-</th>
  </tr>
  </tbody>