status-im
/
liquid-funding
mirror of https://github.com/status-im/liquid-funding.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

stripe rows

This commit is contained in:
Barry Gitarts 2019-08-21 17:32:48 -04:00 committed by Barry G
parent 01301d09ae
commit 3618b034a1
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/projects/ListProjects.jsx
View File

@ -16,8 +16,9 @@ import { getAmountFromWei } from '../../utils/pledges'
import { getDateFromTimestamp } from '../../utils/dates'
import { FundingContext } from '../../context'
function FundingDetail({ classes, pledgesInfos, goal, goalToken }) {
const { cellText, headerDetails, centerText } = classes
const isOdd = num => num % 2
function FundingDetail({ classes, pledgesInfos, goal, goalToken, cellStyling }) {
const { headerDetails, centerText } = classes
const { prices } = useContext(FundingContext)
const pledgeInfo = pledgesInfos.find(p => p.token.toUpperCase() === goalToken.toUpperCase())
const lifetimeReceived = pledgeInfo ? pledgeInfo.lifetimeReceived : '0'
@ -28,7 +29,7 @@ function FundingDetail({ classes, pledgesInfos, goal, goalToken }) {
const topText = `${fundedPercent} of ${goalAmount}${tokenLabel}`
const usdValue = convertTokenAmountUsd(goalToken, lifetimeHumanReadible, prices)
return (
<div className={classnames(cellText, headerDetails, centerText)}>
<div className={classnames(cellStyling, headerDetails, centerText)}>
<Typography>{topText}</Typography>
<Typography className={classes.usdValue}>{`${usdValue} USD`}</Typography>
</div>
@ -49,7 +50,6 @@ function ListProjects({ classes }) {
const { loading, error, data } = useQuery(getProjects)
if (loading) return <Loading />
if (error) return <div>{`Error! ${error.message}`}</div>
console.log({classes, loading, error, data})
const { profiles } = data
return (
<div className={classes.main}>
@ -69,16 +69,17 @@ function ListProjects({ classes }) {
<Typography className={classnames(tableHeader, classes.dateCreated)}>Date created</Typography>
{profiles.map((profile, i) => {
const { id, profileId, projectInfo: { title, subtitle, goal, goalToken, creator, creationTime }, pledgesInfos } = profile
console.log({i, profile})
const cellStyling = isOdd(i) ? classnames(cellText) : classnames(cellText, classes.cellColor)
const spaceClass = isOdd(i) ? nameSpacer : classnames(nameSpacer, cellColor)
const creationDate = getDateFromTimestamp(creationTime)
return (
<Fragment key={id}>
<Cell spacerClass={classnames(nameSpacer, cellColor)} textClass={classnames(classes.headerName, cellText)} text={title} />
<Typography className={classnames(classes.headerDescription, cellText, classes.cellDescription)}>{subtitle}</Typography>
<FundingDetail classes={classes} pledgesInfos={pledgesInfos} goal={goal} goalToken={goalToken} />
<Typography className={classnames(classes.headerContact, cellText, classes.cellDescription)}>{creator}</Typography>
<Typography className={classnames(classes.dateCreated, cellText, classes.cellDescription)}>{creationDate}</Typography>
<Link to={`/fund-project/${profileId}`} className={classnames(classes.readMore, cellText)}>
<Cell spacerClass={spaceClass} textClass={classnames(classes.headerName, cellStyling)} text={title} />
<Typography className={classnames(classes.headerDescription, cellStyling, classes.cellDescription)}>{subtitle}</Typography>
<FundingDetail classes={classes} pledgesInfos={pledgesInfos} goal={goal} goalToken={goalToken} cellStyling={cellStyling} />
<Typography className={classnames(classes.headerContact, cellStyling, classes.cellDescription)}>{creator}</Typography>
<Typography className={classnames(classes.dateCreated, cellStyling, classes.cellDescription)}>{creationDate}</Typography>
<Link to={`/fund-project/${profileId}`} className={classnames(classes.readMore, cellStyling)}>
<Typography className={classnames(classes.blue, classes.px15)}>Read more</Typography>
</Link>
</Fragment>

3
src/components/projects/styles/ListProjects.js
View File

@ -32,7 +32,6 @@ const styles = theme => ({
display: 'flex',
justifyContent: 'center',
fontSize: '1rem',
background: '#F5F7F8',
flexFlow: 'column',
padding: '1rem 1rem 1rem 0'
},
@ -66,7 +65,7 @@ const styles = theme => ({
alignItems: 'center',
textDecoration: 'none',
marginTop: '2rem',
gridColumn: '3 / 49'
gridColumn: '3 / 18'
},
tableTitle: {
color: '#939BA1',