zecfoundation
/
zcash-grant-system
mirror of https://github.com/ZcashFoundation/zcash-grant-system.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #153 from grant-project/tabs-min-height 

Minimum tab heights on proposals and profiles.
This commit is contained in:
Daniel Ternyak 2019-02-04 21:58:40 -06:00 committed by GitHub
parent 257a8bd21d 6bfd9cb90f
commit d468f9e287
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 95 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
frontend/client/components/Profile/index.tsx
View File

@ -113,74 +113,80 @@ class Profile extends React.Component<Props, State> {
render={() => <ProfileEdit user={user} />}
/>
</Switch>
<LinkableTabs defaultActiveKey="pending">
{isAuthedUser && (
<Tabs.TabPane
tab={TabTitle('Pending', pendingProposals.length)}
key="pending"
>
<div className="Profile-tabs">
<LinkableTabs defaultActiveKey="pending">
{isAuthedUser && (
<Tabs.TabPane
tab={TabTitle('Pending', pendingProposals.length)}
key="pending"
>
<div>
{nonePending && (
<Placeholder
title="No pending proposals"
subtitle="You do not have any proposals awaiting approval."
/>
)}
<ProfilePendingList proposals={pendingProposals} />
</div>
</Tabs.TabPane>
)}
<Tabs.TabPane tab={TabTitle('Created', proposals.length)} key="created">
<div>
{nonePending && (
<Placeholder
title="No pending proposals"
subtitle="You do not have any proposals awaiting approval."
/>
{noneCreated && (
<Placeholder subtitle="Has not created any proposals yet" />
)}
<ProfilePendingList proposals={pendingProposals} />
</div>
</Tabs.TabPane>
)}
<Tabs.TabPane tab={TabTitle('Created', proposals.length)} key="created">
<div>
{noneCreated && (
<Placeholder subtitle="Has not created any proposals yet" />
)}
{proposals.map(p => (
<ProfileProposal key={p.proposalId} proposal={p} />
))}
</div>
</Tabs.TabPane>
<Tabs.TabPane tab={TabTitle('Funded', contributions.length)} key="funded">
<div>
{noneFunded && <Placeholder subtitle="Has not funded any proposals yet" />}
{contributions.map(c => (
<ProfileContribution
key={c.id}
userId={user.userid}
contribution={c}
showSendInstructions={this.openContributionModal}
/>
))}
</div>
</Tabs.TabPane>
<Tabs.TabPane tab={TabTitle('Comments', comments.length)} key="comments">
<div>
{noneCommented && <Placeholder subtitle="Has not made any comments yet" />}
{comments.map(c => (
<ProfileComment key={c.id} userName={user.displayName} comment={c} />
))}
</div>
</Tabs.TabPane>
{isAuthedUser && (
<Tabs.TabPane
tab={TabTitle('Invites', invites.length)}
key="invites"
disabled={!user.hasFetchedInvites}
>
<div>
{noneInvites && (
<Placeholder
title="No invites here!"
subtitle="You’ll be notified when you’ve been invited to join a proposal"
/>
)}
{invites.map(invite => (
<ProfileInvite key={invite.id} userId={user.userid} invite={invite} />
{proposals.map(p => (
<ProfileProposal key={p.proposalId} proposal={p} />
))}
</div>
</Tabs.TabPane>
)}
</LinkableTabs>
<Tabs.TabPane tab={TabTitle('Funded', contributions.length)} key="funded">
<div>
{noneFunded && (
<Placeholder subtitle="Has not funded any proposals yet" />
)}
{contributions.map(c => (
<ProfileContribution
key={c.id}
userId={user.userid}
contribution={c}
showSendInstructions={this.openContributionModal}
/>
))}
</div>
</Tabs.TabPane>
<Tabs.TabPane tab={TabTitle('Comments', comments.length)} key="comments">
<div>
{noneCommented && (
<Placeholder subtitle="Has not made any comments yet" />
)}
{comments.map(c => (
<ProfileComment key={c.id} userName={user.displayName} comment={c} />
))}
</div>
</Tabs.TabPane>
{isAuthedUser && (
<Tabs.TabPane
tab={TabTitle('Invites', invites.length)}
key="invites"
disabled={!user.hasFetchedInvites}
>
<div>
{noneInvites && (
<Placeholder
title="No invites here!"
subtitle="You’ll be notified when you’ve been invited to join a proposal"
/>
)}
{invites.map(invite => (
<ProfileInvite key={invite.id} userId={user.userid} invite={invite} />
))}
</div>
</Tabs.TabPane>
)}
</LinkableTabs>
</div>
<ContributionModal
isVisible={!!activeContribution}

4
frontend/client/components/Profile/style.less
View File

@ -4,6 +4,10 @@
max-width: 800px;
margin: 0 auto;
&-tabs {
min-height: 400px;
}
& .ant-tabs-nav .ant-tabs-tab {
padding-right: 5px;
}

4
frontend/client/components/Proposal/index.less
View File

@ -212,4 +212,8 @@
}
}
}
&-bottom {
min-height: 400px;
}
}

34
frontend/client/components/Proposal/index.tsx
View File

@ -243,22 +243,24 @@ export class ProposalDetail extends React.Component<Props, State> {
</div>
</div>
<LinkableTabs scrollToTabs defaultActiveKey="milestones">
<Tabs.TabPane tab="Milestones" key="milestones">
<div style={{ marginTop: '1.5rem', padding: '0 2rem' }}>
<Milestones proposal={proposal} />
</div>
</Tabs.TabPane>
<Tabs.TabPane tab="Discussion" key="discussions" disabled={!isLive}>
<CommentsTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
<Tabs.TabPane tab="Updates" key="updates" disabled={!isLive}>
<UpdatesTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
<Tabs.TabPane tab="Contributors" key="contributors" disabled={!isLive}>
<ContributorsTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
</LinkableTabs>
<div className="Proposal-bottom">
<LinkableTabs scrollToTabs defaultActiveKey="milestones">
<Tabs.TabPane tab="Milestones" key="milestones">
<div style={{ marginTop: '1.5rem', padding: '0 2rem' }}>
<Milestones proposal={proposal} />
</div>
</Tabs.TabPane>
<Tabs.TabPane tab="Discussion" key="discussions" disabled={!isLive}>
<CommentsTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
<Tabs.TabPane tab="Updates" key="updates" disabled={!isLive}>
<UpdatesTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
<Tabs.TabPane tab="Contributors" key="contributors" disabled={!isLive}>
<ContributorsTab proposalId={proposal.proposalId} />
</Tabs.TabPane>
</LinkableTabs>
</div>
{isTrustee && (
<>