Expand reply/boost/fav buttons into icon+text

Besides accessibility, this also resolves a weird little layout problem on the
dark theme
This commit is contained in:
Jason McBrayer 2018-08-28 20:10:15 -04:00
parent 4f7937f5e4
commit 7692cd3bcc
1 changed files with 8 additions and 8 deletions

View File

@ -85,32 +85,32 @@
<nav class="level is-mobile"> <nav class="level is-mobile">
<div class="level-left"> <div class="level-left">
<a href="{% url "reply" toot.id %}" class="level-item"> <a href="{% url "reply" toot.id %}" class="level-item">
<span class="icon is-small"><span class="fa fa-reply"> <span ><span class="fa fa-reply">
<span class="is-invisible">Reply</span> <span>Reply</span>
</span></span> </span></span>
</a> </a>
{% if toot.visibility != 'private' and toot.visibility != 'direct' %} {% if toot.visibility != 'private' and toot.visibility != 'direct' %}
<a href="{% url "boost" toot.id %}" class="level-item"> <a href="{% url "boost" toot.id %}" class="level-item">
<span class="icon is-small"> <span >
{% if toot.reblogged %} {% if toot.reblogged %}
<span class="fa fa-retweet has-text-warning"> <span class="fa fa-retweet has-text-warning">
<strong class="is-invisible" >Boosted</strong> <strong >Boosted</strong>
{% else %} {% else %}
<span class="fa fa-retweet" > <span class="fa fa-retweet" >
<span class="is-invisible" >Boost</span> <span >Boost</span>
{% endif %} {% endif %}
</span> </span>
</span> </span>
</a> </a>
{% endif %} {% endif %}
<a href="{% url "fav" toot.id %}" class="level-item"> <a href="{% url "fav" toot.id %}" class="level-item">
<span class="icon is-small"> <span>
{% if toot.favourited %} {% if toot.favourited %}
<span class="fa fa-heart has-text-warning"> <span class="fa fa-heart has-text-warning">
<strong class="is-invisible" >Favorited</strong> <strong >Favorited</strong>
{% else %} {% else %}
<span class="fa fa-heart"> <span class="fa fa-heart">
<span class="is-invisible" >Favorite</span> <span >Favorite</span>
{% endif %} {% endif %}
</span> </span>
</span> </span>