Add profile picture preview

This commit is contained in:
Astrid 2024-01-06 16:01:31 +01:00
parent 88bc1aa644
commit acfd34a60b
1 changed files with 15 additions and 3 deletions

View File

@ -1,5 +1,6 @@
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Avatar } from "@/components/Avatar";
import { Button } from "@/components/buttons/Button"; import { Button } from "@/components/buttons/Button";
import { ColorPicker } from "@/components/form/ColorPicker"; import { ColorPicker } from "@/components/form/ColorPicker";
import { IconPicker } from "@/components/form/IconPicker"; import { IconPicker } from "@/components/form/IconPicker";
@ -24,9 +25,20 @@ export function ProfileEditModal(props: ProfileEditModalProps) {
return ( return (
<Modal id={props.id}> <Modal id={props.id}>
<ModalCard> <ModalCard>
<Heading2 className="!mt-0"> <div className="flex justify-between items-center mb-9">
<Heading2 className="!mt-0 !mb-0">
{t("settings.account.profile.title")} {t("settings.account.profile.title")}
</Heading2> </Heading2>
<Avatar
profile={{
colorA: props.colorA,
colorB: props.colorB,
icon: props.userIcon,
}}
iconClass="text-2xl"
sizeClass="w-12 h-12"
/>
</div>
<div className="space-y-6"> <div className="space-y-6">
<ColorPicker <ColorPicker
label={t("settings.account.profile.firstColor")} label={t("settings.account.profile.firstColor")}