Add aria label and clean up to theme selector

This commit is contained in:
Aroy-Art 2024-05-22 21:16:49 +02:00
parent 450113e172
commit c3d4289bbe
Signed by: Aroy
GPG key ID: DB9689E9391DD156

View file

@ -58,11 +58,12 @@
type="button" type="button"
aria-expanded="false" aria-expanded="false"
data-bs-toggle="dropdown" data-bs-toggle="dropdown"
data-bs-display="static"> data-bs-display="static"
aria-label="Toggle theme">
<svg class="bi my-1 theme-icon-active"><use href="#circle-half"></use></svg> <svg class="bi my-1 theme-icon-active"><use href="#circle-half"></use></svg>
<span class="ms-2" id="bd-theme-text">Theme</span> <span class="ms-2" id="bd-theme-text">Theme</span>
</button> </button>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="bd-theme" style="--bs-dropdown-min-width: 8rem;"> <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="bd-theme">
<li> <li>
<button type="button" class="dropdown-item d-flex align-items-center icon-link" data-bs-theme-value="light"> <button type="button" class="dropdown-item d-flex align-items-center icon-link" data-bs-theme-value="light">
<svg class="bi me-2 opacity-50 theme-icon"><use href="#sun-fill"></use></svg> <svg class="bi me-2 opacity-50 theme-icon"><use href="#sun-fill"></use></svg>
@ -72,16 +73,13 @@
</li> </li>
<li> <li>
<button type="button" class="dropdown-item d-flex align-items-center icon-link" data-bs-theme-value="dark"> <button type="button" class="dropdown-item d-flex align-items-center icon-link" data-bs-theme-value="dark">
{% comment %} <i class="px-1 mx-1 nf nf-md-brightness_auto"></i> {% endcomment %}
<svg class="bi me-2 opacity-50 theme-icon"><use href="#moon-stars-fill"></use></svg> <svg class="bi me-2 opacity-50 theme-icon"><use href="#moon-stars-fill"></use></svg>
Dark Dark
<svg class="bi ms-auto d-none"><use href="#check2"></use></svg> <svg class="bi ms-auto d-none"><use href="#check2"></use></svg>
</button> </button>
</li> </li>
<li> <li>
<button type="button" class="dropdown-item d-flex align-items-center active icon-link" data-bs-theme-value="auto"> <button type="button" class="dropdown-item d-flex align-items-center active icon-link" data-bs-theme-value="auto">
{% comment %} <i class="nf nf-md-brightness_auto"></i> {% endcomment %}
<svg class="bi me-2 opacity-50 theme-icon"><use href="#circle-half"></use></svg> <svg class="bi me-2 opacity-50 theme-icon"><use href="#circle-half"></use></svg>
Auto Auto
<svg class="bi ms-auto d-none"><use href="#check2"></use></svg> <svg class="bi ms-auto d-none"><use href="#check2"></use></svg>