diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-11-15 08:15:29 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-11-16 04:41:49 +0800 |
commit | 29747a04874579d194f7f039b77bfcbcf33ed0c6 (patch) | |
tree | 302934ecbd4bf3070dab73863982c98b6ce5d3da /packages/instant/src/components/wallet_prompt.tsx | |
parent | b01db9141b90ed98c48c62823b6553873f940d0b (diff) | |
download | dexon-0x-contracts-29747a04874579d194f7f039b77bfcbcf33ed0c6.tar.gz dexon-0x-contracts-29747a04874579d194f7f039b77bfcbcf33ed0c6.tar.zst dexon-0x-contracts-29747a04874579d194f7f039b77bfcbcf33ed0c6.zip |
feat: use blue for wallet prompt on mobile
Diffstat (limited to 'packages/instant/src/components/wallet_prompt.tsx')
-rw-r--r-- | packages/instant/src/components/wallet_prompt.tsx | 21 |
1 files changed, 17 insertions, 4 deletions
diff --git a/packages/instant/src/components/wallet_prompt.tsx b/packages/instant/src/components/wallet_prompt.tsx index bcf66ee81..a0b3ae457 100644 --- a/packages/instant/src/components/wallet_prompt.tsx +++ b/packages/instant/src/components/wallet_prompt.tsx @@ -9,13 +9,21 @@ import { Text } from './ui/text'; export interface WalletPromptProps { image: React.ReactNode; onClick?: () => void; + primaryColor: ColorOption; + secondaryColor: ColorOption; } -export const WalletPrompt: React.StatelessComponent<WalletPromptProps> = ({ onClick, image, children }) => ( +export const WalletPrompt: React.StatelessComponent<WalletPromptProps> = ({ + onClick, + image, + children, + secondaryColor, + primaryColor, +}) => ( <Container padding="14.5px" - border={`1px solid ${ColorOption.darkOrange}`} - backgroundColor={ColorOption.lightOrange} + border={`1px solid ${primaryColor}`} + backgroundColor={secondaryColor} width="100%" borderRadius="4px" onClick={onClick} @@ -25,10 +33,15 @@ export const WalletPrompt: React.StatelessComponent<WalletPromptProps> = ({ onCl <Flex> {image} <Container marginLeft="10px"> - <Text fontSize="16px" fontColor={ColorOption.darkOrange}> + <Text fontSize="16px" fontColor={primaryColor}> {children} </Text> </Container> </Flex> </Container> ); + +WalletPrompt.defaultProps = { + primaryColor: ColorOption.darkOrange, + secondaryColor: ColorOption.lightOrange, +}; |