101 lines
3.6 KiB
HTML
101 lines
3.6 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
|
|
<!-- Top tag row -->
|
|
{% if tags_all %}
|
|
<div class="mb-4 overflow-x-auto">
|
|
<div class="flex items-center gap-2 min-w-max">
|
|
{% for t in tags_all %}
|
|
{% set name = t.name if t.name is defined else t['name'] %}
|
|
{% set cnt = t.cnt if t.cnt is defined else t['cnt'] %}
|
|
<a
|
|
href="/readitlater/?tag={{ name|e }}"
|
|
class="text-xs rounded-full px-2 py-1 border
|
|
{% if filter_tags and name in filter_tags %}
|
|
bg-blue-600 text-white border-blue-600
|
|
{% else %}
|
|
bg-slate-100 text-slate-800 border-slate-200 hover:bg-slate-200
|
|
{% endif %}">
|
|
#{{ name }} <span class="opacity-70">({{ cnt }})</span>
|
|
</a>
|
|
{% endfor %}
|
|
{% if filter_tags %}
|
|
<a href="/readitlater/" class="text-xs px-2 py-1 rounded-full border bg-white hover:bg-slate-50">Clear</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if q %}
|
|
<h1 class="text-xl font-semibold mb-4">Search results for “{{ q }}”</h1>
|
|
{% elif filter_tags %}
|
|
<h1 class="text-xl font-semibold mb-2">Tagged</h1>
|
|
<div class="mb-4 flex gap-2">
|
|
{% for t in filter_tags %}
|
|
<a href="/readitlater/?tag={{ t|e }}" class="text-xs bg-slate-100 border border-slate-200 rounded-full px-2 py-1">#{{ t }}</a>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<h1 class="text-xl font-semibold mb-4">Latest</h1>
|
|
{% endif %}
|
|
|
|
<ul class="space-y-3">
|
|
{% for r in rows %}
|
|
<li class="bg-white p-4 rounded shadow-sm">
|
|
<div class="flex items-start gap-3">
|
|
{% if r.thumb_url %}
|
|
<img
|
|
src="{{ r.thumb_url }}"
|
|
alt=""
|
|
loading="lazy"
|
|
class="w-16 h-16 rounded object-cover flex-shrink-0 border border-slate-200"
|
|
referrerpolicy="no-referrer"
|
|
/>
|
|
{% else %}
|
|
<div class="w-16 h-16 rounded bg-slate-100 border border-slate-200 flex items-center justify-center text-slate-400 text-xs flex-shrink-0">
|
|
No img
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="min-w-0 flex-1">
|
|
<a class="font-medium text-blue-700" href="/readitlater/item/{{ r.id }}">
|
|
{{ r.title or "Untitled" }}
|
|
</a>
|
|
{% if r.url %}
|
|
<div class="text-sm text-slate-500 truncate">{{ r.url }}</div>
|
|
{% endif %}
|
|
<div class="text-xs text-slate-400 mt-1">{{ r.added_at|format_est }}</div>
|
|
|
|
{% set tags_for_item = tagmap.get(r.id, []) %}
|
|
{% if tags_for_item %}
|
|
<div class="mt-2 flex flex-wrap gap-2">
|
|
{% for t in tags_for_item %}
|
|
<a href="/readitlater/?tag={{ t|e }}"
|
|
class="text-xs bg-slate-100 border border-slate-200 rounded-full px-2 py-1 hover:bg-slate-200">
|
|
#{{ t }}
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<form
|
|
hx-post="/readitlater/item/{{ r.id }}/delete"
|
|
hx-confirm="Delete this item?"
|
|
class="ml-3">
|
|
<button
|
|
type="submit"
|
|
aria-label="Delete"
|
|
title="Delete"
|
|
class="text-white bg-red-600 hover:bg-red-700 focus:ring-2 focus:ring-red-300 rounded-full w-7 h-7 flex items-center justify-center">
|
|
✕
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</li>
|
|
{% else %}
|
|
<li class="text-slate-500">No items yet. Use the browser extension to save a page.</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endblock %}
|