Spaces:
Running
Running
| <html lang="en"> | |
| <head><meta charset="UTF-8"><title>Settings</title></head> | |
| <body style="margin:0; background:#f9fafb; display:flex"> | |
| <aside style="width:220px; border-right:1px solid #e5e7eb"> | |
| <div style="padding:0 20px 24px"> | |
| <div style="display:flex; gap:10px"> | |
| <div style="width:36px; border-radius:50%; color:#fff; align-items:center; font-weight:700">A</div> | |
| <div><p style="margin:0; font-weight:600">Amal Joe</p><p style="margin:0; color:#888">Pro Plan</p></div> | |
| </div> | |
| </div> | |
| <nav style="padding:12px 0"> | |
| <a style="display:block; font-size:14px; background:#ede9fe; text-decoration:none">Profile</a> | |
| <a style="display:block; font-size:14px; text-decoration:none">Security</a> | |
| <a style="display:block; font-size:14px; text-decoration:none">Notifications</a> | |
| <a style="display:block; font-size:14px; text-decoration:none">Billing</a> | |
| <a style="display:block; font-size:14px; text-decoration:none">Integrations</a> | |
| </nav> | |
| </aside> | |
| <main style="flex:1"> | |
| <h1 style="font-size:22px">Profile Settings</h1> | |
| <p style="color:#888; margin:0 0 32px">Manage your personal information.</p> | |
| <div style="background:#fff; border-radius:10px; max-width:560px"> | |
| <div style="display:flex; margin-bottom:24px"> | |
| <div style="flex:1"><label style="font-size:12px; color:#444; margin-bottom:6px">First Name</label><input value="Amal" style="width:100%; padding:9px 12px; border-radius:6px"></div> | |
| <div style="flex:1"><label style="font-size:12px; color:#444; margin-bottom:6px">Last Name</label><input value="Joe" style="width:100%; padding:9px 12px; border-radius:6px"></div> | |
| </div> | |
| <label style="font-size:12px; color:#444; margin-bottom:6px">Email</label> | |
| <input value="amaljoe88@gmail.com" style="width:100%; padding:9px 12px; border-radius:6px; margin-bottom:24px"> | |
| <label style="font-size:12px; color:#444; margin-bottom:6px">Bio</label> | |
| <textarea rows="3" style="width:100%; padding:9px 12px; border-radius:6px; margin-bottom:24px">Building AI tools for developers.</textarea> | |
| <button style="padding:10px 24px; color:#fff; border-radius:6px; cursor:pointer">Save Changes</button> | |
| </div> | |
| </main> | |
| </body> | |
| </html> | |