Hackerman/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hackerman</title>

    <!-- External CSS -->
    <link rel="stylesheet" href="./style.css">
</head>
<body>

    <div class="container">
        <div class="sticky-container">
            <div class="navbanner"> 
                <span><img src="./terminal_logo.png" alt="terminal logo" class="logo"></span>
                <span class="title"><span id="username">Alkaison</span><strong>@</strong>kali: ~/Desktop</span>
                <span class="actionBtns">
                    <svg xmlns="http://www.w3.org/2000/svg" height="1em"
                        viewBox="0 0 512 512">
                        <path fill="white" 
                            d="M32 416c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H32z" />
                    </svg>

                    <svg xmlns="http://www.w3.org/2000/svg" height="1em"
                        viewBox="0 0 448 512">
                        <path fill="white"
                            d="M384 80c8.8 0 16 7.2 16 16V416c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V96c0-8.8 7.2-16 16-16H384zM64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64z" />
                    </svg>

                    <svg xmlns="http://www.w3.org/2000/svg" height="1em"
                        viewBox="0 0 384 512">
                        <path fill="white"
                            d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" />
                    </svg>
                </span>
            </div>

            <div class="toolbanner">
                <ul>
                    <li>File</li>
                    <li>Actions</li>
                    <li>Edit</li>
                    <li>View</li>
                    <li>Help</li>
                </ul>
            </div>
        </div>

        <div class="terminal-text-wrap">
            <div class="command-output">
                <div class="output" style="display: none;">
                    <br>
                        <label class="commandLine" for="command">visitor@Alkaison:~$</label>
                        <span class="outputText"></span>
                    <br>
                </div>
            </div>

            <div class="command-input">
                <label class="commandLine" for="command">visitor@Alkaison:~$</label>
                <input type="text" autofocus id="command" class="commandField">
            </div>
        </div>
    </div>

    <!-- Javascript -->
    <script src="./script.js" defer></script>
</body>
</html>