release: 4.6.85 form-row.section-header + inline-toggle reuse

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

package-lock.json

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

package.json

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

src/index.html

@@ -665,8 +665,8 @@
                     </div>
 
                     <div class="settings-card">
-                        <div class="form-row" style="align-items:center; justify-content:space-between; margin-bottom: 10px;">
-                            <h3 id="preflightTitle" style="margin: 0;">System-Check</h3>
+                        <div class="form-row section-header">
+                            <h3 id="preflightTitle">System-Check</h3>
                             <span class="health-badge unknown" id="healthBadge">System: Unbekannt</span>
                         </div>
                         <div class="form-row" style="margin-bottom: 10px;">
@@ -681,7 +681,7 @@
                         <div class="form-row" style="margin-bottom: 10px; align-items: center;">
                             <button class="btn-secondary" id="btnRefreshLog" onclick="refreshDebugLog()">Aktualisieren</button>
                             <button class="btn-secondary" id="btnOpenDebugLogFile" onclick="openDebugLogFile()">Log-Datei oeffnen</button>
-                            <label style="display:flex; align-items:center; gap:6px; font-size:13px; color: var(--text-secondary);">
+                            <label class="inline-toggle">
                                 <input type="checkbox" id="debugAutoRefresh" onchange="toggleDebugAutoRefresh(this.checked)">
                                 <span id="autoRefreshText">Auto-Refresh</span>
                             </label>
@@ -690,8 +690,8 @@
                     </div>
 
                     <div class="settings-card">
-                        <div class="form-row" style="align-items:center; justify-content:space-between; margin-bottom: 10px;">
-                            <h3 id="storageCardTitle" style="margin:0;">Storage</h3>
+                        <div class="form-row section-header">
+                            <h3 id="storageCardTitle">Storage</h3>
                             <button class="btn-secondary" id="btnRefreshStorage" onclick="refreshStorageStats()">Aktualisieren</button>
                         </div>
                         <p id="storageCardIntro" class="card-intro">Disk-Verbrauch pro Streamer im aktuellen Download-Ordner. Live-Aufnahmen werden separat ausgewiesen.</p>
@@ -790,7 +790,7 @@
                         <div class="form-row" style="margin-bottom: 10px; align-items: center;">
                             <button class="btn-secondary" id="btnRefreshMetrics" onclick="refreshRuntimeMetrics()">Aktualisieren</button>
                             <button class="btn-secondary" id="btnExportMetrics" onclick="exportRuntimeMetrics()">Export JSON</button>
-                            <label style="display:flex; align-items:center; gap:6px; font-size:13px; color: var(--text-secondary);">
+                            <label class="inline-toggle">
                                 <input type="checkbox" id="runtimeMetricsAutoRefresh" onchange="toggleRuntimeMetricsAutoRefresh(this.checked)">
                                 <span id="runtimeMetricsAutoRefreshText">Auto-Refresh</span>
                             </label>

src/styles.css

@@ -1724,6 +1724,21 @@ select option {
     gap: 10px;
 }
 
+/* Settings-card header row: card title + right-aligned refresh button.
+   Used by System-Check, Storage and similar cards where an h3 lives in
+   a form-row with a button pinned to the far right. The descendant h3
+   margin reset kills the inline style="margin:0" that those headings
+   used to carry. */
+.form-row.section-header {
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+}
+
+.form-row.section-header h3 {
+    margin: 0;
+}
+
 .log-panel {
     background: #11151c;
     border: 1px solid rgba(255,255,255,0.12);