rafaelcaricio/moviewyrm
1
0
Fork 0
forked from mirrors/bookwyrm
Code Issues 4 Pull requests Projects Releases Wiki Activity

Cleans up styling on author page

Browse source 
Better mobile display, trim long text blocks
This commit is contained in:
Mouse Reeve 2021-12-07 11:23:01 -08:00
parent 02313f40b8
commit 7dbb9b4b26
2 changed files with 123 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
bookwyrm/templates/author/author.html
View file

@ -23,41 +23,54 @@
</div>
</div>
<div class="block columns content" itemscope itemtype="https://schema.org/Person">
<div class="block columns is-flex-direction-row-reverse" itemscope itemtype="https://schema.org/Person">
<meta itemprop="name" content="{{ author.name }}">
{% if author.bio %}
<div class="column">
{% include "snippets/trimmed_text.html" with full=author.bio trim_length=200 %}
</div>
{% endif %}
{% if author.aliases or author.born or author.died or author.wikipedia_link or author.openlibrary_key or author.inventaire_id or author.isni %}
{% firstof author.aliases author.born author.died as details %}
{% firstof author.wikipedia_link author.openlibrary_key author.inventaire_id author.isni as links %}
{% if details or links %}
<div class="column is-two-fifths">
<div class="box py-2">
<dl>
{% if details %}
<section class="block content">
<h2 class="title is-4">{% trans "Author details" %}</h2>
<dl class="box">
{% if author.aliases %}
<div class="is-flex is-flex-wrap-wrap my-1">
<div class="is-flex is-flex-wrap-wrap mr-1">
<dt class="has-text-weight-bold mr-1">{% trans "Aliases:" %}</dt>
{% for alias in author.aliases %}
<dd itemprop="alternateName" content="{{alias}}">
{{alias}}{% if not forloop.last %},&nbsp;{% endif %}
<dd>
{% include "snippets/trimmed_list.html" with items=author.aliases itemprop="alternateName" %}
</dd>
{% endfor %}
</div>
{% endif %}
{% if author.born %}
<div class="is-flex my-1">
<div class="is-flex mt-1">
<dt class="has-text-weight-bold mr-1">{% trans "Born:" %}</dt>
<dd itemprop="birthDate">{{ author.born|naturalday }}</dd>
</div>
{% endif %}
{% if author.died %}
<div class="is-flex my-1">
<div class="is-flex mt-1">
<dt class="has-text-weight-bold mr-1">{% trans "Died:" %}</dt>
<dd itemprop="deathDate">{{ author.died|naturalday }}</dd>
</div>
{% endif %}
</dl>
</section>
{% endif %}
{% if links %}
<section>
<h2 class="title is-4">{% trans "External links" %}</h2>
<div class="box">
{% if author.wikipedia_link %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="{{ author.wikipedia_link }}" rel="noopener" target="_blank">
{% trans "Wikipedia" %}
</a>
@ -65,7 +78,7 @@
{% endif %}
{% if author.isni %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="{{ author.isni_link }}" rel="noopener" target="_blank">
{% trans "View ISNI record" %}
</a>
@ -73,7 +86,7 @@
{% endif %}
{% if author.openlibrary_key %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="{{ author.openlibrary_link }}" target="_blank" rel="noopener">
{% trans "View on OpenLibrary" %}
</a>
@ -87,7 +100,7 @@
{% endif %}
{% if author.inventaire_id %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="{{ author.inventaire_link }}" target="_blank" rel="noopener">
{% trans "View on Inventaire" %}
</a>
@ -101,7 +114,7 @@
{% endif %}
{% if author.librarything_key %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="https://www.librarything.com/author/{{ author.librarything_key }}" target="_blank" rel="noopener">
{% trans "View on LibraryThing" %}
</a>
@ -109,28 +122,29 @@
{% endif %}
{% if author.goodreads_key %}
<p class="my-1">
<p>
<a itemprop="sameAs" href="https://www.goodreads.com/author/show/{{ author.goodreads_key }}" target="_blank" rel="noopener">
{% trans "View on Goodreads" %}
</a>
</p>
{% endif %}
</div>
</div>
{% endif %}
<div class="column">
{% if author.bio %}
{{ author.bio|to_markdown|safe }}
</section>
{% endif %}
</div>
{% endif %}
</div>
<hr aria-hidden="true">
<div class="block">
<h3 class="title is-4">{% blocktrans with name=author.name %}Books by {{ name }}{% endblocktrans %}</h3>
<h2 class="title is-4">{% blocktrans with name=author.name %}Books by {{ name }}{% endblocktrans %}</h2>
<div class="columns is-multiline is-mobile">
{% for book in books %}
<div class="column is-one-fifth">
<div class="column is-one-fifth-tablet is-half-mobile is-flex is-flex-direction-column">
<div class="is-flex-grow-1">
{% include 'landing/small-book.html' with book=book %}
</div>
{% include 'snippets/shelve_button/shelve_button.html' with book=book %}
</div>
{% endfor %}

34
bookwyrm/templates/snippets/trimmed_list.html Normal file
View file

@ -0,0 +1,34 @@
{% spaceless %}
{% load i18n %}
{% load humanize %}
{% firstof limit 3 as limit %}
{% with subtraction_value='-'|add:limit %}
{% with remainder_count=items|length|add:subtraction_value %}
{% with remainder_count_display=remainder_count|intcomma %}
<details>
<summary>
{% for item in items|slice:limit %}
<span
{% if itemprop %}itemprop="{{ itemprop }}"{% endif %}
>{{ item }}</span>{% if not forloop.last %}, {% elif remainder_count > 0 %}, {% blocktrans trimmed count counter=remainder_count %}
and {{ remainder_count_display }} other
{% plural %}
and {{ remainder_count_display }} others
{% endblocktrans %}
{% endif %}
{% endfor %}
</summary>
{% for item in items|slice:"3:" %}
<span
{% if itemprop %}itemprop="{{ itemprop }}"{% endif %}
>{{ item }}</span>{% if not forloop.last %}, {% endif %}
{% endfor %}
</details>
{% endwith %}
{% endwith %}
{% endwith %}
{% endspaceless %}