Tweaks to navigation

src/app/components/ThunkStatus.svelte

@@ -28,23 +28,25 @@
   $: failure = Object.entries($status).find(([url, s]) => [Failure, Timeout].includes(s.status))
 </script>
 
-{#if canCancel || isPending}
-  <span class="mt-2 flex items-center gap-1">
-    <span class="loading loading-spinner mx-1 h-3 w-3 translate-y-px" />
-    <span class="opacity-50">Sending...</span>
-    {#if canCancel}
-      <Button class="link" on:click={abort}>Cancel</Button>
-    {/if}
-  </span>
-{:else if isFailure && failure}
-  {@const [url, {message, status}] = failure}
-  <Tippy
-    component={ThunkStatusDetail}
-    props={{url, message, status, retry}}
-    params={{interactive: true}}>
-    <span class="tooltip mt-2 flex cursor-pointer items-center gap-1">
-      <Icon icon="danger" size={3} />
-      <span class="opacity-50">Failed to send!</span>
+<div class="flex justify-end text-xs">
+  {#if canCancel || isPending}
+    <span class="mt-2 flex items-center gap-1">
+      <span class="loading loading-spinner mx-1 h-3 w-3 translate-y-px" />
+      <span class="opacity-50">Sending...</span>
+      {#if canCancel}
+        <Button class="link" on:click={abort}>Cancel</Button>
+      {/if}
     </span>
-  </Tippy>
-{/if}
+  {:else if isFailure && failure}
+    {@const [url, {message, status}] = failure}
+    <Tippy
+      component={ThunkStatusDetail}
+      props={{url, message, status, retry}}
+      params={{interactive: true}}>
+      <span class="tooltip mt-2 flex cursor-pointer items-center gap-1">
+        <Icon icon="danger" size={3} />
+        <span class="opacity-50">Failed to send!</span>
+      </span>
+    </Tippy>
+  {/if}
+</div>