diff options
author | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-10-23 05:27:38 +0800 |
---|---|---|
committer | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-10-23 05:27:38 +0800 |
commit | 4bf1ca0d1777d56126b3c5113a129738ba3c8d0d (patch) | |
tree | 80f1636f05fd55308dff48c14033f0f876299c0e | |
parent | d52a04e725afce3c2d563bcc52bd3273002af318 (diff) | |
download | dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar.gz dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar.bz2 dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar.lz dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar.xz dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.tar.zst dexon-0x-contracts-4bf1ca0d1777d56126b3c5113a129738ba3c8d0d.zip |
Making SecondaryButton accept children instead of text prop
-rw-r--r-- | packages/instant/src/components/placing_order_button.tsx | 19 | ||||
-rw-r--r-- | packages/instant/src/components/retry_button.tsx | 2 | ||||
-rw-r--r-- | packages/instant/src/components/secondary_button.tsx | 6 |
3 files changed, 22 insertions, 5 deletions
diff --git a/packages/instant/src/components/placing_order_button.tsx b/packages/instant/src/components/placing_order_button.tsx new file mode 100644 index 000000000..8dc05c445 --- /dev/null +++ b/packages/instant/src/components/placing_order_button.tsx @@ -0,0 +1,19 @@ +import * as React from 'react'; + +import { ColorOption } from '../style/theme'; + +import { Button } from './ui/button'; +import { Container } from './ui/container'; +import { Spinner } from './ui/spinner'; +import { Text } from './ui/text'; + +export const PlacingOrderButton: React.StatelessComponent<{}> = props => ( + <Button isDisabled={true} width="100%"> + <Container display="inline-block" position="relative" top="2px" marginRight="5px"> + <Spinner widthPx={20} heightPx={20} /> + </Container> + <Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px"> + Placing Order… + </Text> + </Button> +); diff --git a/packages/instant/src/components/retry_button.tsx b/packages/instant/src/components/retry_button.tsx index 28547ce54..0d6188e6a 100644 --- a/packages/instant/src/components/retry_button.tsx +++ b/packages/instant/src/components/retry_button.tsx @@ -7,5 +7,5 @@ export interface RetryButtonProps { } export const RetryButton: React.StatelessComponent<RetryButtonProps> = props => { - return <SecondaryButton text="Try Again" onClick={props.onClick} />; + return <SecondaryButton onClick={props.onClick}>Try Again</SecondaryButton>; }; diff --git a/packages/instant/src/components/secondary_button.tsx b/packages/instant/src/components/secondary_button.tsx index e073f6061..3c139a233 100644 --- a/packages/instant/src/components/secondary_button.tsx +++ b/packages/instant/src/components/secondary_button.tsx @@ -6,9 +6,7 @@ import { ColorOption } from '../style/theme'; import { Button, ButtonProps } from './ui/button'; import { Text } from './ui/text'; -export interface SecondaryButtonProps extends ButtonProps { - text: string; -} +export interface SecondaryButtonProps extends ButtonProps {} export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = props => { const buttonProps = _.omit(props, 'text'); @@ -21,7 +19,7 @@ export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = p {...buttonProps} > <Text fontColor={ColorOption.primaryColor} fontWeight={600} fontSize="16px"> - {props.text} + {props.children} </Text> </Button> ); |