feat(accessibility): harden chat and keyboard interactions

Stream capability-authorized chat reads with cancellation, virtualize viewer rendering, centralize modal focus management, and add keyboard-accessible queue and VOD menus. Expose command palette combobox state and keep the document language synchronized with the selected locale.
This commit is contained in:
Sucukdeluxe
2026-08-12 01:42:42 +02:00
parent aa06d486be
commit 9c17269a54
16 changed files with 790 additions and 190 deletions
+22
View File
@@ -4914,6 +4914,7 @@ input[type="number"]::-webkit-outer-spin-button {
per-message colour for the username (driven by Twitch's IRC color
metadata). */
.chat-viewer-row {
min-height: 29px;
padding: 4px 8px;
line-height: 1.55;
border-radius: 4px;
@@ -4922,6 +4923,17 @@ input[type="number"]::-webkit-outer-spin-button {
word-wrap: break-word;
}
.chat-viewer-virtual-canvas {
position: relative;
min-height: 100%;
}
.chat-viewer-virtual-rows {
position: absolute;
inset: 0 0 auto;
width: 100%;
}
.chat-viewer-row:hover {
background: rgba(255, 255, 255, 0.04);
}
@@ -5615,6 +5627,11 @@ input[type="number"]::-webkit-outer-spin-button {
}
.context-menu-item {
display: block;
width: 100%;
border: 0;
background: transparent;
text-align: left;
padding: 8px 12px;
cursor: pointer;
font-size: 13px;
@@ -5627,6 +5644,11 @@ input[type="number"]::-webkit-outer-spin-button {
background: rgba(145, 70, 255, 0.15);
}
.context-menu-item:focus-visible {
outline: 2px solid var(--accent);
outline-offset: -2px;
}
.context-menu-item.disabled {
color: var(--text-secondary);
opacity: 0.55;