S-VPN/panel-web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 修改文案大小

Browse Source
This commit is contained in:
speakeloudest
2025-08-16 09:38:50 -07:00
parent 9cde4cb0a1
commit bf8c01048c
32 changed files with 218 additions and 243 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/user/app/(main)/(content)/(user)/dashboard/components/SubscribeCard/index.tsx
+17 -23
View File
@@ -1,7 +1,6 @@
import { Display } from '@/components/display';
import Renewal from '@/components/subscribe/renewal';
import { resetUserSubscribeToken } from '@/services/user/user';
import { Button } from '@workspace/airo-ui/components/button';
import {
Select,
SelectContent,
@@ -14,6 +13,7 @@ import { toast } from 'sonner';
import SvgIcon from '@/components/SvgIcon';
import useGlobalStore from '@/config/use-global';
import { AiroButton } from '@workspace/airo-ui/components/AiroButton';
import {
AlertDialog,
AlertDialogAction,
@@ -62,13 +62,13 @@ const SubscribeCard = (props: SubscribeCardProps) => {
</p>
{/* 统计信息 */}
<div className='rounded-[20px] bg-[#EAEAEA] p-4'>
<div className='rounded-[20px] bg-[#EAEAEA] py-4'>
<div className='grid grid-cols-3 gap-4 text-center'>
<div>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-xs'>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-sm'>
{t('totalTraffic')}
</p>
<p className='text-xs font-medium text-[#0F2C53] sm:text-lg'>
<p className='text-xs font-medium text-[#0F2C53] sm:text-base'>
<Display
type='traffic'
value={userSubscribeData.traffic}
@@ -77,20 +77,20 @@ const SubscribeCard = (props: SubscribeCardProps) => {
</p>
</div>
<div>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-xs'>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-sm'>
{t('nextResetDays')}
</p>
<p className='text-xs font-medium text-[#0F2C53] sm:text-lg'>
<p className='text-xs font-medium text-[#0F2C53] sm:text-base'>
{userSubscribeData.reset_time
? differenceInDays(new Date(userSubscribeData.reset_time), new Date())
: t('noReset')}
</p>
</div>
<div>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-xs'>
<p className='text-[10px] text-[rgba(132,132,132,0.7)] sm:text-sm'>
{t('expirationDays')}
</p>
<p className='text-xs font-medium text-[#0F2C53] sm:text-lg'>
<p className='text-xs font-medium text-[#0F2C53] sm:text-base'>
{userSubscribeData.expire_time
? differenceInDays(new Date(userSubscribeData.expire_time), new Date()) ||
t('unknown')
@@ -123,7 +123,7 @@ const SubscribeCard = (props: SubscribeCardProps) => {
</Tabs>
)}
</div>
<div className={'mb-3 flex items-center justify-center gap-1'}>
<div className={'mb-3 flex items-center justify-center gap-3'}>
<div
className={
'flex flex-1 items-center gap-1 rounded-full bg-[#BABABA] pl-1 sm:gap-2 sm:rounded-[16px] sm:pl-2'
@@ -133,14 +133,14 @@ const SubscribeCard = (props: SubscribeCardProps) => {
value={userSubscribeProtocolCurrent}
onValueChange={setUserSubscribeProtocolCurrent}
>
<SelectTrigger className='h-auto w-auto flex-shrink-0 rounded-[16px] border-none bg-[#D9D9D9] px-2.5 py-0.5 text-[13px] text-sm font-medium text-white shadow-none hover:bg-[#848484] focus:ring-0 sm:h-[35px] sm:rounded-[8px] sm:p-2 [&>svg]:hidden'>
<SelectTrigger className='h-auto w-auto flex-shrink-0 rounded-[16px] border-none bg-[#D9D9D9] px-2.5 py-0.5 text-[13px] font-medium text-[#0F2C53] shadow-none hover:bg-[#848484] focus:ring-0 sm:h-[35px] sm:rounded-[8px] sm:px-2 sm:py-1.5 [&>svg]:hidden'>
<SelectValue>
<div className='flex flex-col items-center justify-center text-[10px] sm:text-sm'>
<div className='flex flex-col items-center justify-between text-[10px] sm:text-xs'>
<div>
{t('subscriptionUrl')}
{userSubscribeProtocolCurrent + 1}
</div>
<div className='-mt-0.5 h-0 w-0 scale-50 border-l-[5px] border-r-[5px] border-t-[5px] border-l-transparent border-r-transparent border-t-white sm:scale-100'></div>
<div className='-mt-0.5 h-0 w-0 scale-50 border-l-[3px] border-r-[3px] border-t-[3px] border-l-transparent border-r-transparent border-t-[#0F2C53] sm:scale-100'></div>
</div>
</SelectValue>
</SelectTrigger>
@@ -158,8 +158,8 @@ const SubscribeCard = (props: SubscribeCardProps) => {
</SelectContent>
</Select>
<div className='flex-1 rounded-full bg-white px-3 py-1 text-[10px] leading-tight text-[#225BA9] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)] sm:rounded-[16px] sm:text-xs'>
<div className={'flex items-center gap-4 py-1 text-[10px] sm:text-[16px]'}>
<div className='flex-1 rounded-full bg-white px-3 py-2 text-[10px] leading-tight text-[#225BA9] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)] sm:rounded-[16px]'>
<div className={'flex items-center gap-4 py-1'}>
<div className={'line-clamp-2 flex-1 break-all'}>
{userSubscribeProtocol[userSubscribeProtocolCurrent]}
</div>
@@ -203,15 +203,9 @@ const SubscribeCard = (props: SubscribeCardProps) => {
<div className='flex justify-between gap-2'>
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
size='sm'
className={
'h-fit rounded-full bg-[#E22C2E] px-3 py-1 text-[10px] text-white sm:h-9 sm:text-xs'
}
variant='destructive'
>
<AiroButton variant='danger' className={'px-2 text-xs'}>
{t('resetSubscription')}
</Button>
</AiroButton>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
@@ -235,7 +229,7 @@ const SubscribeCard = (props: SubscribeCardProps) => {
</AlertDialogContent>
</AlertDialog>
<Renewal
className='h-fit rounded-full bg-[#A8D4ED] px-3 py-1 text-[10px] text-white sm:h-9 sm:text-xs'
className='px-2 text-xs'
id={userSubscribeData.id}
subscribe={userSubscribeData.subscribe}
/>