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

Merge pull request #973 from joachimesque/dropdown-style

Browse source 
Dropdown component design fixes
This commit is contained in:
Mouse Reeve 2021-04-21 13:08:41 -07:00 committed by GitHub
commit 85b1c920cd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 34 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
bookwyrm/templates/components/dropdown.html
View file

@ -23,7 +23,7 @@
<div class="dropdown-menu"> <div class="dropdown-menu">
<ul <ul
id="menu-options-{{ uuid }}" id="menu-options-{{ uuid }}"
class="dropdown-content" class="dropdown-content p-0 is-clipped"
role="menu" role="menu"
> >
{% block dropdown-list %}{% endblock %} {% block dropdown-list %}{% endblock %}

14
bookwyrm/templates/snippets/shelf_selector.html
View file

@ -7,23 +7,23 @@
{% block dropdown-list %} {% block dropdown-list %}
{% for shelf in request.user.shelf_set.all %} {% for shelf in request.user.shelf_set.all %}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<form class="dropdown-item pt-0 pb-0" name="shelve" action="/shelve/" method="post"> <form name="shelve" action="/shelve/" method="post">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}"> <input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="change-shelf-from" value="{{ current.identifier }}"> <input type="hidden" name="change-shelf-from" value="{{ current.identifier }}">
<input type="hidden" name="shelf" value="{{ shelf.identifier }}"> <input type="hidden" name="shelf" value="{{ shelf.identifier }}">
<button class="button is-fullwidth is-small shelf-option" type="submit" {% if shelf.identifier == current.identifier %}disabled{% endif %}><span>{{ shelf.name }}</span></button> <button class="button is-fullwidth is-small shelf-option is-radiusless is-white" type="submit" {% if shelf.identifier == current.identifier %}disabled{% endif %}><span>{{ shelf.name }}</span></button>
</form> </form>
</li> </li>
{% endfor %} {% endfor %}
<li class="navbar-divider" role="presentation"></li> <li class="navbar-divider" role="separator"></li>
<li> <li role="menuitem" class="dropdown-item p-0">
<form class="dropdown-item pt-0 pb-0" name="shelve" action="/unshelve/" method="post"> <form name="shelve" action="/unshelve/" method="post">
{% csrf_token %} {% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}"> <input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="shelf" value="{{ current.id }}"> <input type="hidden" name="shelf" value="{{ current.id }}">
<button class="button is-fullwidth is-small is-danger is-light" type="submit">{% trans "Remove" %}</button> <button class="button is-fullwidth is-small is-radiusless is-danger is-light" type="submit">{% trans "Remove" %}</button>
</form> </form>
</li> </li>
{% endblock %} {% endblock %}

2
bookwyrm/templates/snippets/shelve_button/shelve_button_dropdown.html
View file

@ -7,5 +7,5 @@
{% endblock %} {% endblock %}
{% block dropdown-list %} {% block dropdown-list %}
{% include 'snippets/shelve_button/shelve_button_options.html' with active_shelf=active_shelf shelves=request.user.shelf_set.all dropdown=True class="shelf-option is-fullwidth is-small" %} {% include 'snippets/shelve_button/shelve_button_options.html' with active_shelf=active_shelf shelves=request.user.shelf_set.all dropdown=True class="shelf-option is-fullwidth is-small is-radiusless is-white" %}
{% endblock %} {% endblock %}

28
bookwyrm/templates/snippets/shelve_button/shelve_button_options.html
View file

