修改NFT图片

src/components/ConnectWalletButton.tsx

@@ -22,9 +22,9 @@ const ConnectWalletButton = (props: ConnectWalletButtonProps) => {
   const [visible, setVisible] = useState(false)
   const { copyVal } = useCopyLink()
 
-  const [contractCount,setContractCount] = useState(0)
+  const [contractCount, setContractCount] = useState(0)
 
-  const {t} = useTranslation()
+  const { t } = useTranslation()
 
   const connectWallet = async () => {
     setLoading(true);
@@ -49,9 +49,9 @@ const ConnectWalletButton = (props: ConnectWalletButtonProps) => {
     setContractCount(_record.length)
   }
 
-  useEffect(()=>{
+  useEffect(() => {
     walletAddress && visible && getData()
-  },[walletAddress,visible])
+  }, [walletAddress, visible])
 
   return (
     <div className="connect-button">
@@ -87,7 +87,7 @@ const ConnectWalletButton = (props: ConnectWalletButtonProps) => {
             <div>
               <img src={require('~/assets/fil.png')} className='header-fil' alt="" />
             </div>
-            <div className='ml-2'>
+            <div className='ml-1'>
               <div>Filecoin(FIL)</div>
               <div className='mt-5px'>{t('Balance')}：{filBalance}FIL</div>
             </div>
@@ -96,7 +96,7 @@ const ConnectWalletButton = (props: ConnectWalletButtonProps) => {
             <div>
               <img src={require('~/assets/contract.png')} className='header-fil' alt="" />
             </div>
-            <div className='ml-2'>
+            <div className='ml-1'>
               <div>{t('SOFIL Staking Contract')}</div>
               <div className='mt-5px'>{t('Staking Amount')}：{contractCount}</div>
             </div>
@@ -104,12 +104,12 @@ const ConnectWalletButton = (props: ConnectWalletButtonProps) => {
           <div className='header-divider mt-3'></div>
           <div className='row-center mt-2' onClick={() => toPath('/myPledge')}>
             <img src={require('~/assets/pledge.png')} className='header-pledge-img' alt="" />
-            <div className=''>{t('My Staking')}</div>
+            <div className='ml-1'>{t('My Staking')}</div>
           </div>
           <div className='header-divider mt-2'></div>
           <div className='row-center mt-2' onClick={() => toPath('/invitation')}>
             <img src={require('~/assets/recommend.png')} className='header-recommend-img' alt="" />
-            <div className='' >{t('My Referral')}</div>
+            <div className='ml-1' >{t('My Referral')}</div>
           </div>
           <div className='header-divider mt-2'></div>
           <div className='mt-3 tac header-logout' onClick={logout}>{t('Log out')}</div>

src/pages/invitation-detail/index.tsx

@@ -85,7 +85,7 @@ const InvitationDetail = () => {
       <div className='plr-3 mt-2'>
         <div className='box p-2'>
           <div className='row-center'>
-            <img src={require('~/assets/NFT.png')} className="img" alt="" />
+            <img src={require('~/assets/NFT.jpg')} className="img" alt="" />
           </div>
           <div className='fz-18 fz-wb-550 mt-3'>{t('NFT Details')}</div>
           <div className='mt-1 row-between'>

src/pages/invitation/index.tsx

@@ -281,7 +281,7 @@ const ContractRecord = (props: ContractRecordProps) => {
           }}>
             <div className='flex-2 row-center'>
               <div className='row-items'>
-                <img src={require('~/assets/NFT.png')} className='nft-img' alt="" />
+                <img src={require('~/assets/NFT.jpg')} className='nft-img' alt="" />
                 <div className='ml-5px'>
                   <div style={{ textAlign: 'start' }} className='fz-wb-550'># {item.tokenId}</div>
                   <div>{item.pledgeDay} {t('Days')}</div>

src/pages/my-pledge/index.tsx

@@ -249,7 +249,7 @@ const PledgeContract = (props: PledgeContractProps) => {
             }}>
               <div className='flex-2 row-center'>
                 <div className='row-items'>
-                  <img src={require('~/assets/NFT.png')} className='nft-img' alt="" />
+                  <img src={require('~/assets/NFT.jpg')} className='nft-img' alt="" />
                   <div className='ml-5px'>
                     <div style={{ textAlign: 'start' }} className='fz-wb-550'># {item.tokenId}</div>
                     <div>{item.pledgeDay} {t('Days')}</div>

src/pages/nft-detail/index.tsx

@@ -135,7 +135,7 @@ const NFTDetail = () => {
                 data.isBlack ? (
                   <img src={require('~/assets/NFT-black.png')} className="img" alt="" />
                 ) : (
-                  <img src={require('~/assets/NFT.png')} className="img" alt="" />
+                  <img src={require('~/assets/NFT.jpg')} className="img" alt="" />
                 )
               }
             </div>

src/styles/layout.scss

@@ -151,6 +151,7 @@
     .box {
       height: 50px;
     }
+
     .box-1 {
       height: 40px;
     }
@@ -163,6 +164,7 @@
     opacity: 1;
     background: #313131;
     box-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.1608);
+
     &:active {
       opacity: 0.8;
     }
@@ -174,7 +176,8 @@
 
   .text-divider {
     border-bottom: 1px solid $white;
-    &:active{
+
+    &:active {
       opacity: 0.8;
     }
   }
@@ -204,9 +207,9 @@
 
 .rv-popup {
   .header-fil {
-    width: 40px;
-    height: 40px;
-    object-fit: cover;
+    width: 50px;
+    height: 50px;
+    object-fit: contain;
   }
 
   .header-divider {
@@ -216,17 +219,15 @@
   }
 
   .header-pledge-img {
-    width: 50px;
-    height: 50px;
+    width: 40px;
+    height: 40px;
     object-fit: cover;
   }
 
   .header-recommend-img {
-    width: 30px;
-    height: 30px;
+    width: 40px;
+    height: 40px;
     object-fit: cover;
-    margin-left: 15px;
-    margin-right: 10px;
   }
 
   .header-logout {

src/utils/share.ts

@@ -25,39 +25,11 @@ export const shareLK = async (language: LanguageType, address: string) => {
 
 const shareText = (language: LanguageType, address: string) => {
   const ts = {
-    'en': `
-    Join me to stake $FIL on SOFIL with my referral code to earn up to 16.23% APY !
-    SOFIL is a DeFi platform offering stake-to-earn opportunities to crypto holders. 
+    'en': `Stake $FIL on SOFIL with my referral code to earn up to 16.23% APY!\n \nMy referral code: ${address} \n \nInsert my code before you stake!\n \nScan the following QR code or directly visit https://app.sofil.io on your MetaMask`,
 
-    My referral code: ${address}
-    You can insert my referral code before you stake.
+    'hk': `使用我的推薦碼在 SOFIL 上質押 $FIL，即可賺取高達 16.23% 年利率！\n \n我的推薦碼：${address} \n \n您可以在質押前輸入我的推薦碼。\n \n掃描以下二維碼或直接在 MetaMask 上瀏覽 app.sofil.io，與我一起探索 SOFIL 的更多內容！`,
 
-    Come and explore more with me on SOFIL by scanning the following QR code or directly visit app.sofil.io on your MetaMask
-    
-    SOFIL Official Website: https://sofil.io
-    `,
-
-    'hk':
-      `
-       使用我的推薦碼在 SOFIL 上質押 $FIL，即可賺取高達 16.23% 年利率！\n
-       SOFIL 是一個去中心金融平台，為加密貨幣持有者提供質押賺取的機會。\n
-       我的推薦碼：${address} \n
-       您可以在質押前輸入我的推薦碼。\n
-       掃描以下二維碼或直接在 MetaMask 上瀏覽 app.sofil.io，與我一起探索 SOFIL 的更多內容！\n
-       SOFIL官方網站：https://sofil.io
-      `,
-
-    'zh': `
-    使用我的推荐码在 SOFIL 上质押 $FIL，即可赚取高达 16.23% 年利率！
-    SOFIL 是一个去中心金融平台，为加密货币持有者提供质押赚取的机会。 
-
-    我的推荐码：${address}
-    您可以在质押前输入我的推荐码。
-    
-    扫描以下二维码或直接在 MetaMask 上浏览 app.sofil.io，与我一起探索 SOFIL 的更多内容！
-    
-    SOFIL官方网站：https://sofil.io
-    `
+    'zh': `使用我的推荐码在 SOFIL 上质押 $FIL，即可赚取高达 16.23% 年利率！\n \n我的推荐码：${address} \n \n您可以在质押前输入我的推荐码。\n \n扫描以下二维码或直接在 MetaMask 上浏览 app.sofil.io，与我一起探索 SOFIL 的更多内容！`
   } as { [key: string]: string }
   return ts[language]
 }