star rating label can't surround input for css to work

This commit is contained in:
Mouse Reeve 2020-11-09 21:26:22 -08:00
parent c4bf2653f7
commit a0243d089c
1 changed files with 6 additions and 7 deletions

View File

@ -15,14 +15,13 @@
<fieldset> <fieldset>
<legend class="is-sr-only">Rating</legend> <legend class="is-sr-only">Rating</legend>
<div class="field is-grouped stars form-rate-stars"> <div class="field is-grouped stars form-rate-stars">
<label class="is-sr-only">No rating <label class="is-sr-only" for="no-rating-{{ book.id }}">No rating</label>
<input class="is-sr-only" type="radio" name="rating" value="" checked> <input class="is-sr-only" type="radio" name="rating" value="" id="no-rating-{{ book.id }}" checked>
</label>
{% for i in '12345'|make_list %} {% for i in '12345'|make_list %}
<input class="is-sr-only" id="book{{book.id}}-star-{{ forloop.counter }}" type="radio" name="rating" value="{{ forloop.counter }}"> <input class="is-sr-only" 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 }}"> <label class="icon icon-star-empty" for="book{{book.id}}-star-{{ forloop.counter }}">
<span class="is-sr-only">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span> <span class="is-sr-only">{{ forloop.counter }} star{{ forloop.counter | pluralize }}</span>
</label> </label>
{% endfor %} {% endfor %}
</div> </div>
</fieldset> </fieldset>