From 59318923203cfda9d6557335adaaf3ede27ee59e Mon Sep 17 00:00:00 2001
From: xRangerDE <xRangerDE@24-music.de>
Date: Mon, 11 May 2026 06:47:13 +0200
Subject: [PATCH] cleanup: merge tab uses pre-existing .merge-empty-state class
 + clip-cutter placeholder gets descendant rules
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The merge tab's empty state at index.html:400 was written as <div class="empty-state" style="padding: 40px 20px"> with two more inline-styled descendants (SVG opacity:0.3 and p margin-top:10px). A .merge-empty-state class with exactly those three properties has been sitting in styles.css since the original empty-state pass — the HTML just never picked it up. Switched to <div class="empty-state merge-empty-state"> + bare children. 3 inline styles gone.

Same pattern in the clip-cutter video preview placeholder at index.html:332-333 (svg opacity:0.3, p margin-top:10px). Added two descendant rules to the existing .video-preview .placeholder block so the styling lives in CSS. 2 more inline styles gone.

Net 5 inline style attributes gone, no visual change.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/index.html | 10 +++++-----
 src/styles.css |  8 ++++++++
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/index.html b/src/index.html
index 741595c..e346880 100644
--- a/src/index.html
+++ b/src/index.html
@@ -329,8 +329,8 @@
 
                         <div class="video-preview" id="cutterPreview">
                             <div class="placeholder">
-                                <svg width="64" height="64" viewBox="0 0 24 24" fill="currentColor" style="opacity:0.3"><path d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM9 8l7 4-7 4V8z"/></svg>
-                                <p style="margin-top:10px">Video auswahlen um Vorschau zu sehen</p>
+                                <svg width="64" height="64" viewBox="0 0 24 24" fill="currentColor"><path d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM9 8l7 4-7 4V8z"/></svg>
+                                <p>Video auswahlen um Vorschau zu sehen</p>
                             </div>
                         </div>
 
@@ -397,9 +397,9 @@
                         </div>
 
                         <div class="file-list" id="mergeFileList">
-                            <div class="empty-state" style="padding: 40px 20px;">
-                                <svg width="48" height="48" viewBox="0 0 24 24" fill="currentColor" style="opacity:0.3"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
-                                <p id="mergeEmptyText" style="margin-top:10px">Keine Videos ausgewahlt</p>
+                            <div class="empty-state merge-empty-state">
+                                <svg width="48" height="48" viewBox="0 0 24 24" fill="currentColor"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
+                                <p id="mergeEmptyText">Keine Videos ausgewahlt</p>
                             </div>
                         </div>
 
diff --git a/src/styles.css b/src/styles.css
index ce391c5..a5eaf23 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -2809,6 +2809,14 @@ select option {
     text-align: center;
 }
 
+.video-preview .placeholder svg {
+    opacity: 0.3;
+}
+
+.video-preview .placeholder p {
+    margin-top: 10px;
+}
+
 .timeline-container {
     background: var(--bg-card);
     border-radius: 8px;