AkurAI-Platform / frontend/index.html

Latest change 27dec3641b699076dd38e17d7e89e5b88a93b0b4 - feat: add EC2 platform gateway by Olafur Bui

{% include "header" %}
    <main>
      <section class="hero-band">
        <div class="hero-grid">
          <div class="hero-copy">
            <p class="eyebrow">{{ host }} · {{ vm_ip }}</p>
            <h1>EC2 gateway for AkurAI services.</h1>
            <p class="lede">{{ summary }}</p>
            <div class="hero-actions">
              <a class="button primary" href="#services">Services</a>
              <a class="button secondary" href="#ports">Ports</a>
            </div>
            <div id="health" class="health-pill" aria-live="polite">checking framework health</div>
          </div>
          <div class="topology" aria-label="EC2 service topology">
            <div class="topology-head">
              <span>edge</span>
              <strong>nginx</strong>
            </div>
            <div class="topology-lines">
              <span></span><span></span><span></span><span></span>
            </div>
            <div class="topology-grid">
              <span>3000</span>
              <span>3500</span>
              <span>8094</span>
              <span>8097</span>
              <span>8644</span>
              <span>8800</span>
            </div>
          </div>
        </div>
      </section>

      <section class="metric-band" aria-label="Inventory totals">
        <div class="metrics">
          {% for stat in stats %}
          <div class="metric">
            <strong>{{ stat.value }}</strong>
            <span>{{ stat.label }}</span>
          </div>
          {% endfor %}
        </div>
      </section>

      <section id="services" class="section">
        <div class="section-head">
          <p class="eyebrow">inventory</p>
          <h2>VM-local services</h2>
          <p>Only services hosted or configured on the EC2 VM are listed.</p>
        </div>
        <div class="service-grid">
          {% for service in services %}
          <article class="service-card service-{{ service.status }}">
            <div class="service-top">
              <div>
                <p class="service-kind">{{ service.kind }}</p>
                <h3>{{ service.name }}</h3>
              </div>
              <span class="state">{{ service.status_label }}</span>
            </div>
            <p class="service-note">{{ service.note }}</p>
            <dl class="service-meta">
              <div><dt>unit</dt><dd>{{ service.unit }}</dd></div>
              <div><dt>upstream</dt><dd>{{ service.upstream }}</dd></div>
              <div><dt>process</dt><dd>{{ service.process }}</dd></div>
            </dl>
            <div class="service-link">
              <a href="{{ service.url }}">{{ service.url }}</a>
            </div>
          </article>
          {% endfor %}
        </div>
      </section>

      <section id="ports" class="section table-section">
        <div class="section-head">
          <p class="eyebrow">sockets</p>
          <h2>Listening ports</h2>
          <p>Public listeners and local upstreams observed on the VM.</p>
        </div>
        <div class="table-wrap">
          <table>
            <thead>
              <tr><th>Port</th><th>Bind</th><th>Owner</th><th>Surface</th></tr>
            </thead>
            <tbody>
              {% for port in ports %}
              <tr>
                <td>{{ port.port }}</td>
                <td>{{ port.bind }}</td>
                <td>{{ port.owner }}</td>
                <td>{{ port.surface }}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      </section>

      <section id="vhosts" class="section table-section">
        <div class="section-head">
          <p class="eyebrow">edge</p>
          <h2>Nginx vhosts</h2>
          <p>Enabled vhost routes on the EC2 nginx edge.</p>
        </div>
        <div class="vhost-list">
          {% for vhost in vhosts %}
          <div class="vhost-row">
            <span>{{ vhost.host }}</span>
            <code>{{ vhost.target }}</code>
            <strong>{{ vhost.status }}</strong>
          </div>
          {% endfor %}
        </div>
      </section>
    </main>
{% include "footer" %}