feat: 修改文案大小

apps/user/components/main/FooterCopyright.tsx

@@ -11,7 +11,7 @@ export default function FooterCopyright() {
   const t = useTranslations('auth');
 
   return (
-    <footer className={'fixed bottom-6 z-50 w-full text-xs sm:text-lg'}>
+    <footer className={'fixed bottom-6 z-[1] w-full text-xs sm:text-sm'}>
       <div className={'container relative flex items-center justify-center text-right sm:block'}>
         <Image
           src={'./logo.png'}

apps/user/components/main/HomeContent.tsx

@@ -1,18 +1,15 @@
 'use client';
 
-import { Button } from '@workspace/airo-ui/components/button';
 import { useTranslations } from 'next-intl';
-import { useRef } from 'react';
-import OfferDialog, { OfferDialogRef } from './OfferDialog/index';
+import OfferDialog from './OfferDialog/index';
 
 export default function HomeContent() {
-  const dialogRef = useRef<OfferDialogRef>(null);
   const t = useTranslations('components.home');
 
   return (
     <div className='flex min-h-[calc(100vh-73px)] flex-col items-center justify-center pt-8'>
       {/* 大标题 */}
-      <h1 className='mb-6 self-start text-4xl font-bold !leading-tight text-white sm:mb-10 sm:self-center sm:text-6xl'>
+      <h1 className='mb-6 self-start text-4xl font-bold !leading-tight text-white sm:mb-10 sm:self-center sm:text-6xl sm:text-[64px]'>
         {t('connect')}
         <br />
         {t('anytime')}
@@ -30,14 +27,7 @@ export default function HomeContent() {
         <p className={'mt-1 w-[255px] sm:mt-0 sm:w-full'}>{t('getSubscription')}</p>
       </div>
       {/* 按钮 */}
-      <Button
-        onClick={() => dialogRef.current?.show()}
-        className='mb-8 h-auto rounded-full border-2 border-white bg-white/10 px-8 py-2 text-lg font-bold text-white transition hover:bg-white/25 sm:py-4 sm:text-2xl'
-      >
-        {t('viewSubscriptionPlans')}
-      </Button>
-
-      <OfferDialog ref={dialogRef} />
+      <OfferDialog />
     </div>
   );
 }

apps/user/components/main/OfferDialog/index.tsx

@@ -1,19 +1,22 @@
 import { getSubscription } from '@/services/user/portal';
 import { useQuery } from '@tanstack/react-query';
-import { Dialog, DialogContent, DialogTitle } from '@workspace/airo-ui/components/dialog';
-import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
+import {
+  Dialog,
+  DialogContent,
+  DialogTitle,
+  DialogTrigger,
+} from '@workspace/airo-ui/components/dialog';
+import { useRef, useState } from 'react';
 
 import TabContent from '@/components/SubscribePlan/PlanContent/index';
 import PlanTabs from '@/components/SubscribePlan/PlanTabs/PlanTabs';
+import { Button } from '@workspace/airo-ui/components/button';
 import { useTranslations } from 'next-intl';
 
-export interface OfferDialogRef {
-  show: () => void;
-  hide: () => void;
-}
-
-const OfferDialog = forwardRef<OfferDialogRef>((props, ref) => {
+const OfferDialog = () => {
   const t = useTranslations('components.offerDialog');
+  const tHome = useTranslations('components.home');
+
   const [open, setOpen] = useState(false);
   const [tabValue, setTabValue] = useState<'year' | 'month'>('year');
   const dialogRef = useRef<HTMLDivElement>(null);
@@ -40,28 +43,26 @@ const OfferDialog = forwardRef<OfferDialogRef>((props, ref) => {
     },
     enabled: true, // 初始不执行，手动控制
     retry: 1, // 失败时重试1次
+    refetchOnWindowFocus: true,
   });
 
-  useImperativeHandle(ref, () => ({
-    show: () => {
-      refetch();
-      setOpen(true);
-    },
-    hide: () => setOpen(false),
-  }));
-
   return (
     <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <Button className='mb-8 h-auto rounded-full border-[3px] border-white bg-white/10 px-8 py-2 text-lg font-bold text-white transition hover:bg-white/25 sm:px-6 sm:py-1.5'>
+          {tHome('viewSubscriptionPlans')}
+        </Button>
+      </DialogTrigger>
       <DialogContent
         ref={dialogRef}
         className='rounded-0 h-full gap-0 px-4 py-8 sm:max-h-[95%] sm:!rounded-[32px] sm:px-8 sm:py-12 md:max-w-[1280px]'
       >
         <DialogTitle className={'sr-only'}></DialogTitle>
         <div className={'ml-6 sm:ml-0'}>
-          <div className={'text-4xl font-bold text-[#0F2C53] md:mb-4 md:text-center md:text-5xl'}>
+          <div className={'text-4xl font-bold text-[#0F2C53] md:mb-1 md:text-center'}>
             {t('selectPlan')}
           </div>
-          <div className={'text-lg font-medium text-[#666666] md:text-center'}>
+          <div className={'text-base font-medium text-[#666666] md:text-center'}>
             {t('selectYourPlan')}
           </div>
         </div>
@@ -80,6 +81,6 @@ const OfferDialog = forwardRef<OfferDialogRef>((props, ref) => {
       </DialogContent>
     </Dialog>
   );
-});
+};
 
 export default OfferDialog;