From 2c2ac35a899fb433313dbea6ef5cf2a829a9378a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=AA=9A?= <1185064170@qq.com> Date: Wed, 20 Apr 2022 07:09:03 +0000 Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=96=87=E4=BB=B6=20src/view?= =?UTF-8?q?s/recommend?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../recommend/components/BuyNftModal.tsx | 79 ------------- src/views/recommend/components/Connected.tsx | 65 ----------- src/views/recommend/components/FlexCom.tsx | 26 ----- src/views/recommend/components/HeaderMain.tsx | 27 ----- src/views/recommend/components/Regimental.tsx | 108 ------------------ src/views/recommend/components/TextFlex.tsx | 23 ---- .../recommend/components/UnunitedCom.tsx | 42 ------- src/views/recommend/index.tsx | 47 -------- 8 files changed, 417 deletions(-) delete mode 100644 src/views/recommend/components/BuyNftModal.tsx delete mode 100644 src/views/recommend/components/Connected.tsx delete mode 100644 src/views/recommend/components/FlexCom.tsx delete mode 100644 src/views/recommend/components/HeaderMain.tsx delete mode 100644 src/views/recommend/components/Regimental.tsx delete mode 100644 src/views/recommend/components/TextFlex.tsx delete mode 100644 src/views/recommend/components/UnunitedCom.tsx delete mode 100644 src/views/recommend/index.tsx diff --git a/src/views/recommend/components/BuyNftModal.tsx b/src/views/recommend/components/BuyNftModal.tsx deleted file mode 100644 index a4515df..0000000 --- a/src/views/recommend/components/BuyNftModal.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { useTranslation } from 'contexts/Localization' -import { Flex, Button, Modal, Image } from '@pancakeswap/uikit' -import TextFlex from './TextFlex' -import FlexCom from './FlexCom' - -const ModalDiv = styled(Modal)` - width: 80%; - - ${({ theme }) => theme.mediaQueries.xs} { - } -` - -const InfoDiv = styled.div` - box-sizing: border-box; - padding: 30px 26px; - margin-left: 60px; - box-shadow: 0px 1px 8px rgba(15, 161, 146, 0.28); - ${({ theme }) => theme.mediaQueries.xs} { - padding: 20px 10px; - margin-left: 0; - } - ${({ theme }) => theme.mediaQueries.lg} { - padding: 30px 26px; - margin-left: 60px; - } -` -const UpBtn = styled(Button)` - width: 50%; - margin: 20px auto 0px auto; - border-radius: 50px; - background: linear-gradient(180deg, #7be0fc 0%, #ac7bf1 100%); - border: none; -` -const ImageDiv = styled(Image)` - width: 300px; - height: 300px; - margin-bottom: 20px; - ${({ theme }) => theme.mediaQueries.xs} { - width: 150px; - height: 150px; - } - ${({ theme }) => theme.mediaQueries.lg} { - width: 300px; - height: 300px; - } -` - -const BuyNftModal: React.FC = () => { - const { t } = useTranslation() - - // const onDismiss = () => {} - return ( - - - - - - - - - - - - - - - - - {t('Buy It Now')} - - - ) -} -export default BuyNftModal diff --git a/src/views/recommend/components/Connected.tsx b/src/views/recommend/components/Connected.tsx deleted file mode 100644 index 80c8dff..0000000 --- a/src/views/recommend/components/Connected.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { useTranslation } from 'contexts/Localization' -import { Button, useModal, Text } from '@pancakeswap/uikit' -import FlexCom from './FlexCom' -import BuyNftModal from './BuyNftModal' -import HeaderMian from './HeaderMain' - -const ButtonDiv = styled(Button)` - width: 100%; - margin: 20px auto 0px auto; - border-radius: 50px; - border: 1px solid ${({ theme }) => theme.colors.textDisabled}; - color: ${({ theme }) => theme.colors.textDisabled}; -` - -const UpBtn = styled(Button)` - width: 100%; - margin: 20px auto 0px auto; - border-radius: 50px; - background: linear-gradient(180deg, #7be0fc 0%, #ac7bf1 100%); - border: none; -` - -const FooterBtn = styled.div` - width: 100%; - box-sizing: border-box; - padding-bottom: 20px; -` -const MainDiv = styled.div` - padding: 0 30px; -` -const FooterDiv = styled.div` - margin: 0 auto 30px auto; -` -const TextDiv = styled(Text)` - margin-top: 10px; - font-size: 14px; -` - -const ConnectedCom: React.FC = () => { - const { t } = useTranslation() - const [onBuyModal] = useModal() - - return ( - - - <> - - - - - - {t('No income is received temporarily')} - {t('Upgrade commander')} - - - {t('each time')} - {t('last bid')} - {t('commission fee')} - - - ) -} -export default ConnectedCom diff --git a/src/views/recommend/components/FlexCom.tsx b/src/views/recommend/components/FlexCom.tsx deleted file mode 100644 index e66d270..0000000 --- a/src/views/recommend/components/FlexCom.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { Flex, Text } from '@pancakeswap/uikit' - -interface FlexProps { - name: string - value: string - paddings?: string | '0px' - leftColor?: string | 'text' - RightColor?: string | 'textSubtle' -} - -const FlexDiv = styled(Flex)` - justify-content: space-between; - align-items: center; - margin-top: 20px; -` -const FlexCom: React.FC = ({ name, value, paddings, leftColor, RightColor }) => { - return ( - - {name} - {value} - - ) -} -export default FlexCom diff --git a/src/views/recommend/components/HeaderMain.tsx b/src/views/recommend/components/HeaderMain.tsx deleted file mode 100644 index af0f007..0000000 --- a/src/views/recommend/components/HeaderMain.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { Image, Heading } from '@pancakeswap/uikit' - -interface HeaderProp { - title: string -} - -const HeadingDiv = styled(Heading)` - padding-top: 30px; - position: relative; -` - -const TipDiv = styled(Image)` - position: absolute; - cursor: pointer; - top: 24px; - left: 0; -` -const HeaderMian: React.FC = ({ title }) => { - return ( - - {title} - - ) -} -export default HeaderMian diff --git a/src/views/recommend/components/Regimental.tsx b/src/views/recommend/components/Regimental.tsx deleted file mode 100644 index c619df8..0000000 --- a/src/views/recommend/components/Regimental.tsx +++ /dev/null @@ -1,108 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { useTranslation } from 'contexts/Localization' -import { Text, Image, Button } from '@pancakeswap/uikit' -import FlexCom from './FlexCom' -import HeaderMian from './HeaderMain' - -const ButtonDiv = styled(Button)` - width: 100%; - margin: 20px auto 0px auto; - border-radius: 50px; - border: 1px solid ${({ theme }) => theme.colors.textDisabled}; - color: ${({ theme }) => theme.colors.textDisabled}; -` - -const UpBtn = styled(Button)` - width: 100%; - margin: 20px auto 0px auto; - border-radius: 50px; - background: linear-gradient(180deg, #7be0fc 0%, #ac7bf1 100%); - border: none; -` - -const FooterBtn = styled.div` - width: 100%; - box-sizing: border-box; - padding-bottom: 20px; -` - -const ContengDiv = styled.div` - width: 60%; - background: rgba(255, 255, 255, 0.39); - box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16); - border-radius: 40px; - - ${({ theme }) => theme.mediaQueries.sm} { - width: 60%; - } - - ${({ theme }) => theme.mediaQueries.lg} { - width: 60%; - } - ${({ theme }) => theme.mediaQueries.xs} { - width: 90%; - height: 80vh; - overflow-y: auto; - } -` - -const MainDiv = styled.div` - padding: 0 30px; -` -const FooterDiv = styled.div` - margin: 0 auto 30px auto; -` -const TextDiv = styled(Text)` - margin-top: 10px; - font-size: 14px; -` -const LogoImage = styled.div` - display: flex; - align-items: center; - justify-content: center; -` - -const RegimentalCom: React.FC = () => { - const { t } = useTranslation() - return ( - - - - - - - - <> - - - - - - - - - - {t('No income is received temporarily')} - {/* {t('Upgrade commander')} */} - - - {t('each time')} - {t('last bid')} - {t('commission fee')} - - - - ) -} -export default RegimentalCom diff --git a/src/views/recommend/components/TextFlex.tsx b/src/views/recommend/components/TextFlex.tsx deleted file mode 100644 index 85dada1..0000000 --- a/src/views/recommend/components/TextFlex.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { Flex } from '@pancakeswap/uikit' - -interface TextProps { - color: string - text?: string | '' -} - -const MainDiv = styled(Flex)` - box-sizing: border-box; - padding: 14px 36px; - border-radius: 10px; - margin-bottom: 15px; - color: #2f2e41; - font-size: 14px; - justify-content: center; -` - -const TextFlex: React.FC = ({ color, text = '' }) => { - return {text} -} -export default TextFlex diff --git a/src/views/recommend/components/UnunitedCom.tsx b/src/views/recommend/components/UnunitedCom.tsx deleted file mode 100644 index f697364..0000000 --- a/src/views/recommend/components/UnunitedCom.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import React from 'react' -import styled from 'styled-components' -import { useTranslation } from 'contexts/Localization' -import { Button, Heading, Text } from '@pancakeswap/uikit' - -const HeadingDiv = styled(Heading)` - padding-top: 90px; -` - -const ButtonDiv = styled(Button)` - width: 80%; - margin: 80px auto 10px auto; - margin-left: 10%; - border-radius: 50px; -` -const FooterDiv = styled.div` - width: 80%; - margin: 0 auto 30px auto; - margin-left: 10%; -` -const TextDiv = styled(Text)` - margin-top: 10px; - font-size: 14px; -` - -const UnunitedCom: React.FC = () => { - const { t } = useTranslation() - return ( - <> - - {t('recommend')} - - {t('Connect the purse')} - - {t('each time')} - {t('last bid')} - {t('commission fee')} - - - ) -} -export default UnunitedCom diff --git a/src/views/recommend/index.tsx b/src/views/recommend/index.tsx deleted file mode 100644 index 7542356..0000000 --- a/src/views/recommend/index.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import React, { useState } from 'react' -import styled from 'styled-components' -import UnunitedCom from './components/UnunitedCom' -import ConnectedCom from './components/Connected' -import RegimentalCom from './components/Regimental' - -const MainDiv = styled.div` - min-height: calc(100vh - 64px); - background-image: url('/images/recommend/bg.svg'); - background-size: cover; - background-repeat: no-repeat; - display: flex; - align-items: center; - justify-content: center; -` - -const ContengDiv = styled.div` - width: 60%; - background: rgba(255, 255, 255, 0.39); - box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16); - border-radius: 40px; - - ${({ theme }) => theme.mediaQueries.sm} { - width: 60%; - } - - ${({ theme }) => theme.mediaQueries.lg} { - width: 60%; - } - ${({ theme }) => theme.mediaQueries.xs} { - width: 90%; - } -` - -const Nft: React.FC = () => { - // 邀请false普通邀请 true军团长邀请 - const [type, typeState] = useState(false) - // 是否连接钱包 - const [status, statusState] = useState(true) - - return ( - - {type ? : {status ? : }} - - ) -} -export default Nft