From 7e9decb66ea4fcfbf8378b2d997d0a8344b6a181 Mon Sep 17 00:00:00 2001
From: Chad Curtis <chad@chadwick.site>
Date: Mon, 16 Mar 2026 05:54:04 -0500
Subject: [PATCH] fix: move profile save button to sticky header

---
 src/pages/ProfileSettings.tsx | 23 ++++++++++-------------
 1 file changed, 10 insertions(+), 13 deletions(-)

diff --git a/src/pages/ProfileSettings.tsx b/src/pages/ProfileSettings.tsx
index 33575d4c..507a10f3 100644
--- a/src/pages/ProfileSettings.tsx
+++ b/src/pages/ProfileSettings.tsx
@@ -460,20 +460,23 @@ export function ProfileSettings() {
       )}
 
       {/* Header */}
-      <div className="px-4 pt-4 pb-3">
-        <div className="flex items-center gap-4">
-          <Link to="/settings" className="p-2 -ml-2 rounded-full hover:bg-secondary transition-colors">
+      <div className="sticky top-0 z-10 bg-background/80 backdrop-blur-md border-b border-border px-4 pt-4 pb-3">
+        <div className="flex items-center gap-3">
+          <Link to="/settings" className="p-2 -ml-2 rounded-full hover:bg-secondary transition-colors shrink-0">
             <ArrowLeft className="size-5" />
           </Link>
-          <div>
-            <h1 className="text-xl font-bold">Profile</h1>
-            <p className="text-sm text-muted-foreground mt-0.5">Your Nostr identity is portable — it goes wherever you go. Edit your display name, bio, and avatar.</p>
+          <div className="flex-1 min-w-0">
+            <h1 className="text-xl font-bold leading-tight">Profile</h1>
+            <p className="text-sm text-muted-foreground truncate">Your Nostr identity is portable — it goes wherever you go.</p>
           </div>
+          <Button type="submit" form="profile-settings-form" size="sm" className="shrink-0 rounded-full font-bold px-5" disabled={busy}>
+            {busy ? <Loader2 className="size-3.5 animate-spin" /> : 'Save'}
+          </Button>
         </div>
       </div>
 
       <Form {...form}>
-        <form onSubmit={form.handleSubmit(onSubmit)} className="max-w-xl mx-auto px-4 pb-10 space-y-6">
+        <form id="profile-settings-form" onSubmit={form.handleSubmit(onSubmit)} className="max-w-xl mx-auto px-4 pb-10 space-y-6">
 
           {/* Intro */}
           <div className="flex items-center gap-4 px-3 pt-2 pb-2">
@@ -614,12 +617,6 @@ export function ProfileSettings() {
             </CollapsibleContent>
           </Collapsible>
 
-          {/* Save */}
-          <Button type="submit" className="w-full" disabled={busy}>
-            {busy && <Loader2 className="mr-2 size-4 animate-spin" />}
-            Save Profile
-          </Button>
-
         </form>
       </Form>
     </main>