nostr/lume
1
0
Fork 0
mirror of https://github.com/luminous-devs/lume.git synced 2024-09-29 16:30:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: update mention popup style

Browse Source
This commit is contained in:
reya 2024-01-27 11:16:17 +07:00
parent 353c18bb76
commit b11e2a4291
2 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/ark/src/components/user/avatar.tsx
View File

@ -39,7 +39,10 @@ export function UserAvatar({ className }: { className?: string }) {
alt={user.pubkey}
loading="eager"
decoding="async"
className={cn("bg-black dark:bg-white", className)}
className={cn(
"bg-black dark:bg-white ring-1 ring-black/5 dark:ring-white/5",
className,
)}
/>
) : (
<Avatar.Image
@ -47,7 +50,7 @@ export function UserAvatar({ className }: { className?: string }) {
alt={user.pubkey}
loading="eager"
decoding="async"
className={className}
className={cn("ring-1 ring-black/5 dark:ring-white/5", className)}
/>
)}
<Avatar.Fallback delayMs={120}>

10
packages/ui/src/editor/form.tsx
View File

@ -356,7 +356,7 @@ export function EditorForm() {
<Portal>
<div
ref={ref}
className="top-[-9999px] left-[-9999px] absolute z-10 w-[250px] p-1 bg-white border border-neutral-50 dark:border-neutral-900 dark:bg-neutral-950 rounded-lg shadow-lg"
className="top-[-9999px] left-[-9999px] absolute z-10 w-[250px] p-2 bg-white border border-neutral-50 dark:border-neutral-900 dark:bg-neutral-950 rounded-xl shadow-lg"
>
{filters.map((contact, i) => (
<button
@ -367,13 +367,13 @@ export function EditorForm() {
insertMention(editor, contact);
setTarget(null);
}}
className="px-2 py-2 rounded-md hover:bg-neutral-100 dark:hover:bg-neutral-900"
className="p-2 flex flex-col w-full rounded-lg hover:bg-neutral-100 dark:hover:bg-neutral-900"
>
<User.Provider pubkey={contact.npub}>
<User.Root className="flex items-center gap-2.5">
<User.Avatar className="size-10 rounded-lg object-cover shrink-0" />
<User.Root className="w-full flex items-center gap-2.5">
<User.Avatar className="size-8 rounded-lg object-cover shrink-0" />
<div className="flex w-full flex-col items-start">
<User.Name className="max-w-[15rem] truncate font-semibold" />
<User.Name className="max-w-[8rem] truncate text-sm font-medium" />
</div>
</User.Root>
</User.Provider>