Files
protocol/packages/instant/src/components/wallet_prompt_fortmatic.tsx
apane 87b90bb04b Adds fortmatic button
Adds fortmatic colors
2020-02-09 21:08:45 -05:00

39 lines
1.1 KiB
TypeScript

import * as React from 'react';
import {Container} from './ui/container';
import {Flex} from './ui/flex';
import {Text} from './ui/text';
import {Icon} from "./ui/icon";
import {ColorOption} from "../style/theme";
export interface WalletPromptFortmaticProps {
onClick?: () => void;
}
export const WalletPromptFortmatic: React.StatelessComponent<WalletPromptFortmaticProps> = ({
onClick
}) => (
<Container
padding="10px"
border={`3px solid ${ColorOption.fortmaticPrimary}`}
backgroundColor={ColorOption.fortmaticSecondary}
width="100%"
borderRadius="4px"
onClick={onClick}
cursor={onClick ? 'pointer' : undefined}
boxShadowOnHover={!!onClick}
marginTop="5px"
>
<Flex>
<Container marginLeft="10px">
<Text fontSize="16px" fontColor={ColorOption.fortmaticPrimary} fontWeight="500">
Connect with <Icon width={13} icon="fortmatic" /> Fortmatic
</Text>
</Container>
</Flex>
</Container>
);
WalletPromptFortmatic.displayName = 'WalletPromptFortmatic';