mirrors/bookwyrm
1
0
Fork 1
mirror of https://github.com/bookwyrm-social/bookwyrm.git synced 2024-12-23 16:40:36 +00:00
Code Issues Projects Releases Wiki Activity

Use bulma screen-reader-only class

Browse source
This commit is contained in:
Mouse Reeve 2020-09-30 15:10:37 -07:00
parent ada6a79b1c
commit 982f734ce7
12 changed files with 22 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
bookwyrm/static/css/format.css
View file

@ -1,12 +1,4 @@
/* --- ICONS --- */
.hidden-text {
height: 0;
width: 0;
position: absolute;
overflow: hidden;
}
/* --- TOGGLES --- */
input.toggle-control {
display: none;

2
bookwyrm/templates/book.html
View file

@ -12,7 +12,7 @@
<div class="level-right">
<a href="{{ book.id }}/edit">edit
<span class="icon icon-pencil">
<span class="hidden-text">Edit Book</span>
<span class="is-sr-only">Edit Book</span>
</span>
</a>
</div>

2
bookwyrm/templates/edit_book.html
View file

@ -9,7 +9,7 @@
<div class="level-right">
<a href="/book/{{ book.id }}">
<span class="edit-link icon icon-close">
<span class="hidden-text">Close</span>
<span class="is-sr-only">Close</span>
</span>
</a>
</div>

4
bookwyrm/templates/layout.html
View file

@ -30,7 +30,7 @@
<input class="input" type="text" name="q" placeholder="Search for a book or user">
<button class="button" type="submit">
<span class="icon icon-search">
<span class="hidden-text">search</span>
<span class="is-sr-only">search</span>
</span>
</button>
</div>
@ -87,7 +87,7 @@
<div class="tags has-addons">
<span class="tag is-medium">
<span class="icon icon-bell">
<span class="hidden-text">Notitications</span>
<span class="is-sr-only">Notitications</span>
</span>
</span>
{% if request.user|notification_count %}

4
bookwyrm/templates/snippets/create_status.html
View file

@ -29,13 +29,13 @@
<div class="control">
<label class="label" for="id_content_{{ book.id }}_review">Review:</label>
<span class="hidden-text">Rating</span>
<span class="is-sr-only">Rating</span>
<div class="field is-grouped stars form-rate-stars">
<input class="hidden" type="radio" name="rating" value="" checked>
{% for i in '12345'|make_list %}
<input class="hidden" id="book{{book.id}}-star-{{ forloop.counter }}" type="radio" name="rating" value="{{ forloop.counter }}">
<label class="icon icon-star-empty" for="book{{book.id}}-star-{{ forloop.counter }}">
<span class="hidden-text">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span>
<span class="is-sr-only">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span>
</label>
{% endfor %}
</div>

16
bookwyrm/templates/snippets/interaction.html
View file

@ -8,7 +8,7 @@
<textarea name="content" placeholder="Leave a comment..." id="id_content_{{ activity.id }}" required="true"></textarea>
<button class="button" type="submit">
<span class="icon icon-comment">
<span class="hidden-text">Comment</span>
<span class="is-sr-only">Comment</span>
</span>
</button>
</div>
@ -18,7 +18,7 @@
{% csrf_token %}
<button class="button" type="submit">
<span class="icon icon-boost">
<span class="hidden-text">Boost status</span>
<span class="is-sr-only">Boost status</span>
</span>
</button>
</form>
@ -26,7 +26,7 @@
{% csrf_token %}
<button class="button is-success" type="submit">
<span class="icon icon-boost">
<span class="hidden-text">Un-boost status</span>
<span class="is-sr-only">Un-boost status</span>
</span>
</button>
</form>
@ -35,7 +35,7 @@
{% csrf_token %}
<button class="button" type="submit">
<span class="icon icon-heart">
<span class="hidden-text">Like status</span>
<span class="is-sr-only">Like status</span>
</span>
</button>
</form>
@ -43,22 +43,22 @@
{% csrf_token %}
<button class="button is-success" type="submit">
<span class="icon icon-heart">
<span class="hidden-text">Un-like status</span>
<span class="is-sr-only">Un-like status</span>
</span>
</button>
</form>
{% else %}
<a href="/login">
<span class="icon icon-comment">
<span class="hidden-text">Comment</span>
<span class="is-sr-only">Comment</span>
</span>
<span class="icon icon-boost">
<span class="hidden-text">Boost status</span>
<span class="is-sr-only">Boost status</span>
</span>
<span class="icon icon-heart">
<span class="hidden-text">Like status</span>
<span class="is-sr-only">Like status</span>
</span>
</a>
{% endif %}

4
bookwyrm/templates/snippets/rate_action.html
View file

@ -1,5 +1,5 @@
{% load fr_display %}
<span class="hidden-text">Leave a rating</span>
<span class="is-sr-only">Leave a rating</span>
<div class="field is-grouped stars rate-stars">
{% for i in '12345'|make_list %}
<form name="rate" action="/rate/" method="POST" onsubmit="return rate_stars(event)">
@ -7,7 +7,7 @@
<input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="rating" value="{{ forloop.counter }}">
<button type="submit" class="icon icon-star-{% if book|rating:user < forloop.counter %}empty{% else %}full{% endif %}">
<span class="hidden-text">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span>
<span class="is-sr-only">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span>
</button>
</form>
{% endfor %}

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

@ -11,7 +11,7 @@
<div class="dropdown is-hoverable">
{% if not hide_pulldown %}
<div class="button dropdown-trigger is-small" >
<span class="icon icon-arrow-down"><span class="hidden-text">More shelves</span></span>
<span class="icon icon-arrow-down"><span class="is-sr-only">More shelves</span></span>
</div>
<div class="dropdown-menu">

2
bookwyrm/templates/snippets/stars.html
View file

@ -1,5 +1,5 @@
<div class="stars">
<span class="hidden-text">{{ rating|floatformat }} star{{ rating|floatformat | pluralize }}</span>
<span class="is-sr-only">{{ rating|floatformat }} star{{ rating|floatformat | pluralize }}</span>
{% for i in '12345'|make_list %}
<span class="icon icon-star-{% if rating >= forloop.counter %}full{% elif rating|floatformat:0 >= forloop.counter|floatformat:0 %}half{% else %}empty{% endif %}">
</span>

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

@ -23,7 +23,7 @@
<div class="card-footer-item">
<span class="icon icon-public">
<span class="hidden-text">Public post</span>
<span class="is-sr-only">Public post</span>
</span>
<a href="{{ status.remote_id }}">{{ status.published_date | naturaltime }}</a>
</div>

4
bookwyrm/templates/snippets/tag.html
View file

@ -9,14 +9,14 @@
{% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="name" value="{{ tag.name }}">
<button type="submit">x<span class="hidden-text"> remove tag</span></button>
<button type="submit">x<span class="is-sr-only"> remove tag</span></button>
</form>
{% else %}
<form name="tag" action="/tag/" method="post">
{% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="name" value="{{ tag.name }}">
<button type="submit">+<span class="hidden-text"> add tag</span></button>
<button type="submit">+<span class="is-sr-only"> add tag</span></button>
</form>
{% endif %}
</div>

2
bookwyrm/templates/user_header.html
View file

@ -7,7 +7,7 @@
<div class="level-right">
<a href="/user-edit/" class="edit-link">edit
<span class="icon icon-pencil">
<span class="hidden-text">Edit profile</span>
<span class="is-sr-only">Edit profile</span>
</span>
</a>
</div>