Super.so

<!-- blaced on the head tab -->
<script>
  $( document ).ready(function() {
  
  $("#block-6c4149a6a36f4bbca241f153a2d9e675").html("<input type='text' id='myInput' onkeyup='myFunction();' placeholder='Search for a blog ...' title='Type in a name'>");
  items = $('.notion-collection-list__item');
  items.show();
});

</script>
<!-- blaced on the body tab -->
<script>
function myFunction(){
var filter, table, trs, i;
filter= document.getElementById('myInput').value.toUpperCase();
table = document.getElementById("block-blog-blog-posts");
trs = table.getElementsByClassName("notion-collection-list__item");
for (i=0;i< trs.length;i++){
    res= trs[i].attributes[0].value.toUpperCase();
    if(res.includes(filter.toUpperCase()))
    	trs[i].style.display = "";
     else
         trs[i].style.display = "none";
}
}
</script>
<!-- blaced on the css tab -->
//* For styling the search input for DBs*/
#myInput {
  background-image: url('https://i.ibb.co/Z8YnxXP/search1.png');
  background-size: 28px 28px;
  background-position: 10px 10px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
}

<!-- blaced on the head tab -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/mark.js/7.0.0/jquery.mark.min.js"></script>

<script>
  $( document ).ready(function() {
  
  $("#block-76b2f7daef6b454aaffcc951bbc62082").html("<input type='text' id='input' onkeyup='function();' placeholder='Search for a text ...' title='Type in a name'>");
});
$(function() {
  $("input").on("input.highlight", function() {
    // Determine specified search term
    var searchTerm = $(this).val();
    // Highlight search term inside a specific context
    $("#block-blog-blog-posts-linux-commands").unmark().mark(searchTerm);
  }).trigger("input.highlight").focus();
});

</script>
<!-- blaced on the css tab -->
mark {
  background: orange;
  color: black;
}