Back
Version 8
4/20/2024
/** @jsx jsx */
/** @jsxFrag Fragment */
import { jsx, Fragment } from 'https://deno.land/x/hono/middleware.ts'
export default function UserProfileHeader({ username, name, bio }) {
return (
<div className="flex flex-col gap-2">
<div className="w-16 h-16 bg-neutral-700 rounded-full"></div>
<form hx-post={`/edit-profile/${username}`} className="my-auto">
<h3 className="text-lg font-medium text-neutral-800">
<input type="text" name="name" value={name || 'your name'} className="bg-transparent border-none text-lg font-medium text-neutral-800" />
</h3>
<textarea name="bio" className="bg-transparent border-none w-full text-neutral-800 h-20" maxLength={150} >{bio || 'enter your bio here'}</textarea>
<button type="submit">update header</button>
</form>
</div>
);
}
Updated: May 22, 2024