<html lang="en" data-theme="toggle">
  <head>
    <link rel="stylesheet" href="/styles.css" />
  </head>

  <body class="container">
    <header class="nav-links">
      <div class="left">
        <a class="inactive" href="/">FAQ</a>
        <a class="inactive" href="/policy">policies</a>
        <a class="inactive" href="/pricing">pricing</a>
        <a class="active" href="/console">console</a>
      </div>
      <div class="right">
        <i>E408-AEE4</i>
        <a href="#"><u>Logout</u></a>
      </div>
    </header>
    <main>
      <section class="console">
        <div class="console-left">
          Bronze Discipline<br /><small>A2D1-KB21</small>
        </div>
        <div class="console-right">
          <button>Restart</button><button>Power Off</button
          ><button class="alert">Reinstall</button>
        </div>
        <div class="console-uname">
          Debian GNU/Linux 12 (bookworm)<br />
          <i>6.1.0-28-amd64</i>
          <ul>
            <li>IPv4: 65.132.212.89</li>
            <li>IPv6: 2603:3001:6db:4900::fbf2</li>
            <li>Status: Running</li>
            <li>Uptime: 14 Days 14:32:04</li>
          </ul>
        </div>
        <div class="console-resources">
          <label for="mem">Memory Usage</label>
          <div id="mem" class="progress">
            <div class="bar" style="width: 20%"></div>
          </div>
          <div>
            <small>589.02 MB of 5.79 GB Used </small>
            <small>5.21 GB Free</small>
          </div>
        </div>
        <div class="console-resources">
          <label for="cpu">vCPU Usage</label>
          <div id="cpu" class="progress">
            <div class="bar" style="width: 10%"></div>
          </div>
          <div>
            <small>2 Cores</small>
            <small>10% Utilization</small>
          </div>
        </div>
        <div class="console-log">
          <details>
            <summary>Instance Event Log</summary>
            <div>
              <table>
                <thead>
                  <tr>
                    <th>hh:mm:ss</th>
                    <th>Description</th>
                    <th>Status</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>00:03:43</td>
                    <td>Backup Job</td>
                    <td>OK</td>
                  </tr>
                  <tr>
                    <td>00:08:43</td>
                    <td>Backup Job</td>
                    <td>OK</td>
                  </tr>
                  <tr>
                    <td>00:05:43</td>
                    <td>Install Debian 12</td>
                    <td>OK</td>
                  </tr>
                </tbody>
              </table>
            </div>
          </details>
        </div>
      </section>
    </main>
    <footer>
      (c) Attribution-ShareAlike 4.0 International <br />
      A service by
      <a href="https://myco.systems/">MycoSystems LLC</a>
    </footer>
  </body>
</html>