aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components/erc20_token_selector.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components/erc20_token_selector.tsx')
-rw-r--r--packages/instant/src/components/erc20_token_selector.tsx6
1 files changed, 4 insertions, 2 deletions
diff --git a/packages/instant/src/components/erc20_token_selector.tsx b/packages/instant/src/components/erc20_token_selector.tsx
index 2f637a1a6..a9728365b 100644
--- a/packages/instant/src/components/erc20_token_selector.tsx
+++ b/packages/instant/src/components/erc20_token_selector.tsx
@@ -5,6 +5,7 @@ import { ColorOption } from '../style/theme';
import { ERC20Asset } from '../types';
import { assetUtils } from '../util/asset';
+import { SearchInput } from './search_input';
import { Circle, Container, Flex, Text } from './ui';
export interface ERC20TokenSelectorProps {
@@ -14,7 +15,8 @@ export interface ERC20TokenSelectorProps {
export const ERC20TokenSelector: React.StatelessComponent<ERC20TokenSelectorProps> = ({ tokens, onTokenSelect }) => (
<Container>
- <Container overflow="scroll" height="325px">
+ <SearchInput placeholder="Search tokens..." width="100%" />
+ <Container overflow="scroll" height="325px" marginTop="10px">
{_.map(tokens, token => <TokenSelectorRow key={token.assetData} token={token} onClick={onTokenSelect} />)}
</Container>
</Container>
@@ -40,7 +42,7 @@ class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
darkenOnHover={true}
cursor="pointer"
>
- <Container marginLeft="10px">
+ <Container marginLeft="5px">
<Flex justify="flex-start">
<Container marginRight="10px">
<Circle diameter={30} fillColor={token.metaData.primaryColor}>