From 4d5caeda9ee6de8e2b01e4bb9e163331e1a60019 Mon Sep 17 00:00:00 2001
From: Koala <6156589+Shik3i@users.noreply.github.com>
Date: Mon, 25 May 2026 23:20:37 +0200
Subject: [PATCH] style(ui): redesign sync button layout and rename to SYNC

---
 extension/popup.html | 4 ++--
 extension/popup.js   | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/extension/popup.html b/extension/popup.html
index 600a838..dec0108 100644
--- a/extension/popup.html
+++ b/extension/popup.html
@@ -375,8 +375,8 @@
         </div>
 
         <div style="display: flex; gap: 8px; margin-bottom: 15px; align-items: stretch;">
-            <button id="forceSyncBtn" class="primary" style="background: linear-gradient(135deg, #6366f1, #a855f7); flex: 1;">⚡ Sync All Viewers</button>
-            <select id="forceSyncMode" style="width: auto; min-width: 130px; background: var(--card); border: 1px solid #334155; color: white; padding: 10px 8px; border-radius: 8px; font-size: 11px; font-family: inherit; cursor: pointer; align-self: stretch;" title="Choose sync target">
+            <button id="forceSyncBtn" class="primary" style="background: linear-gradient(135deg, #6366f1, #a855f7); flex: 1;">⚡ SYNC</button>
+            <select id="forceSyncMode" style="flex: 1; background: var(--card); border: 1px solid #334155; color: white; padding: 10px 8px; border-radius: 8px; font-size: 11px; font-family: inherit; cursor: pointer; align-self: stretch;" title="Choose sync target">
                 <option value="jump-to-others">Jump to Others</option>
                 <option value="jump-to-me">Jump to Me</option>
             </select>
diff --git a/extension/popup.js b/extension/popup.js
index 4fa7cf5..21b54e3 100644
--- a/extension/popup.js
+++ b/extension/popup.js
@@ -667,7 +667,7 @@ function applyConnectionStatus(status) {
 
     if (elements.playBtn) elements.playBtn.textContent = '▶ Play';
     if (elements.pauseBtn) elements.pauseBtn.textContent = '⏸ Pause';
-    if (elements.forceSyncBtn) elements.forceSyncBtn.textContent = '⚡ Force Sync';
+    if (elements.forceSyncBtn) elements.forceSyncBtn.textContent = '⚡ SYNC';
 }
 
 function updateHistory(history) {
@@ -1164,8 +1164,8 @@ chrome.runtime.onMessage.addListener((msg) => {
                 'play': '▶ Play',
                 'pause': '⏸ Pause',
                 'seek': '⏩ Seek',
-                'force_sync_prepare': '⚡ Force Sync',
-                'force_sync_execute': '⚡ Force Play'
+                'force_sync_prepare': '⚡ Sync',
+                'force_sync_execute': '⚡ Sync Play'
             };
             const action = actionNames[state.action] || state.action;
             showToast(`${state.senderId} ${action}`, 'info', 2000);
@@ -1197,7 +1197,7 @@ chrome.runtime.onMessage.addListener((msg) => {
                 elements.forceSyncBtn.disabled = false;
                 elements.forceSyncBtn.textContent = '✅ Synced!';
                 setTimeout(() => {
-                    elements.forceSyncBtn.textContent = '⚡ Sync All Viewers';
+                    elements.forceSyncBtn.textContent = '⚡ SYNC';
                 }, 2000);
             }
         }