index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Terms List</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>Terms List</h1>

        <!-- Updated subheading with new description -->
        <p class="subheading">
            Very large list of terms pertaining to Cybersecurity
            | <a href="https://koronkowy.tumblr.com/" target="_blank">blog</a>
            | <a href="https://github.com/koronkowy" target="_blank">github</a>
            | <a href="https://github.com/koronkowy/terms-list#readme" target="_blank">readme</a>
            | <a href="https://hackroost.net" target="_blank">hackroost</a>
            | <a href="https://koronkowy.github.io/cyber-jobs" target="_blank">cyber-jobs</a>
        </p>

        <!-- Search bar for filtering terms -->
        <input type="text" id="searchBar" placeholder="Search for a term..." />

        <!-- Terms container -->
        <div id="terms"></div>
    </div>

    <!-- Script to load and display terms from terms.json -->
    <script src="script.js"></script>
</body>
</html>