62 lines
2.3 KiB
HTML
62 lines
2.3 KiB
HTML
{% set pct = (100 * host.count // (max_count or 1)) %}
|
|
<article class="rounded-2xl bg-[var(--ra-panel)] border border-[var(--ra-copper)] overflow-hidden">
|
|
<header class="p-4 flex items-center justify-between gap-4">
|
|
<div class="min-w-0">
|
|
<h2 class="text-xl font-semibold break-all">{{ host.hostname }}</h2>
|
|
<div class="text-sm opacity-80">
|
|
<span class="mr-3">Links: <strong>{{ host.count }}</strong></span>
|
|
<span>Unique: <strong>{{ host.unique_link_count }}</strong></span>
|
|
</div>
|
|
</div>
|
|
{% if host.feed_url %}
|
|
<a href="{{ host.feed_url }}" target="_blank" rel="noopener"
|
|
class="shrink-0 px-3 py-1 rounded-lg bg-[var(--ra-amber)] text-[var(--ra-ink)] font-semibold hover:opacity-90">
|
|
RSS / Atom
|
|
</a>
|
|
{% endif %}
|
|
</header>
|
|
|
|
<div class="bar-wrap">
|
|
<div class="bar" style="width: {{ pct }}%"></div>
|
|
</div>
|
|
|
|
<div class="p-4 space-y-4">
|
|
{% if host.top_links %}
|
|
<div>
|
|
<div class="text-sm font-semibold mb-2">Top links (mentioned > 1):</div>
|
|
<ul class="space-y-1 text-sm">
|
|
{% for tl in host.top_links %}
|
|
<li class="flex items-baseline gap-2">
|
|
<span class="inline-block px-2 py-0.5 rounded-md bg-[var(--ra-ruby)]">{{ tl.count }}</span>
|
|
<a class="link" href="{{ tl.url }}" target="_blank" rel="noopener">{{ tl.url }}</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% set list_id = "links-" ~ index %}
|
|
{% set links = host.links %}
|
|
{% set preview = links[:8] %}
|
|
{% set remainder = links[8:] %}
|
|
<div>
|
|
<div class="text-sm font-semibold mb-2">Links:</div>
|
|
<ul class="space-y-1 text-sm">
|
|
{% for url in preview %}
|
|
<li><a class="link" href="{{ url }}" target="_blank" rel="noopener">{{ url }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
|
|
{% if remainder %}
|
|
<div id="{{ list_id }}" class="more-list" data-expanded="false">
|
|
<ul class="space-y-1 text-sm">
|
|
{% for url in remainder %}
|
|
<li><a class="link" href="{{ url }}" target="_blank" rel="noopener">{{ url }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
<button class="btn-more mt-2" data-more-btn data-target="{{ list_id }}">More</button>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</article>
|