Metaplex: Feature/m (#103)

* unused components

* dont count up, display finished label

* clean file names (spaces dont work)

* hide auction end time when no auction

* style artcard countdown
This commit is contained in:
Jose 2021-04-30 18:50:43 -05:00 committed by GitHub
parent 7f11a55478
commit 7533b80d0f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 14 deletions

View File

@ -10,7 +10,7 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: flex-start; align-items: flex-start;
padding: 24px; padding: 0;
text-align: left; text-align: left;
/* gradients/metal */ /* gradients/metal */
@ -27,8 +27,17 @@
font-family: Inter; font-family: Inter;
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
padding: 24px 24px 0 24px;
} }
.ant-card-meta {
width: 100%;
}
}
.ant-avatar.ant-avatar-circle {
margin-left: 24px;
} }
.small { .small {
@ -38,10 +47,11 @@
} }
.cd-container { .cd-container {
// background: linear-gradient(270deg, #616774 7.29%, #403F4C 100%); background: linear-gradient(270deg, #616774 7.29%, #403F4C 100%);
// box-shadow: inset 0px 4px 20px rgba(0, 0, 0, 0.3); box-shadow: inset 0px 4px 20px rgba(0, 0, 0, 0.3);
// border-radius: 0px 0px 8px 8px; border-radius: 0px 0px 8px 8px;
margin-top: 10px; margin-top: 20px;
padding: 24px;
} }
.cd-title { .cd-title {

View File

@ -66,14 +66,16 @@ export const ArtCard = (props: ArtCardProps) => {
title={`${name}`} title={`${name}`}
description={<div> description={<div>
<Avatar src="img/artist1.jpeg" /> {artist} <Avatar src="img/artist1.jpeg" /> {artist}
<div className="cd-container"> {endAuctionAt &&
{(hours == 0 && minutes == 0 && seconds == 0) ? <div className="cd-container">
<div className="cd-title">Finished</div> {(hours == 0 && minutes == 0 && seconds == 0) ?
: <> <div className="cd-title">Finished</div>
<div className="cd-title">Ending in</div> : <>
<div className="cd-time">{hours}h {minutes}m {seconds}s</div> <div className="cd-title">Ending in</div>
</>} <div className="cd-time">{hours}h {minutes}m {seconds}s</div>
</div> </>}
</div>
}
</div>} </div>}
/> />
</Card> </Card>

View File

@ -19,3 +19,7 @@ export const getCountdown = (ts: number) => {
return { days, hours, minutes, seconds }; return { days, hours, minutes, seconds };
}; };
export const cleanName = (name: string): string => {
return name.replaceAll(' ', '-');
};

View File

@ -36,6 +36,7 @@ import {
import { Connection, PublicKey } from '@solana/web3.js'; import { Connection, PublicKey } from '@solana/web3.js';
import { MintLayout } from '@solana/spl-token'; import { MintLayout } from '@solana/spl-token';
import { useHistory, useParams } from 'react-router-dom'; import { useHistory, useParams } from 'react-router-dom';
import { cleanName } from '../../utils/utils';
const { Step } = Steps; const { Step } = Steps;
const { Option } = Select; const { Option } = Select;
@ -344,7 +345,7 @@ const UploadStep = (props: {
onClick={() => { onClick={() => {
props.setAttributes({ props.setAttributes({
...props.attributes, ...props.attributes,
files: [mainFile, coverFile].filter(f => f), files: [mainFile, coverFile].filter(f => f).map(f => new File([f], cleanName(f.name), { type: f.type })),
image, image,
}); });
props.confirm(); props.confirm();