Improve web accessibility
- Add associated label to form elements. - Add discernible name to links.
This commit is contained in:
parent
57a4bfdb82
commit
8d4c1deb15
7 changed files with 42 additions and 40 deletions
|
@ -21,11 +21,14 @@
|
|||
|
||||
# Uncomment and complete the url below to enable more contact options
|
||||
# -
|
||||
# type: mastodon
|
||||
# icon: 'fab fa-mastodon' # icons powered by <https://fontawesome.com/>
|
||||
# url: '' # Fill with your mastodon account page
|
||||
# -
|
||||
# type: linkedin
|
||||
# icon: 'fab fa-linkedin' # icons powered by <https://fontawesome.com/>
|
||||
# url: '' # Fill with your Linkedin homepage
|
||||
# -
|
||||
# type: stack-overflow
|
||||
# icon: 'fab fa-stack-overflow'
|
||||
# url: '' # Fill with your stackoverflow homepage
|
||||
|
|
|
@ -10,17 +10,15 @@
|
|||
<ul class="pagination mt-4 mb-0 pl-lg-2">
|
||||
<!-- left arrow -->
|
||||
{% if paginator.previous_page %}
|
||||
<li class="page-item">
|
||||
<a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.previous_page_path }}">
|
||||
{% assign prev_url = paginator.previous_page_path | relative_url %}
|
||||
{% else %}
|
||||
{% assign prev_url = "#" %}
|
||||
{% endif %}
|
||||
<li class="page-item {% unless paginator.previous_page %}disabled{% endunless %}">
|
||||
<a class="page-link btn-box-shadow" href="{{ prev_url }}" aria-label="previous-page">
|
||||
<i class="fas fa-angle-left"></i>
|
||||
</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="page-item disabled">
|
||||
<a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-left"></i></a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<!-- endof left arrow -->
|
||||
|
||||
<!-- page numbers -->
|
||||
{% assign left_ellipsis = false %}
|
||||
|
@ -51,38 +49,37 @@
|
|||
{% endif %}
|
||||
|
||||
{% if show %}
|
||||
<!-- show number -->
|
||||
<li class="page-item {% if i == paginator.page %} active{% endif %}">
|
||||
<a class="page-link btn-box-shadow" href="{{ site.baseurl }}/{% if i > 1%}page{{ i }}/{% endif %}">{{ i }}</a>
|
||||
<!-- show number -->
|
||||
<li class="page-item {% if i == paginator.page %} active{% endif %}">
|
||||
<a class="page-link btn-box-shadow" href="{{ site.baseurl }}/{% if i > 1%}page{{ i }}/{% endif %}">{{ i }}</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<!-- hide number -->
|
||||
{% if i < pre and left_ellipsis == false %}
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link btn-box-shadow">...</span>
|
||||
</li>
|
||||
{% else %}
|
||||
<!-- hide number -->
|
||||
{% if i < pre and left_ellipsis == false %}
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link btn-box-shadow">...</span>
|
||||
</li>
|
||||
{% assign left_ellipsis = true %}
|
||||
{% elsif i > next and right_ellipsis == false %}
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link btn-box-shadow">...</span>
|
||||
</li>
|
||||
{% assign right_ellipsis = true %}
|
||||
{% endif %}
|
||||
{% assign left_ellipsis = true %}
|
||||
{% elsif i > next and right_ellipsis == false %}
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link btn-box-shadow">...</span>
|
||||
</li>
|
||||
{% assign right_ellipsis = true %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
|
||||
<!-- right arrow -->
|
||||
{% if paginator.next_page %}
|
||||
<li class="page-item">
|
||||
<a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.next_page_path }}">
|
||||
{% if paginator.next_page_path %}
|
||||
{% assign next_url = paginator.next_page_path | relative_url %}
|
||||
{% else %}
|
||||
{% assign next_url = "#" %}
|
||||
{% endif %}
|
||||
<li class="page-item {% unless paginator.next_page_path %}disabled{% endunless %}">
|
||||
<a class="page-link btn-box-shadow" href="{{ next_url }}" aria-label="next-page">
|
||||
<i class="fas fa-angle-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="page-item disabled">
|
||||
<a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-right"></i></a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
</ul> <!-- .pagination -->
|
||||
</ul> <!-- .pagination -->
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
{% for share in site.data.share.platforms %}
|
||||
{% assign link = share.link | replace: 'TITLE', title | replace: 'URL', url %}
|
||||
<a href="{{ link }}" data-toggle="tooltip" data-placement="top"
|
||||
title="{{ share.type }}" target="_blank" rel="noopener">
|
||||
title="{{ share.type }}" target="_blank" rel="noopener" aria-label="{{ share.type }}">
|
||||
<i class="fa-fw {{ share.icon }}"></i>
|
||||
</a>
|
||||
{% endfor %}
|
||||
|
|
|
@ -81,7 +81,7 @@
|
|||
{% endcapture %}
|
||||
|
||||
{% if url != '' %}
|
||||
<a href="{{ url }}" {% unless entry.noblank %}target="_blank" rel="noopener"{% endunless %}>
|
||||
<a href="{{ url }}" aria-label="{{ entry.type }}" {% unless entry.noblank %}target="_blank" rel="noopener"{% endunless %}>
|
||||
<i class="{{ entry.icon }}"></i>
|
||||
</a>
|
||||
{% endif %}
|
||||
|
|
|
@ -41,10 +41,11 @@
|
|||
<i id="search-trigger" class="fas fa-search fa-fw"></i>
|
||||
<span id="search-wrapper" class="align-items-center">
|
||||
<i class="fas fa-search fa-fw"></i>
|
||||
<input class="form-control" id="search-input" type="search" placeholder="{{ site.data.label.search_hint }}...">
|
||||
<input class="form-control" id="search-input" type="search"
|
||||
aria-label="search" placeholder="{{ site.data.label.search_hint }}...">
|
||||
<i class="fa fa-times-circle fa-fw" id="search-cleaner"></i>
|
||||
</span>
|
||||
<span id="search-cancel" >Cancel</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -48,7 +48,7 @@ layout: compress
|
|||
|
||||
<div id="mask"></div>
|
||||
|
||||
<a id="back-to-top" href="#" class="btn btn-lg btn-box-shadow" role="button">
|
||||
<a id="back-to-top" href="#" aria-label="back-to-top" class="btn btn-lg btn-box-shadow" role="button">
|
||||
<i class="fas fa-angle-up"></i>
|
||||
</a>
|
||||
|
||||
|
|
|
@ -64,8 +64,9 @@ type: categories
|
|||
|
||||
<!-- arrow -->
|
||||
{% if sub_categories_size > 0%}
|
||||
<a href="#{{ LIST_PREFIX }}{{ group_index }}" data-toggle="collapse" aria-expanded="true"
|
||||
class="category-trigger hide-border-bottom">
|
||||
<a href="#{{ LIST_PREFIX }}{{ group_index }}" data-toggle="collapse"
|
||||
aria-expanded="true" aria-label="{{ HEAD_PREFIX }}{{ group_index }}-trigger"
|
||||
class="category-trigger hide-border-bottom">
|
||||
<i class="fas fa-fw fa-angle-down"></i>
|
||||
</a>
|
||||
{% else %}
|
||||
|
|
Loading…
Reference in a new issue