Spearhead/joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

feat(instances): refactor card headers #1417

Browse Source
This commit is contained in:
johnytiago 2018-05-17 11:58:18 +01:00 committed by Sérgio Ramos
parent 0189822a08
commit 5c98a4cecb
1 changed files with 30 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/resource-step/src/index.js
View File

@ -46,24 +46,32 @@ export const Header = ({ icon = null, children }) => (
<Flex justifyBetween>
<FlexItem>
<Flex alignCenter>
<FlexItem>{icon}</FlexItem>
<FlexItem>
<Divider vertical />
<Margin right="2">{icon}</Margin>
</FlexItem>
<FlexItem>
<H3 bold>{children}</H3>
</FlexItem>
{/* improve this */}
{optional ? (
<Fragment>
<FlexItem>
<Margin horizontal="1">
<Divider vertical />
</Margin>
</FlexItem>
<FlexItem>
<P optional>Optional</P>
</FlexItem>
</Fragment>
) : null}
</Flex>
</FlexItem>
<FlexItem alignCenter>
<Link
to={expanded ? `/${namespace}` : `/${namespace}/${name}`}
id={'expand-card-' + name}
>
<Link to={expanded ? `/${namespace}` : `/${namespace}/${name}`}>
<Flex alignCenter>
{expanded ? 'Save and Collase' : 'Expand'}
<Margin left={1}>
{expanded ? 'Save and Collase' : 'Edit'}
<Margin left="1">
<Flex>
<ArrowIcon
fill="primary"
@ -74,19 +82,6 @@ export const Header = ({ icon = null, children }) => (
</Flex>
</Link>
</FlexItem>
</Flex>
</FlexItem>
{isValid && !expanded && saved ? (
<FlexItem>
<SavedIcon />
</FlexItem>
) : null}
{/* improve this */}
{!saved && optional ? (
<FlexItem>
<P optional>Optional</P>
</FlexItem>
) : null}
{!expanded && !isValid ? (
<FlexItem>
<ErrorIcon />
@ -94,7 +89,7 @@ export const Header = ({ icon = null, children }) => (
) : null}
</Flex>
{expanded || saved ? (
<Margin vertical={3}>
<Margin vertical="3">
<Divider noMargin />
</Margin>
) : null}
@ -173,7 +168,7 @@ export default class Step extends PureComponent {
>
<Card expanded={expanded} error={!expanded && !isValid}>
<CardOutlet>
<Padding all={5}>{children}</Padding>
<Padding all="5">{children}</Padding>
</CardOutlet>
</Card>
</Broadcast>