Compare commits

..

2 Commits

Author SHA1 Message Date
xRangerDE
e73db55e29 release: 4.6.104 .modal-close + .queue-retry-btn focus-visible rings
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 07:42:32 +02:00
xRangerDE
9be864e614 a11y: focus-visible on .modal-close + .queue-retry-btn
Two more interactive buttons that had hover + active states but no keyboard focus indicator:

- .modal-close (the X-close button used by all 5 modals — update, clip-cutter, events viewer, chat viewer, template guide). Red-toned ring matching the hover colour family.

- .queue-retry-btn (per-item retry button on failed queue items). Purple ring matching the hover state's accent-purple feedback.

Continues the focus-visible pass started in 4.6.81/82/103. Closes the remaining shell-and-modal buttons that keyboard users could tab to without seeing where they were.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 07:42:21 +02:00
3 changed files with 15 additions and 3 deletions

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.103", "version": "4.6.104",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.103", "version": "4.6.104",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"axios": "^1.6.0", "axios": "^1.6.0",

View File

@ -1,6 +1,6 @@
{ {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.103", "version": "4.6.104",
"description": "Twitch VOD Manager - Download Twitch VODs easily", "description": "Twitch VOD Manager - Download Twitch VODs easily",
"main": "dist/main.js", "main": "dist/main.js",
"author": "xRangerDE", "author": "xRangerDE",

View File

@ -968,6 +968,12 @@ select option {
transform: scale(0.92); transform: scale(0.92);
} }
.queue-retry-btn:focus-visible {
outline: none;
box-shadow: 0 0 0 2px rgba(145, 70, 255, 0.65);
border-color: rgba(145, 70, 255, 0.55);
}
.queue-main { .queue-main {
flex: 1; flex: 1;
min-width: 0; min-width: 0;
@ -3349,6 +3355,12 @@ body.theme-light .modal {
border-color: rgba(255, 70, 70, 0.55); border-color: rgba(255, 70, 70, 0.55);
} }
.modal-close:focus-visible {
outline: none;
border-color: rgba(255, 70, 70, 0.6);
box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.6);
}
.modal-close:active { .modal-close:active {
transform: scale(0.92); transform: scale(0.92);
} }