From 3a7be4d1f2a228d24c6c873a9484b65f67348eff Mon Sep 17 00:00:00 2001
From: myf <>
Date: Thu, 12 May 2022 18:32:45 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=86=9B=E5=9B=A2=E9=95=BF?=
 =?UTF-8?q?=EF=BC=8C=E8=91=A3=E4=BA=8B=E4=BC=9A,=E9=A6=96=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/locales/zh-CN.json                     |  5 ++-
 src/config/localization/translations.json     |  5 ++-
 .../Announcement/components/ListItem.tsx      | 36 +++++++++++++++--
 src/views/Home/components/CourseCom.tsx       | 39 ++++++++++---------
 src/views/Referral/components/Regimental.tsx  |  8 ++--
 src/views/Referral/index.tsx                  |  6 +++
 6 files changed, 71 insertions(+), 28 deletions(-)

diff --git a/public/locales/zh-CN.json b/public/locales/zh-CN.json
index 69f1781..73379b1 100644
--- a/public/locales/zh-CN.json
+++ b/public/locales/zh-CN.json
@@ -1138,5 +1138,8 @@
   "Holder": "持币人",
   "Board": "董事会",
   "Whether to cancel": "是否取消",
-  "Please enter a number": "请输入数字"
+  "Please enter a number": "请输入数字",
+  "my wallet": "我的钱包",
+  "Copy the address": "复制地址",
+  "How to use": "如何使用"
 }
diff --git a/src/config/localization/translations.json b/src/config/localization/translations.json
index d8909bd..f5a49f9 100644
--- a/src/config/localization/translations.json
+++ b/src/config/localization/translations.json
@@ -1265,5 +1265,8 @@
   "Holder": "Holder",
   "Board": "Board",
   "Whether to cancel": "Whether to cancel",
-  "Please enter a number": "Please enter a number"
+  "Please enter a number": "Please enter a number",
+  "my wallet": "my wallet",
+  "Copy the address": "Copy the address",
+  "How to use": "How to use"
 }
diff --git a/src/views/Announcement/components/ListItem.tsx b/src/views/Announcement/components/ListItem.tsx
index 6eae0ff..380a324 100644
--- a/src/views/Announcement/components/ListItem.tsx
+++ b/src/views/Announcement/components/ListItem.tsx
@@ -6,7 +6,7 @@ import { Text, Flex } from '@pancakeswap/uikit'
 interface InfoProps {
   title?: string
   content?: string
-  publishTime?: number
+  publishTime?: string
   top?: boolean
 }
 
@@ -24,6 +24,24 @@ const FlexTitle = styled(Flex)`
   font-size: 18px;
   color: #333333;
   align-items: center;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    font-size: 14px;
+  }
+  ${({ theme }) => theme.mediaQueries.lg} {
+    font-size: 18px;
+  }
+`
+const TextTitle = styled(Text)`
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #333333;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    max-width: 100px;
+  }
+  ${({ theme }) => theme.mediaQueries.lg} {
+    max-width: 747px;
+  }
 `
 const TextInfo = styled(Text)`
   overflow: hidden;
@@ -34,10 +52,22 @@ const TextInfo = styled(Text)`
   font-size: 14px;
   color: #666666;
   margin-top: 10px;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    font-size: 12px;
+  }
+  ${({ theme }) => theme.mediaQueries.lg} {
+    font-size: 14px;
+  }
 `
 const TextTime = styled(Text)`
   font-size: 18px;
   color: #999999;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    font-size: 14px;
+  }
+  ${({ theme }) => theme.mediaQueries.lg} {
+    font-size: 18px;
+  }
 `
 const TextTop = styled(Flex)`
   margin-left: 10px;
