From fbd747cba219d7ceef4d9d5b6c56b9e6e80b2fa1 Mon Sep 17 00:00:00 2001
From: Ruben Hensen <ruben.hensen@protonmail.com>
Date: Sat, 16 May 2026 15:39:11 +0200
Subject: [PATCH 1/2] fix(filesharing): inline cancel button inside upload
 progress box

---
 .../components/filesharing/SendButton.svelte  | 51 +++++++++++++++----
 1 file changed, 40 insertions(+), 11 deletions(-)

diff --git a/src/lib/components/filesharing/SendButton.svelte b/src/lib/components/filesharing/SendButton.svelte
index 70251e2..040b434 100644
--- a/src/lib/components/filesharing/SendButton.svelte
+++ b/src/lib/components/filesharing/SendButton.svelte
@@ -364,7 +364,17 @@
                         stroke-width="3"
                     ></circle>
                 </svg>
-                {$_('filesharing.encryptPanel.sending')}
+                <span class="upload-info-label">
+                    {$_('filesharing.encryptPanel.sending')}
+                </span>
+                <button
+                    type="button"
+                    class="cancel-upload-btn"
+                    onclick={onCancelUpload}
+                    disabled={encryptState.selfAborted}
+                >
+                    {$_('filesharing.cancel')}
+                </button>
             </div>
             {#if $retryStatus}
                 <p class="retry-status" role="status">
@@ -377,14 +387,6 @@
                 </p>
             {/if}
         </div>
-        <button
-            type="button"
-            class="crypt-btn crypt-btn-secondary cancel-upload-btn"
-            onclick={onCancelUpload}
-            disabled={encryptState.selfAborted}
-        >
-            {$_('filesharing.cancel')}
-        </button>
     {:else}
         <!-- Normal button -->
         <button
@@ -671,9 +673,36 @@
         stroke: var(--pg-text);
     }
 
+    .upload-info-label {
+        flex: 1;
+    }
+
     .cancel-upload-btn {
-        align-self: flex-start;
-        margin-top: 0.25rem;
+        all: unset;
+        box-sizing: border-box;
+        font-family: var(--pg-font-family);
+        font-size: var(--pg-font-size-sm);
+        font-weight: var(--pg-font-weight-medium);
+        color: var(--pg-on-primary);
+        background: var(--pg-input-error);
+        border-radius: var(--pg-border-radius-sm);
+        padding: 0.4rem 0.9rem;
+        cursor: pointer;
+        transition: background 0.2s ease;
+    }
+
+    .cancel-upload-btn:hover:not(:disabled) {
+        background: color-mix(in srgb, var(--pg-input-error) 85%, black);
+    }
+
+    .cancel-upload-btn:focus-visible {
+        outline: 2px solid var(--pg-primary);
+        outline-offset: 2px;
+    }
+
+    .cancel-upload-btn:disabled {
+        opacity: 0.6;
+        cursor: not-allowed;
     }
 
     .retry-status {

From d0d9534edb9bdd7d8a8bcff317e3e44c0c465e26 Mon Sep 17 00:00:00 2001
From: Ruben Hensen <ruben.hensen@protonmail.com>
Date: Sat, 16 May 2026 15:42:50 +0200
Subject: [PATCH 2/2] fix(decrypt): keep responsive Yivi QR inside its parent
 card

---
 src/lib/components/filesharing/YiviQRCode.svelte | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/lib/components/filesharing/YiviQRCode.svelte b/src/lib/components/filesharing/YiviQRCode.svelte
index 32ba648..19bee61 100644
--- a/src/lib/components/filesharing/YiviQRCode.svelte
+++ b/src/lib/components/filesharing/YiviQRCode.svelte
@@ -88,6 +88,9 @@
     }
 
     .yivi-qr-container.responsive {
+        width: 100%;
+        max-width: 330px;
+        aspect-ratio: 1 / 1;
         height: auto;
         min-height: 200px;
     }