codoseo-web 0.1.0-rc.1

The CodoSEO web app: axum routes, askama templates and htmx partials.
Documentation
{% extends "base.html" %}
{% block main %}
<div class="page">
{% if let Some(e) = empty %}
  <div class="page-head"><h1>Crawl comparison</h1></div>
  <div class="card">
    <div class="empty">
      <div class="art"><svg class="icon"><use href="#i-changes"/></svg></div>
      <h2>{{ e.title }}</h2>
      <p>{{ e.text }}</p>
      {% if e.can_run %}<button class="btn btn-primary" hx-post="{{ base }}/crawls" hx-swap="none" hx-disabled-elt="this"><span class="play"></span>Run crawl</button>{% endif %}
    </div>
  </div>
{% else if let Some(c) = cmp %}
  <div class="page-head">
    <h1>Crawl comparison</h1>
    <span class="chip">{{ c.from_chip }}</span>
    <svg class="icon faint" aria-label="compared with"><use href="#i-arrow"/></svg>
    <span class="chip">{{ c.to_chip }}</span>
  </div>
  <div class="tiles">
    {% for t in c.tiles %}<div class="tile"><div class="tile-label">{{ t.label }}</div><div class="tile-value{% if !t.class.is_empty() %} {{ t.class }}{% endif %}">{{ t.value }}</div></div>{% endfor %}
  </div>
  <div class="cols">
    <div class="card">
      <div class="card-head">
        <nav class="tabs" aria-label="Severity">
          {% for t in c.tabs %}<a class="tab{% if t.active %} is-active{% endif %}" href="{{ t.href }}"{% if t.active %} aria-current="page"{% endif %}>{{ t.label }}<span class="n">{{ t.n }}</span></a>{% endfor %}
        </nav>
      </div>
      {% if let Some(msg) = c.nothing %}
      <div class="empty">
        <div class="art"><svg class="icon"><use href="#i-check"/></svg></div>
        <h2>No changes</h2>
        <p>{{ msg }}</p>
      </div>
      {% else if let Some(msg) = c.tab_empty %}
      <div class="empty-sm">{{ msg }}</div>
      {% else %}
      <div class="rows">
        {% for r in c.rows %}
        <div class="row-item change" style="grid-template-columns:minmax(0,1fr);gap:0">
          <div style="display:flex;align-items:center;gap:10px;min-width:0">
            <span class="badge sev-{{ r.severity }}">{{ r.severity_label }}</span>
            <span style="font-weight:500;white-space:nowrap">{{ r.title }}</span>
            {% if let Some(path) = r.path %}{% if let Some(href) = r.href %}<a class="url trunc" href="{{ href }}">{{ path }}</a>{% else %}<span class="mono c-muted trunc" style="font-size:12.5px">{{ path }}</span>{% endif %}{% else %}<span class="tag">site-wide</span>{% endif %}
            <span class="grow"></span>
            <span class="c-muted" style="display:inline-flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap"><svg class="icon" style="width:13px;height:13px"><use href="#{{ r.mode_icon }}"/></svg>{{ r.mode }}</span>
          </div>
          <div class="diff"><div class="before">{{ r.before }}</div><div class="after{{ r.after_class }}">{{ r.after }}</div></div>
        </div>
        {% endfor %}
      </div>
      {% if let Some(m) = c.more %}<div class="load-more">{{ m }}</div>{% endif %}
      {% endif %}
    </div>
    <div class="stack">
      <div class="card">
        <div class="card-head"><span class="card-title">Health score by crawl</span><span class="card-aside">{{ c.score_aside }}</span></div>
        <div class="card-pad" style="padding-top:2px">
          <div class="spark">{% for b in c.spark %}<span{% if !b.class.is_empty() %} class="{{ b.class }}"{% endif %} style="height:{{ b.height }}%{% if b.class.is_empty() %};background:var(--ok-soft){% endif %}" data-tip="{{ b.tip }}"></span>{% endfor %}</div>
          <div class="mono faint" style="display:flex;justify-content:space-between;margin-top:6px;font-size:11px"><span>{{ c.spark_first }}</span><span>{{ c.spark_last }}</span></div>
        </div>
      </div>
      <div class="card">
        <div class="card-head"><span class="card-title">Alert rules</span><span class="card-aside">defaults</span></div>
        <div class="rows">
          {% for r in c.rules %}<div class="row-item" style="grid-template-columns:minmax(0,1fr) auto"><span>{{ r.label }}</span><span class="badge {% if r.instant %}t-accent{% else %}t-muted{% endif %}">{{ r.mode }}</span></div>{% endfor %}
        </div>
        <div class="card-pad hint" style="padding-top:12px;padding-bottom:14px"><a href="/settings/alerts">Choose what is sent at once, and where</a>.</div>
      </div>
    </div>
  </div>
{% endif %}
</div>
{% endblock %}