From ad9fd4f60148a2a6b34505ac5d07e6437c5aca3f Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Tue, 25 Feb 2025 13:37:27 +0600
Subject: [PATCH] web/DownloadButton: fix 1.5px misalignment & add press state

also fixed opacity when disabled
---
 .../components/save/buttons/DownloadButton.svelte | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/web/src/components/save/buttons/DownloadButton.svelte b/web/src/components/save/buttons/DownloadButton.svelte
index fb49d1b2..b1d58776 100644
--- a/web/src/components/save/buttons/DownloadButton.svelte
+++ b/web/src/components/save/buttons/DownloadButton.svelte
@@ -69,7 +69,9 @@
         min-width: 48px;
 
         border-radius: 0;
-        padding: 0 12px;
+
+        /* visually align the button, +1.5px because of inset box-shadow on parent */
+        padding: 0 13.5px 0 12px;
 
         background: none;
         box-shadow: none;
@@ -109,7 +111,7 @@
 
     #download-button:disabled {
         cursor: unset;
-        opacity: 0.7;
+        color: var(--gray);
     }
 
     :global(#input-container.focused) #download-button {
@@ -122,11 +124,12 @@
     }
 
     @media (hover: hover) {
-        #download-button:hover {
+        #download-button:hover:not(:disabled) {
             background: var(--button-hover-transparent);
         }
-        #download-button:disabled:hover {
-            background: none;
-        }
+    }
+
+    #download-button:active:not(:disabled) {
+        background: var(--button-press-transparent);
     }
 </style>