@ -2,8 +2,8 @@
{% load i18n %} {% load i18n %}
{% for shelf in shelves %} {% for shelf in shelves %}
{% comparison_bool shelf.identifier active_shelf.shelf.identifier as is_current %} {% comparison_bool shelf.identifier active_shelf.shelf.identifier as is_current %}
{% if dropdown %}<li role="menuitem">{% endif %} {% if dropdown %}<li role="menuitem" class="dropdown-item p-0">{% endif %}
<div class="{% if dropdown %}dropdown-item pt-0 pb-0{% elif active_shelf.shelf.identifier|next_shelf != shelf.identifier %}is-hidden{% endif %}"> <div class="{% if not dropdown and active_shelf.shelf.identifier|next_shelf != shelf.identifier %}is-hidden{% endif %}">
{% if shelf.identifier == 'reading' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %} {% if shelf.identifier == 'reading' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %}
{% trans "Start reading" as button_text %} {% trans "Start reading" as button_text %}
{% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="start-reading" controls_uid=button_uuid focus="modal-title-start-reading" disabled=is_current %} {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="start-reading" controls_uid=button_uuid focus="modal-title-start-reading" disabled=is_current %}
@ -30,24 +30,20 @@
{% if dropdown %} {% if dropdown %}
{% if readthrough and active_shelf.shelf.identifier != 'read' %} {% if readthrough and active_shelf.shelf.identifier != 'read' %}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<div class="dropdown-item pt-0 pb-0"> {% trans "Update progress" as button_text %}
{% trans "Update progress" as button_text %} {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="progress-update" controls_uid=button_uuid focus="modal-title-progress-update" %}
{% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="progress-update" controls_uid=button_uuid focus="modal-title-progress-update" %}
</div>
</li> </li>
{% endif %} {% endif %}
{% if active_shelf.shelf %} {% if active_shelf.shelf %}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<div class="dropdown-item pt-0 pb-0"> <form name="shelve" action="/unshelve/" method="post">
<form name="shelve" action="/unshelve/" method="post"> {% csrf_token %}
{% csrf_token %} <input type="hidden" name="book" value="{{ active_shelf.book.id }}">
<input type="hidden" name="book" value="{{ active_shelf.book.id }}"> <input type="hidden" name="shelf" value="{{ active_shelf.shelf.id }}">
<input type="hidden" name="shelf" value="{{ active_shelf.shelf.id }}"> <button class="button is-fullwidth is-small{% if dropdown %} is-radiusless{% endif %} is-danger is-light" type="submit">{% blocktrans with name=active_shelf.shelf.name %}Remove from {{ name }}{% endblocktrans %}</button>
<button class="button is-fullwidth is-small is-danger is-light" type="submit">{% blocktrans with name=active_shelf.shelf.name %}Remove from {{ name }}{% endblocktrans %}</button> </form>
</form>
</div>
</li> </li>
{% endif %} {% endif %}

2
bookwyrm/templates/snippets/status/layout.html
View file

@ -16,7 +16,7 @@
{% if moderation_mode and perms.bookwyrm.moderate_post %} {% if moderation_mode and perms.bookwyrm.moderate_post %}
{# moderation options #} {# moderation options #}
<form class="dropdown-item pt-0 pb-0" name="delete-{{status.id}}" action="/delete-status/{{ status.id }}" method="post"> <form name="delete-{{status.id}}" action="/delete-status/{{ status.id }}" method="post">
{% csrf_token %} {% csrf_token %}
<button class="button is-danger is-light" type="submit"> <button class="button is-danger is-light" type="submit">
{% trans "Delete status" %} {% trans "Delete status" %}

22
bookwyrm/templates/snippets/status/status_options.html
View file

@ -11,19 +11,19 @@
{% block dropdown-list %} {% block dropdown-list %}
{% if status.user == request.user %} {% if status.user == request.user %}
{# things you can do to your own statuses #} {# things you can do to your own statuses #}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<form class="dropdown-item pt-0 pb-0" name="delete-{{status.id}}" action="/delete-status/{{ status.id }}" method="post"> <form name="delete-{{status.id}}" action="/delete-status/{{ status.id }}" method="post">
{% csrf_token %} {% csrf_token %}
<button class="button is-danger is-light is-fullwidth is-small" type="submit"> <button class="button is-radiusless is-danger is-light is-fullwidth is-small" type="submit">
{% trans "Delete status" %} {% trans "Delete status" %}
</button> </button>
</form> </form>
</li> </li>
{% if status.status_type != 'GeneratedNote' and status.status_type != 'Rating' %} {% if status.status_type != 'GeneratedNote' and status.status_type != 'Rating' %}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<form class="dropdown-item pt-0 pb-0" name="delete-{{status.id}}" action="{% url 'redraft' status.id %}" method="post"> <form class="" name="delete-{{status.id}}" action="{% url 'redraft' status.id %}" method="post">
{% csrf_token %} {% csrf_token %}
<button class="button is-danger is-light is-fullwidth is-small" type="submit"> <button class="button is-radiusless is-danger is-light is-fullwidth is-small" type="submit">
{% trans "Delete & re-draft" %} {% trans "Delete & re-draft" %}
</button> </button>
</form> </form>
@ -31,13 +31,15 @@
{% endif %} {% endif %}
{% else %} {% else %}
{# things you can do to other people's statuses #} {# things you can do to other people's statuses #}
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
<a href="{% url 'direct-messages-user' status.user|username %}" class="button is-small is-fullwidth">{% trans "Send direct message" %}</a> <a href="{% url 'direct-messages-user' status.user|username %}" class="button is-small is-white is-radiusless is-fullwidth">
{% trans "Send direct message" %}
</a>
</li> </li>
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
{% include 'snippets/report_button.html' with user=status.user status=status %} {% include 'snippets/report_button.html' with user=status.user status=status %}
</li> </li>
<li role="menuitem"> <li role="menuitem" class="dropdown-item p-0">
{% include 'snippets/block_button.html' with user=status.user class="is-fullwidth" %} {% include 'snippets/block_button.html' with user=status.user class="is-fullwidth" %}
</li> </li>
{% endif %} {% endif %}