Update image uploader styling with object-contain and border (#173)
* Update image uploader styling with object-contain and border * Fix avatar aspect ratio
This commit is contained in:
committed by
GitHub
parent
031e0810a6
commit
c193f9fcb9
@@ -86,7 +86,7 @@ export function AccountSelector({
|
|||||||
pictureUrl ? (
|
pictureUrl ? (
|
||||||
<UserAvatar pictureUrl={pictureUrl} />
|
<UserAvatar pictureUrl={pictureUrl} />
|
||||||
) : (
|
) : (
|
||||||
<PersonIcon className="h-5 min-h-5 w-5 min-w-5" />
|
<PersonIcon className="h-5 w-5" />
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -72,7 +72,12 @@ export function ImageUploader(
|
|||||||
return (
|
return (
|
||||||
<div className={'flex items-center space-x-4'}>
|
<div className={'flex items-center space-x-4'}>
|
||||||
<label className={'animate-in fade-in zoom-in-50 relative h-20 w-20'}>
|
<label className={'animate-in fade-in zoom-in-50 relative h-20 w-20'}>
|
||||||
<Image fill className={'h-20 w-20 rounded-full'} src={image} alt={''} />
|
<Image
|
||||||
|
fill
|
||||||
|
className={'h-20 w-20 rounded-full object-cover'}
|
||||||
|
src={image}
|
||||||
|
alt={''}
|
||||||
|
/>
|
||||||
|
|
||||||
<Input />
|
<Input />
|
||||||
</label>
|
</label>
|
||||||
|
|||||||
@@ -23,7 +23,7 @@ const AvatarImage: React.FC<
|
|||||||
React.ComponentPropsWithRef<typeof AvatarPrimitive.Image>
|
React.ComponentPropsWithRef<typeof AvatarPrimitive.Image>
|
||||||
> = ({ className, ...props }) => (
|
> = ({ className, ...props }) => (
|
||||||
<AvatarPrimitive.Image
|
<AvatarPrimitive.Image
|
||||||
className={cn('aspect-square h-full w-full', className)}
|
className={cn('aspect-square h-full w-full object-cover', className)}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user