Tab change javascript out of html

This commit is contained in:
Mouse Reeve
2021-01-14 15:29:37 -08:00
parent 4d4e692f49
commit 7abe39b7d5
3 changed files with 21 additions and 22 deletions

View File

@ -21,7 +21,7 @@
<ul>
{% for book in shelf.books %}
<li class="{% if shelf_counter == 1 and forloop.first %}is-active{% endif %}" data-id="tab-book-{{ book.id }}">
<label for="book-{{ book.id }}" onclick="tabChange(event, nested=true)">
<label for="book-{{ book.id }}" class="tab-change-nested">
<div role="tab" tabindex="0" aria-selected="{% if shelf_counter == 1 and forloop.first %}true{% else %}false{% endif %}" aria-controls="book-{{ book.id }}-panel">
<a>
{% include 'snippets/book_cover.html' with book=book size="medium" %}

View File

@ -5,21 +5,21 @@
<ul role="tablist">
<li class="is-active" data-id="tab-review-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="review-{{ book.id }}">
<div onclick="tabChange(event)" role="tab" aria-selected="true" tabindex="0">
<div class="tab-change" role="tab" aria-selected="true" tabindex="0">
<a>Review</a>
</div>
</label>
</li>
<li data-id="tab-comment-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="comment-{{ book.id}}">
<div onclick="tabChange(event)" role="tab" tabindex="0">
<div class="tab-change" role="tab" tabindex="0">
<a>Comment</a>
</div>
</label>
</li>
<li data-id="tab-quotation-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="quote-{{ book.id }}">
<div onclick="tabChange(event)" role="tab" tabindex="0">
<div class="tab-change" role="tab" tabindex="0">
<a>Quote</a>
</div>
</label>