ThemeProvider (#677)

closes #655
This commit is contained in:
Tom Moor
2018-06-09 19:10:30 -07:00
committed by GitHub
parent 0942deec38
commit 434129a434
50 changed files with 277 additions and 324 deletions

View File

@ -1,13 +1,12 @@
// @flow
import * as React from 'react';
import styled from 'styled-components';
import styled, { withTheme } from 'styled-components';
import { SearchIcon } from 'outline-icons';
import Flex from 'shared/components/Flex';
import { color } from 'shared/styles/constants';
type Props = {
onChange: string => *,
theme: Object,
};
class SearchField extends React.Component<Props> {
@ -31,7 +30,7 @@ class SearchField extends React.Component<Props> {
<StyledIcon
type="Search"
size={46}
color={color.slateLight}
color={this.props.theme.slateLight}
onClick={this.focusInput}
/>
<StyledInput
@ -56,16 +55,16 @@ const StyledInput = styled.input`
border: 0;
::-webkit-input-placeholder {
color: ${color.slateLight};
color: ${props => props.theme.slateLight};
}
:-moz-placeholder {
color: ${color.slateLight};
color: ${props => props.theme.slateLight};
}
::-moz-placeholder {
color: ${color.slateLight};
color: ${props => props.theme.slateLight};
}
:-ms-input-placeholder {
color: ${color.slateLight};
color: ${props => props.theme.slateLight};
}
`;
@ -74,4 +73,4 @@ const StyledIcon = styled(SearchIcon)`
top: 4px;
`;
export default SearchField;
export default withTheme(SearchField);