mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/imputnet/cobalt.git synced 2025-06-28 01:18:27 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

web/ProcessingQueueItem: show buttons on tab focus

Browse Source 
& prevent focus when queue isn't visible
This commit is contained in:
wukko 2025-05-19 22:02:07 +06:00
parent 16e69d8aee
commit 3c654bf864
No known key found for this signature in database
GPG Key ID: 3E30B3F26C7B4AA2
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/components/queue/ProcessingQueueItem.svelte
View File

@ -2,9 +2,11 @@
import { t } from "$lib/i18n/translations"; import { t } from "$lib/i18n/translations";
import { formatFileSize } from "$lib/util"; import { formatFileSize } from "$lib/util";
import { downloadFile } from "$lib/download"; import { downloadFile } from "$lib/download";
import { removeItem } from "$lib/state/task-manager/queue";
import { savingHandler } from "$lib/api/saving-handler";
import { getProgress } from "$lib/task-manager/queue"; import { getProgress } from "$lib/task-manager/queue";
import { savingHandler } from "$lib/api/saving-handler";
import { removeItem } from "$lib/state/task-manager/queue";
import { queueVisible } from "$lib/state/queue-visibility";
import { currentTasks } from "$lib/state/task-manager/current-tasks"; import { currentTasks } from "$lib/state/task-manager/current-tasks";
import type { CobaltQueueItem } from "$lib/types/queue"; import type { CobaltQueueItem } from "$lib/types/queue";
@ -144,7 +146,12 @@
const MediaTypeIcon = $derived(itemIcons[info.mediaType]); const MediaTypeIcon = $derived(itemIcons[info.mediaType]);
</script> </script>
<div class="processing-item" role="listitem"> <!-- svelte-ignore a11y_no_noninteractive_tabindex -->
<div
class="processing-item"
role="listitem"
tabindex={$queueVisible ? 0 : -1}
>
<div class="processing-info"> <div class="processing-info">
<div class="file-title"> <div class="file-title">
<div class="processing-type"> <div class="processing-type">
@ -356,7 +363,8 @@
); );
} }
.processing-item:hover .file-actions { .processing-item:hover .file-actions,
.processing-item:focus-within .file-actions {
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
} }