fix: 样式修改

apps/user/app/(main)/(content)/(user)/wallet/page.tsx

@@ -64,7 +64,7 @@ export default function Page() {
               </p>
               <p className='flex justify-between text-base font-medium text-[#225BA9]'>
                 <span> {user?.refer_code}</span>
-                <CopyShortenedLink className={'sm:block'} />
+                <CopyShortenedLink />
               </p>
             </div>
           </div>

apps/user/app/api/kutt/route.ts

@@ -1,5 +1,5 @@
 // 你的后端 API 密钥，请确保将其存储在 .env.local 文件中
-const BACKEND_API_KEY = 'Q4PuYh7J2H_DlW2X4XUrwYV-yaKty8dw0dwP4LXM';
+const BACKEND_API_KEY = 'NYTOohHPXUaRye4VylNYLyOBTCzwb1tDPt82fXT9';
 import { NextResponse } from 'next/server';
 
 export async function POST(request: Request) {

apps/user/assets/svg-icon/feature/Group 68.svg

@@ -0,0 +1,6 @@
+<svg width="12" height="14" viewBox="0 0 12 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.3887 6.48097L4.03857 7.96976L5.3449 7.16259C5.47568 7.08386 5.63668 7.08386 5.76747 7.16259L7.08856 7.95841L6.72366 6.48026C6.68781 6.32777 6.73913 6.1696 6.85725 6.06817L8.01734 5.07091L6.49023 4.95955C6.33766 4.94679 6.20549 4.85032 6.14571 4.70847L5.54739 3.29272L4.96733 4.70918C4.90757 4.85103 4.77539 4.9475 4.62211 4.96026L3.09009 5.08935L4.25581 6.06958C4.37393 6.16959 4.42526 6.32777 4.3887 6.48097Z" fill="#225BA9"/>
+<path d="M1.87514 13.4638L3.07179 13.0027C3.15334 12.9715 3.24545 12.9935 3.30381 13.0588L4.14541 13.9993L4.71422 11.5678C3.91551 11.4536 3.16813 11.1805 2.50303 10.7791L1.87514 13.4638Z" fill="#225BA9"/>
+<path d="M6.39883 11.5685L6.96764 14L7.80924 13.0595C7.8676 12.9943 7.959 12.9716 8.04126 13.0035L9.23791 13.4645L8.61005 10.7806C7.94493 11.1814 7.19821 11.4543 6.39883 11.5685Z" fill="#225BA9"/>
+<path d="M5.55648 0C2.49251 0 0 2.51449 0 5.60548C0 8.69593 2.49251 11.2102 5.55648 11.2102C8.62046 11.2102 11.113 8.69575 11.113 5.60476C11.113 2.51431 8.62046 0 5.55648 0ZM2.6878 8.38235C2.64772 8.41711 2.59921 8.43413 2.54999 8.43413C2.49093 8.43413 2.43187 8.4093 2.39039 8.36036C1.73582 7.59505 1.37514 6.61622 1.37514 5.60474C1.37514 3.27891 3.251 1.38669 5.55578 1.38669C5.84052 1.38669 6.12316 1.41719 6.39948 1.47393L6.63361 0.884515L7.67277 2.2194L6.00716 2.46056L6.23706 1.88248C6.01277 1.84064 5.78568 1.81226 5.55506 1.81226C3.48229 1.81226 1.79632 3.51385 1.79632 5.60415C1.79632 6.51416 2.12044 7.39369 2.70892 8.08178C2.78626 8.17115 2.77639 8.30576 2.6878 8.38235ZM2.69694 4.9509C2.74826 4.7906 2.88818 4.67853 3.05481 4.66435L4.58754 4.53526L5.17742 3.1252C5.24211 2.97199 5.39116 2.8727 5.55639 2.8727C5.72162 2.8727 5.87067 2.972 5.93536 3.1252L6.53368 4.54094L8.05799 4.66365C8.22392 4.67783 8.36453 4.7899 8.41586 4.95019C8.46719 5.11049 8.41797 5.28499 8.29142 5.3935L7.13132 6.39147L7.48497 7.87103C7.52364 8.03346 7.46177 8.20298 7.32748 8.30228C7.19389 8.40087 7.0153 8.41009 6.87259 8.32356L5.55149 7.52774L4.24095 8.32356C4.17556 8.36328 4.10244 8.38243 4.03002 8.38243C3.94424 8.38243 3.85917 8.35548 3.78674 8.30228C3.65315 8.20298 3.59129 8.03346 3.62925 7.87103L3.97938 6.38224L2.8228 5.39421C2.69484 5.28498 2.64561 5.11119 2.69694 4.9509ZM5.55645 9.82226C5.2717 9.82226 4.98906 9.79176 4.71274 9.73502L4.47861 10.3244L3.43945 8.98955L5.10507 8.7484L4.87516 9.32647C5.09945 9.36832 5.32654 9.39669 5.55717 9.39669C7.62993 9.39669 9.31591 7.69581 9.31591 5.6048C9.31591 4.69479 8.99178 3.81526 8.4033 3.12718C8.32737 3.03851 8.33721 2.90374 8.42509 2.82715C8.51368 2.74984 8.64657 2.75977 8.72249 2.84914C9.37706 3.61446 9.73775 4.59329 9.73775 5.60476C9.73704 7.93059 7.86176 9.82226 5.55645 9.82226Z" fill="#225BA9"/>
+</svg>

apps/user/assets/svg-icon/feature/Group 69.svg

@@ -0,0 +1,10 @@
+<svg width="14" height="11" viewBox="0 0 14 11" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.6757 1.46643C5.90507 0.193432 8.09504 0.193432 9.32447 1.46643C9.55634 1.69656 9.90821 1.34032 9.67572 1.10703C8.26072 -0.358268 5.73942 -0.358268 4.32455 1.10703C4.09392 1.33906 4.44079 1.69718 4.67579 1.4658L4.6757 1.46643Z" fill="#225BA9"/>
+<path d="M8.78559 2.25276C8.99933 2.26032 9.12247 1.97092 8.96122 1.82149C8.43685 1.29816 7.7406 1.0094 6.99995 1.0094C6.25929 1.0094 5.56307 1.29755 5.03868 1.82149C4.80805 2.05414 5.1568 2.411 5.39055 2.18025C6.23805 1.29818 7.76174 1.29818 8.60925 2.18025C8.658 2.2288 8.72175 2.25339 8.78488 2.25339L8.78559 2.25276Z" fill="#225BA9"/>
+<path d="M8.07055 2.96641C8.28429 2.97398 8.40681 2.68583 8.24743 2.53577C7.91618 2.20223 7.47369 2.01813 6.99993 2.01813C6.64681 1.96579 5.37866 2.4248 5.75243 2.89265C5.84993 2.99101 6.00869 2.99101 6.10618 2.89265C6.57181 2.40273 7.42867 2.40273 7.89433 2.89265C7.94308 2.94183 8.00683 2.96641 8.07121 2.96641L8.07055 2.96641Z" fill="#225BA9"/>
+<path d="M6.24992 3.78363C6.27742 4.7811 7.72241 4.78047 7.74992 3.78363C7.72242 2.78616 6.27743 2.78679 6.24992 3.78363Z" fill="#225BA9"/>
+<path d="M11.2499 7.06213H2.74994C2.33744 7.06213 1.99994 7.40261 1.99994 7.81874V9.83637C1.99994 10.2525 2.33744 10.593 2.74994 10.593H11.2499C11.6624 10.593 11.9999 10.2525 11.9999 9.83637V7.81874C11.9999 7.40261 11.6624 7.06213 11.2499 7.06213ZM6.24992 9.07976C6.24992 9.35719 6.02493 9.58417 5.74992 9.58417H3.50001C3.22501 9.58417 3.00001 9.35719 3.00001 9.07976V8.57535C3.00001 8.29792 3.22501 8.07095 3.50001 8.07095H5.74992C6.02493 8.07095 6.24992 8.29792 6.24992 8.57535V9.07976ZM8.74991 9.07976C8.42178 9.07346 8.42178 8.58167 8.74991 8.57535C9.07803 8.58166 9.07803 9.07345 8.74991 9.07976ZM9.7499 9.07976C9.42178 9.07346 9.42178 8.58167 9.7499 8.57535C10.078 8.58166 10.078 9.07345 9.7499 9.07976ZM10.7499 9.07976C10.4218 9.07346 10.4218 8.58167 10.7499 8.57535C11.078 8.58166 11.078 9.07345 10.7499 9.07976Z" fill="#225BA9"/>
+<path d="M0.684989 0.00366675C0.299999 0.0364524 0 0.379446 0 0.785505V8.82761C0 9.24374 0.337502 9.58422 0.749996 9.58422H1.49999V0.757662C1.50687 0.320095 1.11187 -0.0398333 0.684989 0.00366675Z" fill="#225BA9"/>
+<path d="M13.315 0.00374778C12.8813 -0.0403882 12.4944 0.32468 12.5 0.75784V9.58439H13.25C13.6625 9.58439 14 9.24392 14 8.82778V0.785683C14 0.37964 13.7 0.0365463 13.315 0.00374778Z" fill="#225BA9"/>
+<path d="M3.50002 8.57483H5.74992V9.07924H3.50002V8.57483Z" fill="#225BA9"/>
+</svg>

apps/user/assets/svg-icon/feature/Vector (2).svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.8826 1.95453C12.3396 2.39188 12.7343 2.88746 13.0568 3.42798C12.2849 3.21342 11.4982 3.05266 10.7032 2.94695C10.4527 2.05643 10.0542 1.21342 9.52375 0.45076C10.4058 0.789364 11.2086 1.30074 11.8826 1.95453ZM13.9994 6.86591C14.0084 6.12855 13.888 5.39564 13.644 4.69879C12.7833 4.37284 11.8891 4.14182 10.9761 4.01017C11.3804 5.89504 11.3784 7.84244 10.9709 9.72666C11.8883 9.57413 12.7903 9.34058 13.6646 9.02792C13.897 8.33044 14.0097 7.60013 13.9994 6.86591ZM9.5134 13.266C11.0109 12.6907 12.2702 11.6413 13.0929 10.2837C12.3036 10.509 11.5002 10.6831 10.6877 10.8052C10.4302 11.6812 10.0336 12.5114 9.5134 13.266ZM9.87392 3.86338C7.96508 3.6659 6.04009 3.6659 4.13125 3.86338C3.90142 4.87226 3.78424 5.90265 3.78102 6.93687C4.41452 7.18815 4.9611 7.61347 5.35446 8.1622C5.74845 8.71094 5.9725 9.35968 6.00083 10.0305C7.2955 10.0869 8.59281 10.0375 9.879 9.8837C10.3721 7.90584 10.3703 5.83995 9.87392 3.86338ZM7.14432 0C5.67841 0.0221524 4.89679 1.48166 4.43005 2.81522C6.13667 2.66332 7.85367 2.66332 9.55979 2.81522C9.01836 1.31584 8.18723 0.105642 7.14432 0ZM5.9237 11.0381C5.77627 11.5584 5.52583 12.0457 5.18719 12.471C7.00275 15.0661 8.69272 13.3274 9.55979 10.947C8.35204 11.0666 7.13654 11.097 5.9237 11.0381ZM1.35019 2.86578C1.21628 3.04806 1.09267 3.23539 0.979366 3.42274C1.74097 3.21008 2.51738 3.05122 3.30221 2.94679C3.54879 2.04741 3.95309 1.19738 4.49709 0.435367C3.22882 0.924609 2.13436 1.7702 1.35019 2.86578ZM0.387068 4.69361C0.0503586 5.64172 -0.0674484 6.65187 0.0419862 7.6506C0.768177 6.97275 1.75322 6.63033 2.75115 6.70882C2.76596 5.80247 2.86253 4.8993 3.03957 4.01009C2.13311 4.14301 1.24343 4.37208 0.387068 4.69361ZM4.97607 10.2228C5.04302 11.2658 4.16747 12.1166 3.51337 12.8405L2.4833 14L0.639393 11.9089C-0.648193 10.4506 0.0986151 8.02022 2.07635 7.74672C2.80963 7.62456 3.56029 7.83153 4.12165 8.31129C4.68303 8.7904 4.99667 9.49175 4.97607 10.2228ZM2.48841 9.65569C2.21093 9.66455 1.99012 9.88861 1.99012 10.162C1.99012 10.4354 2.21093 10.6595 2.48841 10.6684C2.76653 10.6595 2.9867 10.4354 2.9867 10.162C2.9867 9.88861 2.76653 9.66455 2.48841 9.65569Z" fill="#225BA9"/>
+</svg>

apps/user/assets/svg-icon/feature/Vector (3).svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.49992 4.6275C6.7751 4.6275 7.03919 4.67366 7.28515 4.75955L8.35258 2.52935C7.36227 1.64532 7.9915 0 9.31659 0C10.592 0 11.2569 1.55426 10.339 2.47266C10.0387 2.77298 9.6163 2.93424 9.1711 2.88985L8.06161 5.2077C8.45949 5.55126 8.74109 6.02044 8.84684 6.55156L10.7544 6.54046C11.0962 5.33624 12.6188 4.92787 13.5144 5.82354C14.5538 6.86298 13.8135 8.64681 12.3453 8.64681C11.594 8.64681 10.9466 8.14199 10.7515 7.43441L8.855 7.44551C8.75451 8.00468 8.45947 8.49957 8.03823 8.85365L9.06592 10.6106C10.5347 10.3307 11.5004 12.1303 10.4336 13.1966C9.46789 14.1624 7.82204 13.4648 7.82204 12.1139C7.82204 11.6927 7.99557 11.3041 8.27483 11.0289L7.25823 9.29068C6.64301 9.49577 5.96879 9.44143 5.3991 9.1452L4.3194 10.6363C5.50426 11.9147 4.59341 14 2.8506 14C1.07209 14 0.175877 11.84 1.43437 10.5808C1.99233 10.0228 2.83307 9.83935 3.57918 10.1309L4.69509 8.58952C4.06351 7.86324 3.92563 6.82151 4.35798 5.95322L3.04341 4.9535C1.9047 6.04845 0 5.23746 0 3.65755C0 2.06126 1.93855 1.25668 3.06854 2.38672C3.53419 2.8524 3.71471 3.54478 3.51491 4.19048L4.89841 5.24218C5.32198 4.86064 5.88354 4.6275 6.49992 4.6275Z" fill="#225BA9"/>
+</svg>

apps/user/assets/svg-icon/feature/Vector (4).svg

@@ -0,0 +1,3 @@
+<svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.4804 4.99971L10.346 3.78042V3.88652C10.346 4.07091 10.1992 4.22014 10.0178 4.22014H3.98214C3.80078 4.22014 3.65401 4.07093 3.65401 3.88652V3.78042L2.51953 4.99971L3.65401 6.219V6.1129C3.65401 5.92851 3.80077 5.77928 3.98214 5.77928H10.0178C10.1992 5.77928 10.346 5.92849 10.346 6.1129V6.219L11.4804 4.99971ZM14 8.45503V1.54497C14 1.11943 13.8292 0.733056 13.5541 0.453336C13.279 0.173616 12.899 0 12.4805 0H1.51952C1.101 0 0.720983 0.173616 0.44587 0.453336C0.170199 0.733056 0 1.11943 0 1.54497V8.45503C0 8.88057 0.170756 9.26694 0.44587 9.54667C0.72154 9.82638 1.10155 10 1.51952 10H12.4805C12.899 10 13.279 9.82638 13.5541 9.54667C13.8292 9.26638 14 8.88057 14 8.45503ZM4.31033 3.55347H9.68973V2.94524H9.69141C9.69141 2.85729 9.72545 2.76936 9.79353 2.7041C9.92466 2.57814 10.1311 2.58381 10.255 2.71715C10.885 3.39403 11.5212 4.11573 12.1669 4.77169C12.2852 4.89821 12.2868 5.09963 12.1669 5.22729L10.2779 7.25743C10.2176 7.33687 10.1239 7.38793 10.0178 7.38793C9.83704 7.38793 9.68971 7.23872 9.68971 7.05431V6.44608H4.31031V7.05431H4.30863C4.30863 7.14225 4.27459 7.23019 4.20651 7.29545C4.07537 7.42141 3.8689 7.41573 3.74501 7.2824C3.11499 6.60551 2.47883 5.88382 1.83316 5.22786C1.71486 5.10133 1.71319 4.89991 1.83316 4.77226L3.72216 2.74211C3.78242 2.66268 3.87617 2.61162 3.9822 2.61162C4.163 2.61162 4.31033 2.76083 4.31033 2.94524V3.55347Z" fill="#225BA9"/>
+</svg>

apps/user/assets/svg-icon/feature/Vector.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14 8.47366V12.1579L10.8621 14V10.3158L14 8.47366ZM7.24147 12.1579L10.3794 14V10.3158L7.24147 8.47366V12.1579ZM0 12.1579L3.13805 14V10.3158L0 8.47366V12.1579ZM7 0L3.93445 1.79959L7 3.59919L10.0655 1.79976L7 0ZM3.62082 14L6.7587 12.1579V8.47366L3.62082 10.3158V14ZM3.37935 6.20633L0.241298 8.04845L3.37935 9.89056L6.51724 8.04845L3.37935 6.20633ZM7.24147 7.62341L10.307 5.82382V2.22463L7.24147 4.02422V7.62341ZM6.7587 4.02422L3.69333 2.22463V5.82382L6.75887 7.62358L6.7587 4.02422ZM10.6208 6.2065L7.48293 8.04862L10.6208 9.89073L13.7587 8.04862L10.6208 6.2065Z" fill="#225BA9"/>
+</svg>

apps/user/components/CopyShortenedLink/CopyShortenedLink.tsx

@@ -46,9 +46,9 @@ const CopyShortenedLink = ({ className }: { className?: string }) => {
     <CopyToClipboard
       text={shortUrl} // 如果 shortUrl 还没有值，则传递空字符串
       onCopy={(text, result) => {
-        if (text) {
+        if (!text) {
           toast.success('text is undefined');
-          return '';
+          return;
         }
         if (result) {
           toast.success(t('copySuccess'));

apps/user/components/SubscribePlan/PlanContent/index.tsx

@@ -99,18 +99,24 @@ const StarRating = ({ rating, maxRating = 5 }: { rating: number; maxRating?: num
   </div>
 );
 
+import SvgIcon from '@/components/SvgIcon';
 // 功能列表组件
 const FeatureList = ({ plan }: { plan: API.Subscribe }) => {
   const t = useTranslations('subscribe.detail');
   const tSubscribe = useTranslations('subscribe');
   const tOffer = useTranslations('components.offerDialog');
-  const features = [{ label: tOffer('availableNodes'), value: plan?.server_count }];
+  const features = [
+    { label: tOffer('availableNodes'), icon: 'feature/Vector (5)', value: plan?.server_count },
+  ];
   return (
     <div className='mt-6 space-y-0 sm:mt-6'>
-      <ul className='list-disc space-y-0 pl-5'>
+      <ul className='space-y-0'>
         <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
           <div className={'flex items-start justify-between'}>
-            <span className=''>{t('availableTraffic')}</span>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Vector'} className={'ml-1 mr-2'} />
+              {t('availableTraffic')}
+            </span>
             <span>
               <Display type='traffic' value={plan?.traffic} unlimited />
             </span>
@@ -118,7 +124,10 @@ const FeatureList = ({ plan }: { plan: API.Subscribe }) => {
         </li>
         <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
           <div className={'flex items-start justify-between'}>
-            <span className=''>{tSubscribe('billing.duration')}</span>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Vector (1)'} className={'ml-1 mr-2'} />
+              {tSubscribe('billing.duration')}
+            </span>
             <span>
               {plan.origin_price ? '365' : '30'}
               {tSubscribe('Day')}
@@ -127,7 +136,10 @@ const FeatureList = ({ plan }: { plan: API.Subscribe }) => {
         </li>
         <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
           <div className={'flex items-start justify-between'}>
-            <span className=''>{t('connectionSpeed')}</span>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Vector (4)'} className={'ml-1 mr-2'} />
+              {t('connectionSpeed')}
+            </span>
             <span>
               <Display type='trafficSpeed' value={plan?.speed_limit} unlimited />
             </span>
@@ -135,7 +147,22 @@ const FeatureList = ({ plan }: { plan: API.Subscribe }) => {
         </li>
         <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
           <div className={'flex items-start justify-between'}>
-            <span className=''>{t('connectedDevices')}</span>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Group 69'} className={'ml-1 mr-2'} />
+              {plan?.name?.includes('pro') ? (
+                <span className={'font-medium'}>IEPL专线</span>
+              ) : (
+                <span>国内中转+专线中转</span>
+              )}
+            </span>
+          </div>
+        </li>
+        <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
+          <div className={'flex items-start justify-between'}>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Vector (3)'} className={'ml-1 mr-2'} />
+              {t('connectedDevices')}
+            </span>
             <span>
               <Display value={plan?.device_limit} type='number' unlimited />
             </span>
@@ -147,14 +174,18 @@ const FeatureList = ({ plan }: { plan: API.Subscribe }) => {
             className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'
           >
             <div className={'flex items-start justify-between'}>
-              <span className=''>{feature.label}：</span>
+              <span className='flex items-center'>
+                <SvgIcon name={feature.icon} className={'ml-1 mr-2'} />
+                {feature.label}：
+              </span>
               <span>{feature.value}</span>
             </div>
           </li>
         ))}
-        <li className='py-1'>
+        <li className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
           <div className={'flex items-start justify-between'}>
-            <span className='text-xs font-light leading-[1.8461538461538463em] text-black sm:text-sm'>
+            <span className='flex items-center'>
+              <SvgIcon name={'feature/Group 68'} className={'ml-1 mr-2'} />
               {tOffer('networkStabilityIndex')}
             </span>
             <StarRating rating={5} />
@@ -208,7 +239,7 @@ const PlanCard: React.FC<{
         {t('subscribe')}
       </AiroButton>
 
-      <div className={'mx-4'}>
+      <div className={'mr-4'}>
         {/* 功能列表 */}
         <FeatureList plan={plan} />
       </div>

apps/user/components/affiliate/index.tsx

@@ -85,7 +85,7 @@ export default function Affiliate() {
               </p>
               <p className='flex justify-between text-xl font-bold text-[#225BA9]'>
                 <span> {user?.refer_code}</span>
-                <CopyShortenedLink className={'sm:block'} />
+                <CopyShortenedLink className={'hidden sm:block'} />
               </p>
             </div>
           </div>