@@ -59,12 +89,12 @@ const ListItem: React.FC<InfoProps> = ({ title, content, publishTime, top = fals
       <FlexTable>
         <TableInfo>
           <FlexTitle>
-            {title}
+            <TextTitle>{title}</TextTitle>
             {top ? <TextTop>{t('top')}</TextTop> : ''}
           </FlexTitle>
           <TextInfo>{content}</TextInfo>
         </TableInfo>
-        <TextTime color="textSubtle">{publishTime}</TextTime>
+        <TextTime color="textSubtle">{publishTime?.split(' ')[0]}</TextTime>
       </FlexTable>
     </>
   )
diff --git a/src/views/Home/components/CourseCom.tsx b/src/views/Home/components/CourseCom.tsx
index 447d4b8..0987278 100644
--- a/src/views/Home/components/CourseCom.tsx
+++ b/src/views/Home/components/CourseCom.tsx
@@ -39,7 +39,10 @@ const FlexMain = styled(Flex)`
 `
 
 const CardDiv = styled(Card)`
-  padding: 20px;
+  padding: 10px 20px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
 `
 
 const CourseCom: React.FC = () => {
@@ -96,24 +99,22 @@ const CourseCom: React.FC = () => {
       <FirstPage>
         <StyledPage px={['16px', '24px']} mx="auto" maxWidth="1200px">
           <FlexMain>
-            <div>
-              <Stepper>
-                {list.map((item, index) => (
-                  <Step key={item.id} index={index} status={index % 2 ? 'past' : 'current'}>
-                    <CardDiv>
-                      <Heading>{item.title}</Heading>
-                      {item.list.map((childItem) => {
-                        return (
-                          <Text color="textSubtle" marginTop="15px" key={childItem.text}>
-                            {childItem.text}
-                          </Text>
-                        )
-                      })}
-                    </CardDiv>
-                  </Step>
-                ))}
-              </Stepper>
-            </div>
+            <Stepper>
+              {list.map((item, index) => (
+                <Step key={item.id} index={index} status={index % 2 ? 'past' : 'current'}>
+                  <CardDiv style={{ height: '290px' }}>
+                    <Heading>{item.title}</Heading>
+                    {item.list.map((childItem) => {
+                      return (
+                        <Text color="textSubtle" marginTop="15px" key={childItem.text}>
+                          {childItem.text}
+                        </Text>
+                      )
+                    })}
+                  </CardDiv>
+                </Step>
+              ))}
+            </Stepper>
           </FlexMain>
         </StyledPage>
       </FirstPage>
diff --git a/src/views/Referral/components/Regimental.tsx b/src/views/Referral/components/Regimental.tsx
index 5bc3da5..6c4f45d 100644
--- a/src/views/Referral/components/Regimental.tsx
+++ b/src/views/Referral/components/Regimental.tsx
@@ -84,12 +84,14 @@ const RegimentalCom: React.FC = () => {
   const [loading, setLoading] = useState(false)
   const withdraw = useWithdraw()
   const { toastSuccess } = useToast()
+  const [gain, getGain] = useState(true)
   const handleWithdraw = async () => {
     setLoading(true)
     try {
       await withdraw()
       setLoading(false)
       toastSuccess(t('Successfully claimed!'))
+      getGain(false)
     } catch (error) {
       setLoading(false)
     }
@@ -110,9 +112,7 @@ const RegimentalCom: React.FC = () => {
           <FlexCom name={t('total revenue')} value={`${(referralRewardInfo.inviteReward as number) || 0}(HCC)`} />
           <FlexCom
             name={t('revenue')}
-            value={`${
-              ((referralRewardInfo.inviteReward as number) - referralRewardInfo.inviteRewardReceive) as number
-            }(HCC)`}
+            value={`${gain ? referralRewardInfo.inviteReward - referralRewardInfo.inviteRewardReceive || 0 : 0}(HCC)`}
           />
           <FlexCom
             name={t('First stage sharing ratio')}
@@ -126,7 +126,7 @@ const RegimentalCom: React.FC = () => {
 
         <FooterBtn>
           {referralCommanderConfigInfo?.receiveLimit <=
-          referralRewardInfo?.inviteReward - referralRewardInfo?.inviteRewardReceive ? (
+            referralRewardInfo?.inviteReward - referralRewardInfo?.inviteRewardReceive && gain ? (
             <ButtonGet variant="secondary" disabled={loading} onClick={handleWithdraw}>
               {t('Claim now')}
             </ButtonGet>
diff --git a/src/views/Referral/index.tsx b/src/views/Referral/index.tsx
index 5022079..7ef177c 100644
--- a/src/views/Referral/index.tsx
+++ b/src/views/Referral/index.tsx
@@ -29,6 +29,12 @@ const ContentUnunited = styled.div`
   background: rgba(255, 255, 255, 0.39);
   box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16);
   border-radius: 40px;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    width: 80%;
+  }
+  ${({ theme }) => theme.mediaQueries.lg} {
+    width: 30%;
+  }
 `
 
 const Nft: React.FC = () => {