dev
/
sudo-archive
mirror of https://github.com/sussy-code/smov.git
2
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #730 from robertsspaceindustries/dev 

Add profile picture preview
This commit is contained in:
William Oldham 2024-01-06 15:15:21 +00:00 committed by GitHub
parent 88bc1aa644 24e3cc739c
commit d13eb07bb6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/parts/auth/AccountCreatePart.tsx
View File

@ -1,6 +1,7 @@
import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar } from "@/components/Avatar";
import { Button } from "@/components/buttons/Button";
import { ColorPicker, initialColor } from "@/components/form/ColorPicker";
import { IconPicker, initialIcon } from "@/components/form/IconPicker";
@ -55,7 +56,13 @@ export function AccountCreatePart(props: AccountCreatePartProps) {
return (
<LargeCard>
<LargeCardText
icon={<Icon icon={Icons.USER} />}
icon={
<Avatar
profile={{ colorA, colorB, icon: userIcon }}
iconClass="text-3xl"
sizeClass="w-16 h-16"
/>
}
title={t("auth.register.information.title") ?? undefined}
>
{t("auth.register.information.header")}

14
src/pages/parts/settings/ProfileEditModal.tsx
View File

@ -1,5 +1,6 @@
import { useTranslation } from "react-i18next";
import { Avatar } from "@/components/Avatar";
import { Button } from "@/components/buttons/Button";
import { ColorPicker } from "@/components/form/ColorPicker";
import { IconPicker } from "@/components/form/IconPicker";
@ -24,9 +25,20 @@ export function ProfileEditModal(props: ProfileEditModalProps) {
return (
<Modal id={props.id}>
<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")}
</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">
<ColorPicker
label={t("settings.account.profile.firstColor")}