HAM/Berufsschule_HAM
1
0
Fork 1
mirror of https://github.com/LD-Reborn/Berufsschule_HAM.git synced 2025-12-20 06:51:55 +00:00
Code Issues Packages Projects 1 Releases Wiki Activity

Improved admin settings view screenreader navigation

Browse Source
This commit is contained in:
LD-Reborn
2025-11-23 23:44:54 +01:00
parent 17c9e46a5b
commit 22d72e124f
2 changed files with 31 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/Resources/Views.Settings.Admin.de.resx
View File

@@ -110,4 +110,7 @@
<data name="Clear user image cache" xml:space="preserve">
<value>Cache leeren</value>
</data>
<data name="Presets. Press to toggle visibility" xml:space="preserve">
<value>Vorlagen. Klicken zum Auf- oder zuklappen</value>
</data>
</root>

32
src/Views/Settings/Admin.cshtml
View File

@@ -68,14 +68,18 @@
</select>
</div>
<div class="col-md-4">
<p class="form-label">@T["Current user image cache utilization:"] <span id="userImageCacheSize">@userImageCacheSize</span></p>
<p tabindex="0" class="form-label">@T["Current user image cache utilization:"] <span id="userImageCacheSize">@userImageCacheSize</span></p>
<button class="form-control btn btn-danger" type="button" id="clearCacheBtn">@T["Clear user image cache"]</button>
</div>
</div>
<div class="mt-3 p-2 bg border rounded d-flex justify-content-between align-items-center"
data-bs-toggle="collapse"
data-bs-target="#presetsCollapse"
style="cursor: pointer;">
style="cursor: pointer;"
role="button"
tabindex="0"
aria-controls="presetsCollapse"
aria-label="@T["Presets. Press to toggle visibility"]">
<h4 class="fw-bold m-0">@T["Presets"]</h4>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
@@ -165,6 +169,26 @@
document.addEventListener('DOMContentLoaded', () => {
const toggle = document.querySelector('[data-bs-target="#presetsCollapse"]');
toggle.addEventListener("keydown", (e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
toggle.click();
const collapse = document.querySelector("#presetsCollapse");
const isShown = collapse.classList.contains("show");
toggle.setAttribute("aria-expanded", isShown ? "true" : "false");
}
});
toggle.addEventListener("click", () => {
const collapse = document.querySelector("#presetsCollapse");
const isShown = collapse.classList.contains("show");
toggle.setAttribute("aria-expanded", isShown ? "true" : "false");
});
const updateForm = document.getElementById('updateSettings');
updateForm.addEventListener('submit', async e => {
e.preventDefault();
@@ -375,10 +399,10 @@
<div class="attributes"></div>
<div class="row mb-4">
<div class="col-md-4">
<button type="button" class="btn btn-danger" data-type="deletePreset">Delete preset</button>
<button type="button" class="btn btn-danger" data-type="deletePreset">@T["Delete preset"]</button>
</div>
<div class="col-md-4 ms-auto">
<button type="button" class="btn btn-primary" data-type="addAttribute">Add attribute</button>
<button type="button" class="btn btn-primary" data-type="addAttribute">@T["Add attribute"]</button>
</div>
</div>
</div>