调整样式

This commit is contained in:
myf 2022-06-09 17:46:52 +08:00
parent 39e3591636
commit 7ee26efb6b
14 changed files with 18 additions and 222 deletions

View File

@ -9,7 +9,7 @@ const config: (t: ContextApi['t']) => MenuEntry[] = (t) => [
}, },
{ {
label: t('IDO Exchange'), label: t('IDO Exchange'),
icon: 'FarmIcon', icon: 'Ido',
href: '/Ido', href: '/Ido',
}, },
{ {
@ -19,7 +19,7 @@ const config: (t: ContextApi['t']) => MenuEntry[] = (t) => [
}, },
{ {
label: t('nft compound'), label: t('nft compound'),
icon: 'NFTBox', icon: 'Compound',
href: '/compound', href: '/compound',
}, },
{ {

View File

@ -1,6 +1,6 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, InputProps, Flex, Link } from '@pancakeswap/uikit' import { Text, Button, Image, Flex } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
interface AuctionRecordProps { interface AuctionRecordProps {

View File

@ -1,14 +1,8 @@
import React, { useState } from 'react' import React from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, InputProps, Flex, Link } from '@pancakeswap/uikit' import { Text, Button, Image, Flex } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
interface TableProps {
title?: string
th?: string[]
tr?: any
}
const FlexMain = styled.div` const FlexMain = styled.div`
margin-top: 30px; margin-top: 30px;
padding: 34px 30px; padding: 34px 30px;
@ -28,86 +22,6 @@ const DetailText = styled(Text)`
margin-bottom: 6px; margin-bottom: 6px;
` `
const TypeFlex = styled(Flex)`
flex-wrap: wrap;
align-items: center;
margin-top: 35px;
padding-left: 30px;
& > .active {
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
color: #fff;
}
`
const TypeItem = styled(Flex)`
width: 128px;
height: 42px;
border: 1px solid #1fc7d4;
border-radius: 30px;
align-items: center;
justify-content: center;
font-size: 12px;
color: #1fc7d4;
margin-right: 15px;
cursor: pointer;
`
const TableThemed = styled(Flex)`
height: 42px;
align-items: center;
/* flex-wrap: wrap; */
`
const ThemedItem = styled.div`
width: 100%;
height: 42px;
line-height: 42px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 16px;
color: #666666;
border-top: 1px solid #e3e3e3;
`
const TableBody = styled.div``
const TrFlex = styled(Flex)`
height: 42px;
border-top: 1px solid #e3e3e3;
align-items: center;
/* flex-wrap: wrap; */
`
const TdFlex = styled(Flex)`
align-items: center;
justify-content: center;
width: 100%;
color: #666666;
font-size: 16px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
`
const TdImage = styled(Image)`
margin-right: 20px;
`
const TdBtnFlex = styled(Flex)`
width: 197px;
flex-direction: column;
justify-content: center;
align-items: center;
`
const DetailButton = styled(Button)`
width: 80px;
height: 30px;
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
border-radius: 30px;
font-size: 12px;
`
const HashText = styled(Text)`
cursor: pointer;
font-size: 14px;
color: #1fc7d4;
margin-top: 5px;
border-bottom: 1px solid #1fc7d4;
`
const AuctionRule: React.FC = () => { const AuctionRule: React.FC = () => {
const { t } = useTranslation() const { t } = useTranslation()

View File

@ -1,14 +1,8 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, InputProps, Flex, Link } from '@pancakeswap/uikit' import { Text, Flex } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
interface TableProps {
title?: string
th?: string[]
tr?: any
}
const FlexMain = styled.div` const FlexMain = styled.div`
margin-top: 30px; margin-top: 30px;
height: 405px; height: 405px;
@ -21,12 +15,6 @@ const FlexMain = styled.div`
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.16);
border-radius: 20px; border-radius: 20px;
` `
const CloseImage = styled(Image)`
cursor: pointer;
position: absolute;
top: 30px;
right: 30px;
`
const HeaderText = styled(Text)` const HeaderText = styled(Text)`
font-size: 24px; font-size: 24px;
color: #333333; color: #333333;
@ -34,32 +22,9 @@ const HeaderText = styled(Text)`
padding: 30px 0; padding: 30px 0;
` `
const TypeFlex = styled(Flex)`
flex-wrap: wrap;
align-items: center;
margin-top: 35px;
padding-left: 30px;
& > .active {
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
color: #fff;
}
`
const TypeItem = styled(Flex)`
width: 128px;
height: 42px;
border: 1px solid #1fc7d4;
border-radius: 30px;
align-items: center;
justify-content: center;
font-size: 12px;
color: #1fc7d4;
margin-right: 15px;
cursor: pointer;
`
const TableThemed = styled(Flex)` const TableThemed = styled(Flex)`
height: 42px; height: 42px;
align-items: center; align-items: center;
/* flex-wrap: wrap; */
` `
const ThemedItem = styled.div` const ThemedItem = styled.div`
width: 100%; width: 100%;
@ -90,29 +55,6 @@ const TdFlex = styled(Flex)`
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
` `
const TdImage = styled(Image)`
margin-right: 20px;
`
const TdBtnFlex = styled(Flex)`
width: 197px;
flex-direction: column;
justify-content: center;
align-items: center;
`
const DetailButton = styled(Button)`
width: 80px;
height: 30px;
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
border-radius: 30px;
font-size: 12px;
`
const HashText = styled(Text)`
cursor: pointer;
font-size: 14px;
color: #1fc7d4;
margin-top: 5px;
border-bottom: 1px solid #1fc7d4;
`
const AuctionTable: React.FC = () => { const AuctionTable: React.FC = () => {
const { t } = useTranslation() const { t } = useTranslation()

View File

@ -164,13 +164,9 @@ const Content: React.FC = () => {
] ]
const [statusIndex, setStatusIndex] = useState(0) const [statusIndex, setStatusIndex] = useState(0)
const cutStatus = (index) => {
setStatusIndex(index)
}
const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => { const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
const { value: inputValue } = evt.target const { value } = evt.target
setSearchTitle(inputValue) setSearchTitle(value)
} }
const searchList = () => { const searchList = () => {
console.log('search') console.log('search')

View File

@ -62,6 +62,7 @@ const FooterValue = styled(Text)`
const ContentShop: React.FC<ContentShop> = ({ list, getDetail }) => { const ContentShop: React.FC<ContentShop> = ({ list, getDetail }) => {
const { t } = useTranslation() const { t } = useTranslation()
const showDetail = () => { const showDetail = () => {
getDetail() getDetail()
} }

View File

@ -35,7 +35,6 @@ const FlexCom: React.FC<FlexProps> = ({
rightSize = '14px', rightSize = '14px',
}) => { }) => {
const openPage = () => { const openPage = () => {
console.log(typeLink)
window.open(typeLink) window.open(typeLink)
} }

View File

@ -1,6 +1,6 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, Input, Flex, Link, Dropdown, useModal } from '@pancakeswap/uikit' import { Text, Button, Image, Input, Flex, Dropdown } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
import ShopList from './ShopList' import ShopList from './ShopList'
import ShopModal from './ShopModal' import ShopModal from './ShopModal'
@ -266,7 +266,6 @@ const SellModal: React.FC<sellModalProps> = ({ onDismiss }) => {
setTradingOnList([...tradingOnList]) setTradingOnList([...tradingOnList])
} }
// const [onShopDetail] = useModal(<ShopModal />)
const onSelectNft = () => { const onSelectNft = () => {
setShowModal(!showModal) setShowModal(!showModal)
} }

View File

@ -109,7 +109,7 @@ const ShopDetail: React.FC<DetailProps> = ({ close }) => {
<TitleText>Cat goddess Emerald</TitleText> <TitleText>Cat goddess Emerald</TitleText>
<FlexCom name={t('Auction countdown')} value="10:57:55:79" size="18px" rightSize="30px" textColor="#333333" /> <FlexCom name={t('Auction countdown')} value="10:57:55:79" size="18px" rightSize="30px" textColor="#333333" />
<FlexCom <FlexCom
name={t('present price%price%', { price: 'HCC=100U' })} name={t('present price%price%', { price: 'HCC=100U' })}
value="70.000.000" value="70.000.000"
size="18px" size="18px"
rightSize="30px" rightSize="30px"

View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import styled, { keyframes } from 'styled-components' import styled, { keyframes } from 'styled-components'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
import { Flex, Image, useModal } from '@pancakeswap/uikit' import { Flex, Image } from '@pancakeswap/uikit'
const MainFlex = styled.div` const MainFlex = styled.div`
& > .epicBcg { & > .epicBcg {
@ -29,8 +29,6 @@ const MainFlex = styled.div`
` `
const ShopItem = styled(Flex)` const ShopItem = styled(Flex)`
/* height: 358px; */
/* border-radius: 20px; */
background: rgba(255, 255, 255, 0.39); background: rgba(255, 255, 255, 0.39);
box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.15); box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.15);
flex-direction: column; flex-direction: column;

View File

@ -1,6 +1,6 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, InputProps, Flex, Link } from '@pancakeswap/uikit' import { Text, Button, Image, Flex } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
interface TransactionRecordProps { interface TransactionRecordProps {

View File

@ -1,14 +1,8 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
import { Text, Button, Image, InputProps, Flex, Link } from '@pancakeswap/uikit' import { Text, Flex } from '@pancakeswap/uikit'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
interface TransactionTableProps {
title?: string
th?: string[]
tr?: any
}
const FlexMain = styled.div` const FlexMain = styled.div`
margin-top: 30px; margin-top: 30px;
height: 405px; height: 405px;
@ -28,28 +22,6 @@ const HeaderText = styled(Text)`
padding: 30px 0; padding: 30px 0;
` `
const TypeFlex = styled(Flex)`
flex-wrap: wrap;
align-items: center;
margin-top: 35px;
padding-left: 30px;
& > .active {
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
color: #fff;
}
`
const TypeItem = styled(Flex)`
width: 128px;
height: 42px;
border: 1px solid #1fc7d4;
border-radius: 30px;
align-items: center;
justify-content: center;
font-size: 12px;
color: #1fc7d4;
margin-right: 15px;
cursor: pointer;
`
const TableThemed = styled(Flex)` const TableThemed = styled(Flex)`
height: 42px; height: 42px;
align-items: center; align-items: center;
@ -82,29 +54,6 @@ const TdFlex = styled(Flex)`
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
` `
const TdImage = styled(Image)`
margin-right: 20px;
`
const TdBtnFlex = styled(Flex)`
width: 197px;
flex-direction: column;
justify-content: center;
align-items: center;
`
const DetailButton = styled(Button)`
width: 80px;
height: 30px;
background: linear-gradient(90deg, #1fd4b0 0%, #1fc9d3 100%);
border-radius: 30px;
font-size: 12px;
`
const HashText = styled(Text)`
cursor: pointer;
font-size: 14px;
color: #1fc7d4;
margin-top: 5px;
border-bottom: 1px solid #1fc7d4;
`
const TransactionTable: React.FC = () => { const TransactionTable: React.FC = () => {
const { t } = useTranslation() const { t } = useTranslation()

View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import styled, { keyframes } from 'styled-components' import styled from 'styled-components'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
import { Text, Flex, Button, Image, useModal } from '@pancakeswap/uikit' import { Text, Flex, Button, useModal } from '@pancakeswap/uikit'
import Preview from './Preview' import Preview from './Preview'
import CombinationRules from './CombinationRules' import CombinationRules from './CombinationRules'
import SynthesisDetail from './SynthesisDetail' import SynthesisDetail from './SynthesisDetail'

View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import styled, { keyframes } from 'styled-components' import styled from 'styled-components'
import { useTranslation } from 'contexts/Localization' import { useTranslation } from 'contexts/Localization'
import { Flex, Image, useModal } from '@pancakeswap/uikit' import { Flex, Image } from '@pancakeswap/uikit'
const MainFlex = styled.div` const MainFlex = styled.div`
& > .epicBcg { & > .epicBcg {
@ -29,8 +29,6 @@ const MainFlex = styled.div`
` `
const ShopItem = styled(Flex)` const ShopItem = styled(Flex)`
/* height: 358px; */
/* border-radius: 20px; */
background: rgba(255, 255, 255, 0.39); background: rgba(255, 255, 255, 0.39);
box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.15); box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.15);
flex-direction: column; flex-direction: column;