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.tsx12
1 files changed, 8 insertions, 4 deletions
diff --git a/packages/instant/src/components/erc20_token_selector.tsx b/packages/instant/src/components/erc20_token_selector.tsx
index 481778495..3503ff31a 100644
--- a/packages/instant/src/components/erc20_token_selector.tsx
+++ b/packages/instant/src/components/erc20_token_selector.tsx
@@ -6,7 +6,11 @@ import { ERC20Asset } from '../types';
import { assetUtils } from '../util/asset';
import { SearchInput } from './search_input';
-import { Circle, Container, Flex, Text } from './ui';
+
+import { Circle } from './ui/circle';
+import { Container } from './ui/container';
+import { Flex } from './ui/flex';
+import { Text } from './ui/text';
export interface ERC20TokenSelectorProps {
tokens: ERC20Asset[];
@@ -24,14 +28,14 @@ export class ERC20TokenSelector extends React.Component<ERC20TokenSelectorProps>
public render(): React.ReactNode {
const { tokens, onTokenSelect } = this.props;
return (
- <Container>
+ <Container height="100%">
<SearchInput
placeholder="Search tokens..."
width="100%"
value={this.state.searchQuery}
onChange={this._handleSearchInputChange}
/>
- <Container overflow="scroll" height="275px" marginTop="10px">
+ <Container overflow="scroll" height="calc(100% - 80px)" marginTop="10px">
{_.map(tokens, token => {
if (!this._isTokenQueryMatch(token)) {
return null;
@@ -81,7 +85,7 @@ class TokenSelectorRow extends React.Component<TokenSelectorRowProps> {
<Container marginLeft="5px">
<Flex justify="flex-start">
<Container marginRight="10px">
- <Circle diameter={30} fillColor={token.metaData.primaryColor}>
+ <Circle diameter={30} rawColor={token.metaData.primaryColor}>
<Flex height="100%">
<Text fontColor={ColorOption.white} fontSize="8px">
{displaySymbol}