fix(instant) various token selector fixes

This commit is contained in:
Brandon Millman
2018-12-01 00:03:07 -08:00
parent 502e9c7be4
commit 800016b430
3 changed files with 6 additions and 4 deletions

View File

@@ -13,10 +13,10 @@ export interface SearchInputProps extends InputProps {
} }
export const SearchInput: React.StatelessComponent<SearchInputProps> = props => ( export const SearchInput: React.StatelessComponent<SearchInputProps> = props => (
<Container backgroundColor={props.backgroundColor} borderRadius="3px" padding=".5em .3em"> <Container backgroundColor={props.backgroundColor} borderRadius="3px" padding=".5em .5em">
<Flex justify="flex-start" align="flex-end"> <Flex justify="flex-start" align="center">
<Icon width={14} height={14} icon="search" color={ColorOption.lightGrey} padding="0px 12px" /> <Icon width={14} height={14} icon="search" color={ColorOption.lightGrey} padding="2px 12px" />
<Input {...props} fontSize="14px" fontColor={props.fontColor} /> <Input {...props} type="search" fontSize="16px" fontColor={props.fontColor} />
</Flex> </Flex>
</Container> </Container>
); );

View File

@@ -77,6 +77,7 @@ export const Container =
${props => cssRuleIfExists(props, 'opacity')} ${props => cssRuleIfExists(props, 'opacity')}
${props => cssRuleIfExists(props, 'cursor')} ${props => cssRuleIfExists(props, 'cursor')}
${props => cssRuleIfExists(props, 'overflow')} ${props => cssRuleIfExists(props, 'overflow')}
${props => (props.overflow === 'scroll' ? `-webkit-overflow-scrolling: touch` : '')};
${props => (props.hasBoxShadow ? `box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)` : '')}; ${props => (props.hasBoxShadow ? `box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1)` : '')};
${props => props.display && stylesForMedia<string>('display', props.display)} ${props => props.display && stylesForMedia<string>('display', props.display)}
${props => props.width && stylesForMedia<string>('width', props.width)} ${props => props.width && stylesForMedia<string>('width', props.width)}

View File

@@ -10,6 +10,7 @@ export interface InputProps {
fontSize?: string; fontSize?: string;
fontColor?: ColorOption; fontColor?: ColorOption;
placeholder?: string; placeholder?: string;
type?: string;
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void; onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
} }