crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: allow panel children to fill entire content / remove title from panel component

Browse Source
This commit is contained in:
fragosti
2018-11-08 16:58:44 -08:00
parent fc138cd73d
commit 39ae21d693
3 changed files with 10 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/instant/src/components/erc20_token_selector.tsx
View File

@@ -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;

18
packages/instant/src/components/sliding_panel.tsx
View File

@@ -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>

1
packages/instant/src/components/zero_ex_instant_container.tsx
View File

@@ -54,7 +54,6 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
</Container>
</Flex>
<SlidingPanel
title="Select Token"
animationState={this.state.tokenSelectionPanelAnimationState}
onClose={this._handlePanelClose}
>