From f5693fb8dec7af75283464e79de14d8841ed393c Mon Sep 17 00:00:00 2001
From: Victor Giers <mail@victorgiers.com>
Date: Fri, 23 May 2025 23:38:15 +0200
Subject: [PATCH] auto-git:  [change] renderer.js

---
 renderer.js | 46 +++++++++++++++++++++++++++++-----------------
 1 file changed, 29 insertions(+), 17 deletions(-)

diff --git a/renderer.js b/renderer.js
index 53740dc..fe82298 100644
--- a/renderer.js
+++ b/renderer.js
@@ -82,30 +82,42 @@ window.addEventListener('DOMContentLoaded', async () => {
       ].join(' ');
 
       li.innerHTML = `
-        <div class="flex items-center space-x-2 overflow-hidden">
-          <svg xmlns="http://www.w3.org/2000/svg"
-               class="h-5 w-5 flex-shrink-0"
-               fill="none" viewBox="0 0 24 24" stroke="currentColor">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                  d="M3 7a2 2 0 012-2h4l2 2h6a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V7"/>
-          </svg>
+        <div class="flex items-center space-x-2 overflow-hidden flex-1 min-w-0">
+          <svg ...></svg>
           <span class="truncate text-sm font-medium">${basename(folder)}</span>
         </div>
-        <button class="remove-btn">
-          <svg xmlns="http://www.w3.org/2000/svg"
-               class="h-5 w-5"
-               fill="none" viewBox="0 0 24 24" stroke="currentColor">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                  d="M6 18L18 6M6 6l12 12"/>
-          </svg>
-        </button>
+        <div class="flex items-center space-x-1 ml-2">
+          <button class="pause-play-btn hover:bg-gray-200 p-1 rounded" title="${isMonitoring ? 'Monitoring pausieren' : 'Monitoring starten'}">
+            ${isMonitoring
+              ? `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><rect x="6" y="5" width="4" height="14" rx="1" fill="currentColor"/><rect x="14" y="5" width="4" height="14" rx="1" fill="currentColor"/></svg>`
+              : `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><polygon points="7,5 19,12 7,19" fill="currentColor"/></svg>`
+            }
+          </button>
+          <button class="remove-btn hover:bg-gray-200 p-1 rounded ml-1" title="Ordner entfernen">
+            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                    d="M6 18L18 6M6 6l12 12"/>
+            </svg>
+          </button>
+        </div>
       `;
 
       // play/pause Button korrekt initialisieren
       const pausePlayBtn = document.createElement('button');
-      pausePlayBtn.className = 'pause-play-btn ml-2';
-      pausePlayBtn.innerHTML = isMonitoring ? '⏸️' : '▶️';
+      pausePlayBtn.className = 'pause-play-btn ml-2 hover:bg-gray-200 p-1 rounded';
       pausePlayBtn.title = isMonitoring ? 'Monitoring pausieren' : 'Monitoring starten';
+      // statt Emoji: SVG-Strings
+      pausePlayBtn.innerHTML = isMonitoring
+        ? /* Pause-Icon */
+          `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+             <rect x="6" y="5" width="4" height="14" rx="1" fill="currentColor"/>
+             <rect x="14" y="5" width="4" height="14" rx="1" fill="currentColor"/>
+           </svg>`
+        : /* Play-Icon */
+          `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+             <polygon points="7,5 19,12 7,19" fill="currentColor"/>
+           </svg>`;
+
       pausePlayBtn.addEventListener('click', async e => {
         e.stopPropagation();
         await window.electronAPI.setMonitoring(folderObj, !isMonitoring);