AkurAI-Platform / frontend/index.html

Latest change f9ad97f6d8275ebdd13ec7823f9186bdad2c744a - feat: present AkurAI source-linked platform by Olafur Bui

{% include "header" %}
    <main>
      <section class="hero">
        <img class="hero-image" src="{{ hero.image }}" alt="{{ hero.image_alt }}" />
        <div class="hero-overlay"></div>
        <div class="hero-content">
          <p class="eyebrow">{{ hero.eyebrow }}</p>
          <h1>{{ hero.headline }}</h1>
          <p class="lede">{{ hero.lede }}</p>
          <div class="hero-actions">
            <a class="button primary" href="#projects">Projects</a>
            <a class="button secondary" href="{{ github.url }}">GitHub</a>
          </div>
          <div id="health" class="health-pill" aria-live="polite">checking platform</div>
        </div>
      </section>

      <section class="metric-strip" aria-label="Platform highlights">
        {% for stat in stats %}
        <div class="metric">
          <strong>{{ stat.value }}</strong>
          <span>{{ stat.label }}</span>
        </div>
        {% endfor %}
      </section>

      <section id="source" class="section source-callout">
        <div>
          <p class="eyebrow">source</p>
          <h2>Live services tied to source repos.</h2>
          <p>{{ github.text }}</p>
        </div>
        <a class="button primary" href="{{ github.url }}">{{ github.label }}</a>
      </section>

      <section id="projects" class="section">
        <div class="section-head">
          <p class="eyebrow">projects</p>
          <h2>Deployments and repositories</h2>
          <p>Live entries from this deployment are listed. Source links point to the matching GitHub repos.</p>
        </div>

        <div class="app-grid">
          {% for app in applications %}
          <article class="app-card">
            <div class="app-card-head">
              <p>{{ app.kind }}</p>
              <strong>{{ app.memory }}</strong>
            </div>
            <h3>{{ app.name }}</h3>
            <p class="app-description">{{ app.description }}</p>
            <div class="memory-bar" aria-label="{{ app.memory }}">
              <span style="--bar: {{ app.bar }}%;"></span>
            </div>
            <div class="app-footer">
              <code>{{ app.unit }}</code>
              <a class="live-link" href="{{ app.url }}">{{ app.action }}</a>
              <span class="no-link">{{ app.action }}</span>
            </div>
            <div class="repo-links" aria-label="{{ app.name }} source repositories">
              {% for repo in app.repos %}
              <a href="{{ repo.url }}">{{ repo.label }}</a>
              {% endfor %}
            </div>
          </article>
          {% endfor %}
        </div>
      </section>

      <section id="memory" class="section memory-section">
        <div class="memory-copy">
          <p class="eyebrow">memory</p>
          <h2>Measured where it runs</h2>
          <p>{{ methodology.text }}</p>
        </div>
        <div class="memory-ledger" aria-label="Memory comparison bars">
          {% for app in applications %}
          <div class="ledger-row">
            <span>{{ app.name }}</span>
            <div class="ledger-track"><strong style="--bar: {{ app.bar }}%;"></strong></div>
            <em>{{ app.memory }}</em>
          </div>
          {% endfor %}
        </div>
      </section>

      <section id="comparisons" class="section">
        <div class="section-head">
          <p class="eyebrow">references</p>
          <h2>Comparable memory references</h2>
          <p>Measured AkurAI processes are shown beside published sizing guidance or the local Next.js process. This is a footprint reference, not a load-test claim.</p>
        </div>

        <div class="comparison-grid">
          {% for comparison in comparisons %}
          <article class="comparison-card">
            <p>{{ comparison.name }}</p>
            <h3>{{ comparison.akur_memory }}</h3>
            <div class="comparison-line">
              <span>AkurAI</span>
              <strong>{{ comparison.other_memory }}</strong>
              <span>{{ comparison.other_product }}</span>
            </div>
            <p class="comparison-difference">{{ comparison.difference }}</p>
            <a href="{{ comparison.source_url }}">{{ comparison.source_label }}</a>
          </article>
          {% endfor %}
        </div>
      </section>

      <section id="methodology" class="section sources-section">
        <div>
          <p class="eyebrow">{{ methodology.label }}</p>
          <h2>Sources</h2>
          <p>{{ methodology.text }}</p>
        </div>
        <div class="source-list">
          {% for source in sources %}
          <a href="{{ source.url }}">{{ source.label }}</a>
          {% endfor %}
        </div>
      </section>
    </main>
{% include "footer" %}