feat: 修改文案大小
This commit is contained in:
@@ -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}
|
||||
|
||||
Reference in New Issue
Block a user