Merge branch 'refs/heads/main' into decoupled-translations

Auto-Image.js

@@ -2340,6 +2340,19 @@ function applyTheme() {
     updateActiveColorPalette();
   }
 
+  function unselectAllPaidColors() {
+    const swatches = document.querySelectorAll('.wplace-color-swatch');
+    if (swatches) {
+      swatches.forEach(swatch => {
+        const colorId = parseInt(swatch.getAttribute('data-color-id'), 10);
+        if (!isNaN(colorId) && colorId>= 32) {
+          swatch.classList.toggle('active', false);
+        }
+      });
+    }
+    updateActiveColorPalette();
+  }
+  
   function initializeColorPalette(container) {
     const colorsContainer = container.querySelector('#colors-container');
     const showAllToggle = container.querySelector('#showAllColorsToggle');
@@ -2430,6 +2443,7 @@ function applyTheme() {
 
     container.querySelector('#selectAllBtn')?.addEventListener('click', () => toggleAllColors(true, showAllToggle?.checked));
     container.querySelector('#unselectAllBtn')?.addEventListener('click', () => toggleAllColors(false, showAllToggle?.checked));
+    container.querySelector('#unselectPaidBtn')?.addEventListener('click', () => unselectAllPaidColors());
   }
   async function handleCaptcha() {
     const startTime = performance.now();
@@ -3174,9 +3188,10 @@ function applyTheme() {
                       <span>${Utils.t('showAllColorsIncluding')}</span>
                   </label>
               </div>
-              <div class="wplace-row">
+              <div class="wplace-row" style="display: flex;">
                   <button id="selectAllBtn" class="wplace-btn">Select All</button>
                   <button id="unselectAllBtn" class="wplace-btn">Unselect All</button>
+                  <button id="unselectPaidBtn" class="wplace-btn">Unselect Paid</button>
               </div>
               <div id="colors-container" class="wplace-color-grid"></div>
           </div>

themes/classic-light.css

@@ -479,4 +479,8 @@
   background: rgba(0, 0, 0, 0.05) !important;
   border-radius: 8px !important;
   border: 1px solid rgba(0, 0, 0, 0.1) !important;
-}
+}
+
+.wplace-row .wplace-btn {
+  flex: 1;
+}

themes/classic.css

@@ -650,4 +650,8 @@
   border: 1px solid #ffffff;
   border-radius: 12px;
   box-shadow: 0 0 20px rgba(0,0,0,0.5);
-}
+}
+
+.wplace-row .wplace-btn {
+  flex: 1;
+}

themes/neon.css

@@ -400,4 +400,8 @@
   border-radius: 0 !important;
   box-shadow: 0 0 30px rgba(0, 255, 65, 0.5) !important;
   font-family: 'Press Start 2P', monospace !important;
-}
+}
+
+.wplace-row .wplace-btn {
+  flex: 1;
+}