diff options
Diffstat (limited to 'packages/instant/src/components/install_wallet_panel_content.tsx')
-rw-r--r-- | packages/instant/src/components/install_wallet_panel_content.tsx | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/packages/instant/src/components/install_wallet_panel_content.tsx b/packages/instant/src/components/install_wallet_panel_content.tsx new file mode 100644 index 000000000..546874212 --- /dev/null +++ b/packages/instant/src/components/install_wallet_panel_content.tsx @@ -0,0 +1,32 @@ +import * as React from 'react'; + +import { META_MASK_CHROME_STORE_URL, META_MASK_SITE_URL } from '../constants'; +import { ColorOption } from '../style/theme'; + +import { MetaMaskLogo } from './meta_mask_logo'; +import { StandardPanelContent } from './standard_panel_content'; +import { Button } from './ui/button'; + +export interface InstallWalletPanelContentProps {} + +export const InstallWalletPanelContent: React.StatelessComponent<InstallWalletPanelContentProps> = () => ( + <StandardPanelContent + image={<MetaMaskLogo width={85} height={80} />} + title="Install MetaMask" + description="Please install the MetaMask wallet extension from the Chrome Store." + moreInfoSettings={{ + href: META_MASK_SITE_URL, + text: 'What is MetaMask?', + }} + action={ + <Button + href={META_MASK_CHROME_STORE_URL} + width="100%" + fontColor={ColorOption.white} + backgroundColor={ColorOption.darkOrange} + > + Get Chrome Extension + </Button> + } + /> +); |