diff --git a/public/app.js b/public/app.js
index 153ef0b..8a35496 100644
--- a/public/app.js
+++ b/public/app.js
@@ -1174,6 +1174,21 @@ function updateDownloadClientFilter() {
toggleClientSelection(index, e.target.checked);
});
+ // Add client icon
+ const iconWrapper = document.createElement('span');
+ iconWrapper.className = 'download-client-icon';
+
+ const iconImg = document.createElement('img');
+ iconImg.src = `/images/clients/${client.type}.svg`;
+ iconImg.alt = `${client.name} icon`;
+ iconImg.onerror = () => {
+ // Fallback to text if image fails to load
+ iconWrapper.textContent = client.type.charAt(0).toUpperCase();
+ iconWrapper.classList.add('fallback');
+ };
+
+ iconWrapper.appendChild(iconImg);
+
const label = document.createElement('label');
label.className = 'download-client-option-label';
label.htmlFor = checkboxId;
@@ -1184,6 +1199,7 @@ function updateDownloadClientFilter() {
typeBadge.textContent = client.type;
option.appendChild(checkbox);
+ option.appendChild(iconWrapper);
option.appendChild(label);
option.appendChild(typeBadge);
diff --git a/public/images/clients/deluge.svg b/public/images/clients/deluge.svg
new file mode 100644
index 0000000..48b984b
--- /dev/null
+++ b/public/images/clients/deluge.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/public/images/clients/qbittorrent.svg b/public/images/clients/qbittorrent.svg
new file mode 100644
index 0000000..bb1249e
--- /dev/null
+++ b/public/images/clients/qbittorrent.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/public/images/clients/rtorrent.svg b/public/images/clients/rtorrent.svg
new file mode 100644
index 0000000..89e47c6
--- /dev/null
+++ b/public/images/clients/rtorrent.svg
@@ -0,0 +1,4 @@
+
diff --git a/public/images/clients/sabnzbd.svg b/public/images/clients/sabnzbd.svg
new file mode 100644
index 0000000..b8d2ef7
--- /dev/null
+++ b/public/images/clients/sabnzbd.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/public/images/clients/transmission.svg b/public/images/clients/transmission.svg
new file mode 100644
index 0000000..04560ee
--- /dev/null
+++ b/public/images/clients/transmission.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/public/style.css b/public/style.css
index 10f67b1..cfe9d05 100644
--- a/public/style.css
+++ b/public/style.css
@@ -842,6 +842,32 @@ body {
color: var(--text-secondary);
}
+/* Client icon */
+.download-client-icon {
+ width: 20px;
+ height: 20px;
+ flex-shrink: 0;
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.download-client-icon img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+}
+
+.download-client-icon.fallback {
+ font-size: 14px;
+ font-weight: bold;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: var(--surface-alt);
+ border-radius: 3px;
+ color: var(--text-primary);
+}
+
.history-header {
display: flex;
align-items: center;