fix(web): allow exiting pin setup flow (#25413)

web/src/routes/auth/pin-prompt/+page.svelte

@@ -40,9 +40,9 @@
 </script>
 
 <AuthPageLayout withHeader={false}>
-  {#if hasPinCode}
+  <div class="flex items-center justify-center">
-    <div class="flex items-center justify-center">
+    <div class="w-96 flex flex-col gap-6 items-center justify-center">
-      <div class="w-96 flex flex-col gap-6 items-center justify-center">
+      {#if hasPinCode}
         {#if isVerified}
           <div in:fade={{ duration: 200 }}>
             <Icon icon={mdiLockOpenVariantOutline} size="64" class="text-success/90" />
@@ -64,13 +64,7 @@
           pinLength={6}
           onFilled={handleUnlockSession}
         />
-
+      {:else}
-        <Button type="button" color="secondary" onclick={() => goto(Route.photos())}>{$t('cancel')}</Button>
-      </div>
-    </div>
-  {:else}
-    <div class="flex items-center justify-center">
-      <div class="w-96 flex flex-col gap-6 items-center justify-center">
         <div class="text-primary">
           <Icon icon={mdiLockSmart} size="64" />
         </div>
@@ -78,7 +72,11 @@
           {$t('new_pin_code_subtitle')}
         </p>
         <PinCodeCreateForm showLabel={false} onCreated={() => (hasPinCode = true)} />
+      {/if}
+
+      <div class={hasPinCode ? '' : 'flex w-full items-start'}>
+        <Button type="button" color="secondary" onclick={() => goto(Route.photos())}>{$t('cancel')}</Button>
       </div>
     </div>
-  {/if}
+  </div>
 </AuthPageLayout>