disable extract selected button when nothing is selected

harmonytf · Mar 1, 2024 · 135cad2 · 135cad2
1 parent b2625e0
commit 135cad2
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/src/components/FileTree.vue b/src/components/FileTree.vue
@@ -194,7 +194,7 @@ watch(selectMode, (newVal) => {
                 <input type="checkbox" v-model="selectMode">
             </label>
             <br>
-            <button v-if="selectMode" @click="mainStore.extractFiles([...checkedFiles])">Extract selected</button>
+            <button v-if="selectMode" @click="mainStore.extractFiles([...checkedFiles])" :disabled="checkedFiles.size == 0">Extract selected</button>
             <button v-else @click="mainStore.extractAll">Extract all</button>
         </div>
     </div>

diff --git a/src/styles.css b/src/styles.css
@@ -104,3 +104,9 @@ input[type="checkbox"] {
     accent-color: var(--color-primary-light);
     box-shadow: none;
 }
+
+button:disabled {
+  opacity: 0.875;
+  filter: brightness(0.875);
+  pointer-events: none;
+}