diff options
| -rw-r--r-- | packages/app/src/components/dialog-edit-project.tsx | 15 |
1 files changed, 10 insertions, 5 deletions
diff --git a/packages/app/src/components/dialog-edit-project.tsx b/packages/app/src/components/dialog-edit-project.tsx index 2f0f7db1f..8160821b2 100644 --- a/packages/app/src/components/dialog-edit-project.tsx +++ b/packages/app/src/components/dialog-edit-project.tsx @@ -78,7 +78,7 @@ export function DialogEditProject(props: { project: LocalProject }) { return ( <Dialog title="Edit project"> - <form onSubmit={handleSubmit} class="flex flex-col gap-6 px-2.5 pb-3"> + <form onSubmit={handleSubmit} class="flex flex-col gap-6 p-6"> <div class="flex flex-col gap-4"> <TextField autofocus @@ -145,15 +145,20 @@ export function DialogEditProject(props: { project: LocalProject }) { {(color) => ( <button type="button" - class="relative size-8 rounded-md transition-all" classList={{ - "ring-2 ring-offset-2 ring-offset-surface-base ring-text-interactive-base": + "flex items-center justify-center size-10 p-0.5 rounded-lg overflow-hidden transition-colors cursor-default": true, + "bg-transparent border-2 border-icon-strong-base hover:bg-surface-base-hover": store.color === color, + "bg-transparent border border-transparent hover:bg-surface-base-hover hover:border-border-weak-base": + store.color !== color, }} - style={{ background: getAvatarColors(color).background }} onClick={() => setStore("color", color)} > - <Avatar fallback={store.name || defaultName()} {...getAvatarColors(color)} class="size-full" /> + <Avatar + fallback={store.name || defaultName()} + {...getAvatarColors(color)} + class="size-full rounded" + /> </button> )} </For> |