diff options
| author | fragosti <francesco.agosti93@gmail.com> | 2018-11-09 07:04:03 +0800 |
|---|---|---|
| committer | fragosti <francesco.agosti93@gmail.com> | 2018-11-09 07:04:03 +0800 |
| commit | 316f3e2e766c325bc56260ceb00c1e7a7175adf1 (patch) | |
| tree | 262df36b98aff818be6e6a3a382d6e85c6843e63 | |
| parent | 3395b8d095a62e5baa4c049da98b256ce596d6b9 (diff) | |
| download | dexon-sol-tools-316f3e2e766c325bc56260ceb00c1e7a7175adf1.tar.gz dexon-sol-tools-316f3e2e766c325bc56260ceb00c1e7a7175adf1.tar.zst dexon-sol-tools-316f3e2e766c325bc56260ceb00c1e7a7175adf1.zip | |
fix: token selector scrolling container height
| -rw-r--r-- | packages/instant/src/components/erc20_token_selector.tsx | 4 | ||||
| -rw-r--r-- | packages/instant/src/components/sliding_panel.tsx | 4 |
2 files changed, 5 insertions, 3 deletions
diff --git a/packages/instant/src/components/erc20_token_selector.tsx b/packages/instant/src/components/erc20_token_selector.tsx index d3224b036..3503ff31a 100644 --- a/packages/instant/src/components/erc20_token_selector.tsx +++ b/packages/instant/src/components/erc20_token_selector.tsx @@ -28,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={{ default: '390px', sm: '75vh' }} marginTop="10px"> + <Container overflow="scroll" height="calc(100% - 80px)" marginTop="10px"> {_.map(tokens, token => { if (!this._isTokenQueryMatch(token)) { return null; diff --git a/packages/instant/src/components/sliding_panel.tsx b/packages/instant/src/components/sliding_panel.tsx index 7ef28e09c..5e8a73663 100644 --- a/packages/instant/src/components/sliding_panel.tsx +++ b/packages/instant/src/components/sliding_panel.tsx @@ -30,7 +30,9 @@ export const Panel: React.StatelessComponent<PanelProps> = ({ title, children, o <Icon width={12} color={ColorOption.lightGrey} icon="closeX" onClick={onClose} /> </Container> </Flex> - <Container marginTop="10px">{children}</Container> + <Container marginTop="10px" height="100%"> + {children} + </Container> </Container> ); |