tweak collection page
This commit is contained in:
Your Name
Henri Dickson
parent
8d49ff4bf2
commit
2db748dff6
5 changed files with 80 additions and 84 deletions
|
|
@ -11,7 +11,7 @@
|
|||
{% load user_actions %}
|
||||
{% load duration %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" id="item-page">
|
||||
<html lang="en" class="item-page">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
#item-page {
|
||||
.item-page {
|
||||
|
||||
.muted {
|
||||
color: var(--pico-muted-color);
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
#item-page {
|
||||
.item-page {
|
||||
main {
|
||||
width: 100vw;
|
||||
padding: calc(1*var(--pico-spacing)) calc(3*var(--pico-spacing));
|
||||
|
|
@ -188,7 +188,7 @@
|
|||
margin: var(--pico-spacing);
|
||||
}
|
||||
|
||||
>div:has(article) {
|
||||
>div:has(>article) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -29,64 +29,63 @@
|
|||
{% include "_header.html" %}
|
||||
<main>
|
||||
<div class="grid__main">
|
||||
<article>
|
||||
<header>
|
||||
<hgroup>
|
||||
<h3>
|
||||
<div class="action">
|
||||
{% if request.user.is_authenticated %}
|
||||
<span>
|
||||
{% liked_piece collection as liked %}
|
||||
{% include 'like_stats.html' with liked=liked piece=collection label='关注' icon='fa-bookmark' %}
|
||||
</span>
|
||||
<span>{% include '_feature_stats.html' with featured=featured_since %}</span>
|
||||
<span>
|
||||
<a href="#"
|
||||
hx-get="{% url 'journal:collection_share' collection.uuid %}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend"
|
||||
title="分享到联邦网络"><i class="fa-solid fa-share-nodes"></i></a>
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{{ collection.title }}
|
||||
{% if collection.visibility > 0 %}<small><i class="fa-solid fa-lock"></i></small>{% endif %}
|
||||
</h3>
|
||||
</hgroup>
|
||||
<div class="owner-info">
|
||||
<div class="owner">
|
||||
<span class="avatar">
|
||||
<img src="{{ collection.owner.mastodon_account.avatar }}"
|
||||
alt="{{ collection.owner.username }}">
|
||||
</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<p>
|
||||
<a href="{% url 'journal:user_profile' collection.owner.mastodon_username %}">{{ collection.owner.mastodon_account.display_name }}</a>
|
||||
<span class="handler">@{{ collection.owner.mastodon_username }}</span>
|
||||
</p>
|
||||
<p>
|
||||
{% for cat, count in collection.get_summary.items %}
|
||||
{% if count %}<span>{{ count }} {{ cat|prural_items }}</span> {% endif %}
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% if featured_since %}
|
||||
<p>
|
||||
<progress value="{{ stats.percentage }}"
|
||||
max="100"
|
||||
title="{{ stats.percentage }}%" />
|
||||
</p>
|
||||
<section>
|
||||
<hgroup>
|
||||
<h3>
|
||||
<div class="action">
|
||||
{% if request.user.is_authenticated %}
|
||||
<span>
|
||||
{% liked_piece collection as liked %}
|
||||
{% include 'like_stats.html' with liked=liked piece=collection label='关注' icon='fa-bookmark' %}
|
||||
</span>
|
||||
<span>{% include '_feature_stats.html' with featured=featured_since %}</span>
|
||||
<span>
|
||||
<a href="#"
|
||||
hx-get="{% url 'journal:collection_share' collection.uuid %}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend"
|
||||
title="分享到联邦网络"><i class="fa-solid fa-share-nodes"></i></a>
|
||||
</span>
|
||||
{% endif %}
|
||||
<div class="markdown-content">{{ collection.html | safe }}</div>
|
||||
</div>
|
||||
<div class="more">
|
||||
<div style="text-align: center;">
|
||||
<img src="{{ collection.cover|thumb:'normal' }}" alt="">
|
||||
</div>
|
||||
{{ collection.title }}
|
||||
{% if collection.visibility > 0 %}<small><i class="fa-solid fa-lock"></i></small>{% endif %}
|
||||
</h3>
|
||||
</hgroup>
|
||||
<div class="owner-info">
|
||||
<div class="owner">
|
||||
<span class="avatar">
|
||||
<img src="{{ collection.owner.mastodon_account.avatar }}"
|
||||
alt="{{ collection.owner.username }}">
|
||||
</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<p>
|
||||
<a href="{% url 'journal:user_profile' collection.owner.mastodon_username %}">{{ collection.owner.mastodon_account.display_name }}</a>
|
||||
<span class="handler">@{{ collection.owner.mastodon_username }}</span>
|
||||
</p>
|
||||
<p>
|
||||
{% for cat, count in collection.get_summary.items %}
|
||||
{% if count %}<span>{{ count }} {{ cat|prural_items }}</span> {% endif %}
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% if featured_since %}
|
||||
<p>
|
||||
<progress value="{{ stats.percentage }}"
|
||||
max="100"
|
||||
title="{{ stats.percentage }}%" />
|
||||
</p>
|
||||
{% endif %}
|
||||
<div class="markdown-content">{{ collection.html | safe }}</div>
|
||||
</div>
|
||||
<div class="more">
|
||||
<div style="text-align: center;">
|
||||
<img src="{{ collection.cover|thumb:'normal' }}" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
{% comment %}
|
||||
</div>
|
||||
</section>
|
||||
{% comment %}
|
||||
{% if featured_since %}
|
||||
<section style="min-width:10vw;">
|
||||
<div class="donut" style="background: conic-gradient(#7CBDFE 0deg {{ stats.complete_deg }}deg, #B4D2A5 {{ stats.complete_deg }}deg {{ stats.complete_deg|add:stats.progress_deg }}deg, #ccc {{ stats.complete_deg|add:stats.progress_deg }}deg 1deg );"><div class="hole"><div class="text">
|
||||
|
|
@ -108,28 +107,27 @@
|
|||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
{% endcomment %}
|
||||
<section>
|
||||
<div class="entity-list"
|
||||
hx-get="{% url 'journal:collection_retrieve_items' collection.uuid %}"
|
||||
hx-trigger="load"></div>
|
||||
</section>
|
||||
<footer>
|
||||
<div class="action">
|
||||
{% if request.user == collection.owner %}
|
||||
<span>
|
||||
<a href="{% url 'journal:collection_edit' collection.uuid %}">{% trans '编辑' %}</a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="{% url 'journal:collection_delete' collection.uuid %}">{% trans '删除' %}</a>
|
||||
</span>
|
||||
{% elif editable %}
|
||||
<a href="{% url 'journal:collection_edit' collection.uuid %}">{% trans '协助整理' %}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<span>创建于 {{ collection.created_time | date }}</span>
|
||||
</footer>
|
||||
</article>
|
||||
{% endcomment %}
|
||||
<section>
|
||||
<div class="entity-list"
|
||||
hx-get="{% url 'journal:collection_retrieve_items' collection.uuid %}"
|
||||
hx-trigger="load"></div>
|
||||
</section>
|
||||
<section>
|
||||
<div class="action">
|
||||
{% if request.user == collection.owner %}
|
||||
<span>
|
||||
<a href="{% url 'journal:collection_edit' collection.uuid %}">{% trans '编辑' %}</a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="{% url 'journal:collection_delete' collection.uuid %}">{% trans '删除' %}</a>
|
||||
</span>
|
||||
{% elif editable %}
|
||||
<a href="{% url 'journal:collection_edit' collection.uuid %}">{% trans '协助整理' %}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<span>创建于 {{ collection.created_time | date }}</span>
|
||||
</section>
|
||||
</div>
|
||||
{% include "_sidebar.html" with user=collection.owner show_profile=1 %}
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
{% endif %}
|
||||
</span>
|
||||
{% include "_item_card.html" with item=item %}
|
||||
{% if mark or collection_member %}
|
||||
{% if mark or collection_edit or collection_member.note %}
|
||||
<footer>
|
||||
{% if mark %}
|
||||
<section>
|
||||
|
|
@ -104,9 +104,7 @@
|
|||
{% endif %}
|
||||
{% endif %}
|
||||
{% if collection_member %}
|
||||
<p class="entity-marks__mark-content"
|
||||
hx-target="this"
|
||||
hx-swap="innerHTML">
|
||||
<p hx-target="this" hx-swap="innerHTML">
|
||||
{% if collection_edit %}
|
||||
<span class="action">
|
||||
<a title="修改备注"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue