index.html

<!DOCTYPE HTML>
<html>
<head>
<title>Hello.. Again</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body background="background.png" style="background-style: cover;">
<div id="search">
   <input id="search-field" type="text" name="search-field" onkeypress="return search(event)"></input>
</div>

<div id="container">
<h1 id="clock"></h1>

<div id="bookmarks">
   <a class="bookmark" href="https://www.4chan.org/wg/">/wg/</a>
   <a class="bookmark" href="https://www.4chan.org/gif/">/gif/</a>
   <a class="bookmark" href="https://www.4chan.org/b/">/b/</a>
   <a class="bookmark" href="https://www.4chan.org/s4s/">[s4s]</a>
</div>

<div id="links">
   <a class="bookmark" href="https://youtube.com/">/yt/</a>
   <a class="bookmark" href="https://www.amazon.co.uk/">/am/</a>
   <a class="bookmark" href="https://www.papajohns.co.uk/stores/newcastle-gosforth/pizzas.aspx">/pj/</a>
   <a class="bookmark" href="https://robertsspaceindustries.com/">/rsi/</a>
   <a class="bookmark" href="https://www.twitch.tv/reckful">/reckful/</a>
   <a class="bookmark" href="https://www.twitch.tv/reckful">/tw/</a>
   <a class="bookmark" href="https://www.watch2gether.com/?lang=en">/w2g/</a>
   <a class="bookmark" href="https://www.urbandictionary.com">/ud/</a>
   <a class="bookmark" href="https://mail.google.com">/gm/</a>
</div>

</div>
</body>
<script>
function search(e) {
   if (e.keyCode == 13) {
      var val = document.getElementById("search-field").value;
      window.open("https://google.com/search?q=" + val)
   }
}

function getTime() {
   let date = new Date(),
      min = date.getMinutes(),
      sec = date.getSeconds(),
      hour = date.getHours();

   return (hour < 10 ? ("0" + hour) : hour) + ":" +
      (min < 10 ? ("0" + min) : min) + ":" +
      (sec < 10 ? ("0" + sec) : sec);
}
window.onload = () => {
   // Set up the clock
   document.getElementById("clock").innerHTML = getTime();
   // Set clock interval to tick clock
   setInterval( () => {
      document.getElementById("clock").innerHTML = getTime();
   },100);
}
document.addEventListener("keydown", event => {
   if (event.keyCode == 32) {          // Spacebar code to open search
      document.getElementById('search').style.display = 'flex';
      document.getElementById('search-field').focus();
   }
   else if (event.keyCode == 27) {   // Esc to close search
      document.getElementById('search-field').value = '';
      document.getElementById('search-field').blur();
      document.getElementById('search').style.display = 'none';
   }
});
</script>

</html>