aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-11-09 08:58:44 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-11-09 08:58:44 +0800
commit39ae21d6939b43fbae0669219801b2bab140da9c (patch)
tree20a2df24cf01cda33e698ce89788f6bac910b487 /packages/instant
parentfc138cd73d6eebc6a6250ede1ec7a465d4d40685 (diff)
downloaddexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar.gz
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar.bz2
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar.lz
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar.xz
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.tar.zst
dexon-sol-tools-39ae21d6939b43fbae0669219801b2bab140da9c.zip
feat: allow panel children to fill entire content / remove title from panel component
Diffstat (limited to 'packages/instant')
-rw-r--r--packages/instant/src/components/erc20_token_selector.tsx7
-rw-r--r--packages/instant/src/components/sliding_panel.tsx18
-rw-r--r--packages/instant/src/components/zero_ex_instant_container.tsx1
3 files changed, 10 insertions, 16 deletions
diff --git a/packages/instant/src/components/erc20_token_selector.tsx b/packages/instant/src/components/erc20_token_selector.tsx
index 3503ff31a..d4a77c278 100644
--- a/packages/instant/src/components/erc20_token_selector.tsx
+++ b/packages/instant/src/components/erc20_token_selector.tsx
@@ -29,13 +29,18 @@ export class ERC20TokenSelector extends React.Component<ERC20TokenSelectorProps>
const { tokens, onTokenSelect } = this.props;
return (
<Container height="100%">
+ <Container marginBottom="10px">
+ <Text fontColor={ColorOption.darkGrey} fontSize="18px" fontWeight="600" lineHeight="22px">
+ Select Token
+ </Text>
+ </Container>
<SearchInput
placeholder="Search tokens..."
width="100%"
value={this.state.searchQuery}
onChange={this._handleSearchInputChange}
/>
- <Container overflow="scroll" height="calc(100% - 80px)" marginTop="10px">
+ <Container overflow="scroll" height="calc(100% - 90px)" 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 9d16f9560..bb1049a31 100644
--- a/packages/instant/src/components/sliding_panel.tsx
+++ b/packages/instant/src/components/sliding_panel.tsx
@@ -12,25 +12,15 @@ import { Icon } from './ui/icon';
import { Text } from './ui/text';
export interface PanelProps {
- title?: string;
onClose?: () => void;
}
-export const Panel: React.StatelessComponent<PanelProps> = ({ title, children, onClose }) => (
+export const Panel: React.StatelessComponent<PanelProps> = ({ children, onClose }) => (
<Container backgroundColor={ColorOption.white} width="100%" height="100%" zIndex={zIndex.panel} padding="20px">
- <Flex justify="space-between">
- {title && (
- <Container marginTop="3px">
- <Text fontColor={ColorOption.darkGrey} fontSize="18px" fontWeight="600" lineHeight="22px">
- {title}
- </Text>
- </Container>
- )}
- <Container position="relative" bottom="7px">
- <Icon width={12} color={ColorOption.lightGrey} icon="closeX" onClick={onClose} />
- </Container>
+ <Flex justify="flex-end">
+ <Icon width={12} color={ColorOption.lightGrey} icon="closeX" onClick={onClose} />
</Flex>
- <Container marginTop="10px" height="100%">
+ <Container position="relative" top="-10px" height="100%">
{children}
</Container>
</Container>
diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 5748e064e..47fd75d25 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -54,7 +54,6 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
</Container>
</Flex>
<SlidingPanel
- title="Select Token"
animationState={this.state.tokenSelectionPanelAnimationState}
onClose={this._handlePanelClose}
>