OpenSourceArk/mkdocs-material
1
0
Fork 0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-06-14 11:52:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added aria labels to palette toggles

Browse Source
This commit is contained in:
squidfunk 2021-06-06 14:47:20 +02:00
parent 0dd483121a
commit 42500aafa2
2 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
material/partials/header.html
View File

@ -32,7 +32,7 @@
{% for option in config.theme.palette %} {% for option in config.theme.palette %}
{% set primary = option.primary | replace(" ", "-") | lower %} {% set primary = option.primary | replace(" ", "-") | lower %}
{% set accent = option.accent | replace(" ", "-") | lower %} {% set accent = option.accent | replace(" ", "-") | lower %}
<input class="md-option" data-md-color-media="{{ option.media }}" data-md-color-scheme="{{ option.scheme }}" data-md-color-primary="{{ primary }}" data-md-color-accent="{{ accent }}" type="radio" name="__palette" id="__palette_{{ loop.index }}"> <input class="md-option" data-md-color-media="{{ option.media }}" data-md-color-scheme="{{ option.scheme }}" data-md-color-primary="{{ primary }}" data-md-color-accent="{{ accent }}" {% if option.toggle %} aria-label="{{ option.toggle.name }}" {% else %} aria-hidden="true" {% endif %} type="radio" name="__palette" id="__palette_{{ loop.index }}">
{% if option.toggle %} {% if option.toggle %}
<label class="md-header__button md-icon" title="{{ option.toggle.name }}" for="__palette_{{ loop.index0 or loop.length }}" hidden> <label class="md-header__button md-icon" title="{{ option.toggle.name }}" for="__palette_{{ loop.index0 or loop.length }}" hidden>
{% include ".icons/" ~ option.toggle.icon ~ ".svg" %} {% include ".icons/" ~ option.toggle.icon ~ ".svg" %}

5
src/partials/header.html
View File

@ -75,6 +75,11 @@
data-md-color-scheme="{{ option.scheme }}" data-md-color-scheme="{{ option.scheme }}"
data-md-color-primary="{{ primary }}" data-md-color-primary="{{ primary }}"
data-md-color-accent="{{ accent }}" data-md-color-accent="{{ accent }}"
{% if option.toggle %}
aria-label="{{ option.toggle.name }}"
{% else %}
aria-hidden="true"
{% endif %}
type="radio" type="radio"
name="__palette" name="__palette"
id="__palette_{{ loop.index }}" id="__palette_{{ loop.index }}"