crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move header to helper

Browse Source
This commit is contained in:
Steve Klebanoff
2018-12-12 08:25:20 -08:00
parent 7aacf1f5a4
commit 8923817b2f
1 changed files with 33 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
packages/instant/src/components/order_details.tsx
View File

@@ -108,35 +108,7 @@ export class OrderDetails extends React.Component<OrderDetailsProps> {
return (
<Container width="100%" flexGrow={1} padding="20px 20px 0px 20px">
<Container marginBottom="10px">
<Flex justify="space-between">
<Text
letterSpacing="1px"
fontColor={ColorOption.primaryColor}
fontWeight={600}
textTransform="uppercase"
fontSize="14px"
>
Order Details
</Text>
<Container>
<BaseCurrencyChoice
onClick={this.props.onBaseCurrencySwitchEth}
currencyName="ETH"
isSelected={this.props.baseCurrency === BaseCurrency.ETH}
/>
<Container marginLeft="3px" marginRight="3px" display="inline">
<Text fontSize="12px">/</Text>
</Container>
<BaseCurrencyChoice
onClick={this.props.onBaseCurrencySwitchUsd}
currencyName="USD"
isSelected={this.props.baseCurrency === BaseCurrency.USD}
/>
</Container>
</Flex>
</Container>
<Container marginBottom="10px">{this._renderHeader()}</Container>
<OrderDetailsRow
isLoading={this.props.isLoading}
labelText={tokenAmountLabel(
@@ -160,6 +132,38 @@ export class OrderDetails extends React.Component<OrderDetailsProps> {
</Container>
);
}
private _renderHeader(): React.ReactNode {
return (
<Flex justify="space-between">
<Text
letterSpacing="1px"
fontColor={ColorOption.primaryColor}
fontWeight={600}
textTransform="uppercase"
fontSize="14px"
>
Order Details
</Text>
<Container>
<BaseCurrencyChoice
onClick={this.props.onBaseCurrencySwitchEth}
currencyName="ETH"
isSelected={this.props.baseCurrency === BaseCurrency.ETH}
/>
<Container marginLeft="3px" marginRight="3px" display="inline">
<Text fontSize="12px">/</Text>
</Container>
<BaseCurrencyChoice
onClick={this.props.onBaseCurrencySwitchUsd}
currencyName="USD"
isSelected={this.props.baseCurrency === BaseCurrency.USD}
/>
</Container>
</Flex>
);
}
}
export interface OrderDetailsRowProps {