diff --git a/static/js/comic-nav.js b/static/js/comic-nav.js index dd81b1b..ae19f43 100644 --- a/static/js/comic-nav.js +++ b/static/js/comic-nav.js @@ -188,9 +188,11 @@ if (currentNumber > 1) { firstBtn.className = isIconNav ? 'btn-icon-nav' : 'btn btn-nav'; firstBtn.onclick = (e) => { e.preventDefault(); loadComic(1); }; + firstBtn.removeAttribute('aria-disabled'); } else { firstBtn.className = isIconNav ? 'btn-icon-nav btn-icon-disabled' : 'btn btn-nav btn-disabled'; firstBtn.onclick = null; + firstBtn.setAttribute('aria-disabled', 'true'); } // Previous button @@ -198,9 +200,11 @@ if (currentNumber > 1) { prevBtn.className = isIconNav ? 'btn-icon-nav' : 'btn btn-nav'; prevBtn.onclick = (e) => { e.preventDefault(); loadComic(currentNumber - 1); }; + prevBtn.removeAttribute('aria-disabled'); } else { prevBtn.className = isIconNav ? 'btn-icon-nav btn-icon-disabled' : 'btn btn-nav btn-disabled'; prevBtn.onclick = null; + prevBtn.setAttribute('aria-disabled', 'true'); } // Comic date display @@ -213,9 +217,11 @@ if (currentNumber < totalComics) { nextBtn.className = isIconNav ? 'btn-icon-nav' : 'btn btn-nav'; nextBtn.onclick = (e) => { e.preventDefault(); loadComic(currentNumber + 1); }; + nextBtn.removeAttribute('aria-disabled'); } else { nextBtn.className = isIconNav ? 'btn-icon-nav btn-icon-disabled' : 'btn btn-nav btn-disabled'; nextBtn.onclick = null; + nextBtn.setAttribute('aria-disabled', 'true'); } // Latest button @@ -223,9 +229,11 @@ if (currentNumber < totalComics) { latestBtn.className = isIconNav ? 'btn-icon-nav' : 'btn btn-nav'; latestBtn.onclick = (e) => { e.preventDefault(); loadComic(totalComics); }; + latestBtn.removeAttribute('aria-disabled'); } else { latestBtn.className = isIconNav ? 'btn-icon-nav btn-icon-disabled' : 'btn btn-nav btn-disabled'; latestBtn.onclick = null; + latestBtn.setAttribute('aria-disabled', 'true'); } } diff --git a/templates/comic.html b/templates/comic.html index e1302a4..64a48de 100644 --- a/templates/comic.html +++ b/templates/comic.html @@ -57,10 +57,10 @@ {% else %} - + - + {% endif %} @@ -75,10 +75,10 @@ {% else %} - + - + {% endif %} @@ -88,8 +88,8 @@ First Previous {% else %} - First - Previous + First + Previous {% endif %} {{ comic.formatted_date }} @@ -98,8 +98,8 @@ Next Latest {% else %} - Next - Latest + Next + Latest {% endif %} {% endif %}