feat: 修改文案大小
This commit is contained in:
parent
bf8c01048c
commit
fb2afa7eda
@ -42,8 +42,8 @@ export default function ChangePassword() {
|
||||
|
||||
return (
|
||||
<Card className='min-w-80 rounded-[20px] border border-[#D9D9D9] p-4 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)] sm:p-6'>
|
||||
<div className={'mb-3'}>
|
||||
<div className={'flex items-center justify-between font-bold sm:text-xl'}>
|
||||
<div className={'mb-3 sm:mb-5'}>
|
||||
<div className={'ml-1 flex items-center justify-between font-bold sm:mb-2 sm:text-xl'}>
|
||||
{t('accountSettings')}
|
||||
<Button
|
||||
type='submit'
|
||||
@ -56,10 +56,14 @@ export default function ChangePassword() {
|
||||
{t('save')}
|
||||
</Button>
|
||||
</div>
|
||||
<div className={'text-xs font-light sm:text-[15px]'}>{t('description')}</div>
|
||||
<div className={'ml-1 text-xs font-light sm:mt-1 sm:text-sm'}>{t('description')}</div>
|
||||
</div>
|
||||
<Form {...form}>
|
||||
<form id='password-form' onSubmit={form.handleSubmit(onSubmit)} className='space-y-4'>
|
||||
<form
|
||||
id='password-form'
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className='space-y-2.5 sm:space-y-5'
|
||||
>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name='password'
|
||||
@ -68,7 +72,7 @@ export default function ChangePassword() {
|
||||
<FormControl>
|
||||
<Input
|
||||
className={
|
||||
'h-[60px] rounded-[20px] text-base shadow-[inset_0_0_7.6px_0_#00000040] sm:text-xl md:text-xl'
|
||||
'line-clamp-1 h-[46px] flex-1 rounded-full px-5 text-base !leading-[46px] shadow-[inset_0_0_7.6px_0_#00000040]'
|
||||
}
|
||||
type='password'
|
||||
placeholder={t('newPassword')}
|
||||
@ -87,7 +91,7 @@ export default function ChangePassword() {
|
||||
<FormControl>
|
||||
<Input
|
||||
className={
|
||||
'h-[60px] rounded-[20px] text-base shadow-[inset_0_0_7.6px_0_#00000040] sm:text-xl md:text-xl'
|
||||
'line-clamp-1 h-[46px] flex-1 rounded-full px-5 text-base !leading-[46px] shadow-[inset_0_0_7.6px_0_#00000040]'
|
||||
}
|
||||
type='password'
|
||||
placeholder={t('repeatNewPassword')}
|
||||
@ -100,13 +104,8 @@ export default function ChangePassword() {
|
||||
/>
|
||||
</form>
|
||||
</Form>
|
||||
<div className={'mt-8 hidden justify-center sm:flex'}>
|
||||
<AiroButton
|
||||
type='submit'
|
||||
variant={'default'}
|
||||
form='password-form'
|
||||
className={'h-full rounded-[50px] px-[55px] py-[9px] text-xl'}
|
||||
>
|
||||
<div className={'mt-5 hidden justify-center sm:flex'}>
|
||||
<AiroButton type='submit' variant={'default'} form='password-form'>
|
||||
{t('save')}
|
||||
</AiroButton>
|
||||
</div>
|
||||
|
||||
@ -60,13 +60,13 @@ export default function NotifySettings() {
|
||||
|
||||
return (
|
||||
<Card className='flex h-full flex-col justify-between rounded-[20px] border border-[#D9D9D9] p-4 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)] sm:p-6'>
|
||||
<div className={'mb-3'}>
|
||||
<div className={'flex items-center justify-between font-bold sm:text-xl'}>
|
||||
<div className={'mb-3 sm:mb-0'}>
|
||||
<div className={'ml-1 flex items-center justify-between font-bold sm:mb-2 sm:text-xl'}>
|
||||
{t('notify.notificationSettings')}
|
||||
<Button
|
||||
type='submit'
|
||||
size='sm'
|
||||
form='notify-form'
|
||||
form='password-form'
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] text-center text-base font-medium leading-[32px] text-white transition hover:bg-[#225BA9] hover:text-white sm:hidden'
|
||||
}
|
||||
@ -74,53 +74,54 @@ export default function NotifySettings() {
|
||||
{t('notify.save')}
|
||||
</Button>
|
||||
</div>
|
||||
<div className={'text-xs font-light sm:text-[15px]'}>{t('notify.description')}</div>
|
||||
<div className={'ml-1 text-xs font-light sm:mt-1 sm:text-sm'}>
|
||||
{' '}
|
||||
{t('notify.description')}
|
||||
</div>
|
||||
</div>
|
||||
<div className={'flex flex-1 flex-col justify-end'}>
|
||||
<Form {...form}>
|
||||
<form
|
||||
id='notify-form'
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className='space-y-2 sm:space-y-2.5'
|
||||
>
|
||||
<div className='grid grid-cols-2 gap-2.5 sm:grid-cols-1'>
|
||||
{[
|
||||
{ name: 'enable_balance_notify', label: 'balanceChange' },
|
||||
{ name: 'enable_login_notify', label: 'login' },
|
||||
{ name: 'enable_subscribe_notify', label: 'subscribe' },
|
||||
{ name: 'enable_trade_notify', label: 'finance' },
|
||||
].map(({ name, label }) => (
|
||||
<FormField
|
||||
key={name}
|
||||
control={form.control}
|
||||
name={name as any}
|
||||
render={({ field }) => (
|
||||
<FormItem className='flex flex-col items-center justify-center rounded-[20px] bg-[#EAEAEA] py-2.5'>
|
||||
<FormLabel className='text-muted-foreground text-sm text-[#848484]'>
|
||||
{t(`notify.${label}`)}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Switch
|
||||
className={
|
||||
'data-[state=checked]:border-[#87ACC8] data-[state=unchecked]:border-[#B1B2BC] data-[state-unchecked]:bg-[#D9D9D9] data-[state=checked]:bg-[#A8D4ED]'
|
||||
}
|
||||
thumbClassName={'border-[#D9D9D9] border'}
|
||||
checked={field.value}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
</FormControl>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</form>
|
||||
</Form>
|
||||
</div>
|
||||
<Form {...form}>
|
||||
<form
|
||||
id='notify-form'
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className='space-y-2 sm:space-y-4'
|
||||
>
|
||||
<div className='grid grid-cols-2 gap-2.5 sm:grid-cols-1 sm:gap-4'>
|
||||
{[
|
||||
{ name: 'enable_balance_notify', label: 'balanceChange' },
|
||||
{ name: 'enable_login_notify', label: 'login' },
|
||||
{ name: 'enable_subscribe_notify', label: 'subscribe' },
|
||||
{ name: 'enable_trade_notify', label: 'finance' },
|
||||
].map(({ name, label }) => (
|
||||
<FormField
|
||||
key={name}
|
||||
control={form.control}
|
||||
name={name as any}
|
||||
render={({ field }) => (
|
||||
<FormItem className='flex flex-col items-center justify-center rounded-[20px] bg-[#EAEAEA] py-2.5'>
|
||||
<FormLabel className='text-muted-foreground text-sm text-[#848484]'>
|
||||
{t(`notify.${label}`)}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Switch
|
||||
className={
|
||||
'data-[state=checked]:border-[#87ACC8] data-[state=unchecked]:border-[#B1B2BC] data-[state-unchecked]:bg-[#D9D9D9] data-[state=checked]:bg-[#A8D4ED]'
|
||||
}
|
||||
thumbClassName={'border-[#D9D9D9] border'}
|
||||
checked={field.value}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
</FormControl>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</form>
|
||||
</Form>
|
||||
<div className={'mt-8 hidden justify-center sm:flex'}>
|
||||
<AiroButton
|
||||
type='submit'
|
||||
form='notify-form'
|
||||
className={'h-full px-[55px] py-[9px] text-xl'}
|
||||
>
|
||||
<AiroButton type='submit' form='notify-form'>
|
||||
{t('notify.save')}
|
||||
</AiroButton>
|
||||
</div>
|
||||
|
||||
@ -6,6 +6,9 @@ import { bindOAuth, unbindOAuth, updateBindEmail, updateBindMobile } from '@/ser
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import { Button } from '@workspace/airo-ui/components/button';
|
||||
import { Card } from '@workspace/airo-ui/components/card';
|
||||
|
||||
import SvgIcon from '@/components/SvgIcon';
|
||||
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
@ -245,7 +248,7 @@ export default function ThirdPartyAccounts() {
|
||||
}
|
||||
>
|
||||
<div className={'flex items-center justify-between text-base font-bold sm:text-xl'}>
|
||||
<span>{t('title')}</span>
|
||||
<span className={'ml-1'}>{t('title')}</span>
|
||||
<div
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-full bg-[#D9D9D9] text-center font-medium leading-[32px] text-white sm:hidden'
|
||||
@ -254,14 +257,17 @@ export default function ThirdPartyAccounts() {
|
||||
{t('save')}
|
||||
</div>
|
||||
</div>
|
||||
<div className='mb-2 text-xs text-[#666666] sm:mb-4 sm:mt-1 sm:text-sm'>
|
||||
<div className='mb-2 ml-1 text-xs text-[#666666] sm:mb-4 sm:mt-1 sm:text-sm'>
|
||||
{user?.auth_methods?.[0]?.auth_identifier}
|
||||
</div>
|
||||
<div className={'mb-1 sm:mb-3'}>{t('emailLabel')}</div>
|
||||
<div className={'flex items-center gap-2'}>
|
||||
<div className={'mb-1 ml-4 flex items-center gap-2 sm:mb-3'}>
|
||||
<SvgIcon name={'email'} />
|
||||
{t('emailLabel')}
|
||||
</div>
|
||||
<div className={'flex items-center gap-6'}>
|
||||
<div
|
||||
className={
|
||||
'line-clamp-1 h-[60px] flex-1 rounded-[20px] bg-[#EAEAEA] px-5 text-base !leading-[60px] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)] sm:text-xl'
|
||||
'line-clamp-1 h-[46px] flex-1 rounded-full bg-[#EAEAEA] px-5 text-base !leading-[46px] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)]'
|
||||
}
|
||||
>
|
||||
{user?.auth_methods?.[0]?.auth_identifier}
|
||||
|
||||
10
apps/user/assets/svg-icon/email.svg
Normal file
10
apps/user/assets/svg-icon/email.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="23" height="18" viewBox="0 0 23 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1657_2239)">
|
||||
<path d="M19.4845 0H3.53155C1.58277 0 0 1.60697 0 3.59281V14.4072C0 15.5242 0.500838 16.5237 1.29062 17.1835C1.30667 17.1965 1.31951 17.2096 1.33557 17.2194C1.93593 17.7028 2.6904 17.9967 3.51549 18H19.4845C20.3 17.9967 21.048 17.7093 21.642 17.2324C21.6997 17.1965 21.7575 17.1573 21.8057 17.1083C21.8217 17.092 21.8346 17.0724 21.8474 17.0561C22.5505 16.4028 22.9936 15.4654 23 14.4202V3.59281C23 1.6135 21.4301 0.00979858 19.4845 0ZM14.977 9.00817L21.1796 2.69788C21.3145 2.9657 21.3948 3.27273 21.3948 3.59608V14.4268C21.3948 14.7501 21.3177 15.0539 21.1796 15.3217L14.977 9.01143V9.00817ZM19.4845 1.6331C19.629 1.6331 19.767 1.65269 19.9019 1.68536L12.8548 8.85465C12.4985 9.22047 12.0105 9.42624 11.5032 9.42624C10.996 9.42624 10.508 9.22047 10.1516 8.85465L3.11097 1.69516C3.23939 1.66576 3.37423 1.64943 3.51549 1.64943L19.4845 1.6331ZM1.82035 15.3185C1.68551 15.0506 1.60525 14.7469 1.60525 14.4235V3.60915C1.60525 3.27926 1.68551 2.96897 1.82677 2.69461L8.0134 8.9951L1.82035 15.3185ZM3.51549 16.3832C3.36781 16.3832 3.22334 16.3604 3.08208 16.3277L9.15634 10.1481C9.79844 10.736 10.63 11.0626 11.4968 11.0626C12.3604 11.0659 13.1919 10.7392 13.834 10.1579L19.9051 16.3342C19.7702 16.3669 19.629 16.3865 19.4813 16.3865H3.51549V16.3832Z" fill="#666666"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1657_2239">
|
||||
<rect width="23" height="18" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
Loading…
x
Reference in New Issue
Block a user