diff options
author | eug-vs <eug-vs@keemail.me> | 2020-06-14 19:52:35 +0300 |
---|---|---|
committer | eug-vs <eug-vs@keemail.me> | 2020-06-14 19:52:35 +0300 |
commit | c7f2999ee797ea5e3bfb29517a4f13206162cc6f (patch) | |
tree | f1aa1f0183720e509894e641cd2f5d1b2f9cd163 /src/components/Header/SearchBar.tsx | |
parent | fabc53130685f70078343a6fd96d9a597b22008f (diff) | |
download | which-ui-c7f2999ee797ea5e3bfb29517a4f13206162cc6f.tar.gz |
refactor: use lowercase in folder names
Diffstat (limited to 'src/components/Header/SearchBar.tsx')
-rw-r--r-- | src/components/Header/SearchBar.tsx | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/src/components/Header/SearchBar.tsx b/src/components/Header/SearchBar.tsx new file mode 100644 index 0000000..182a1a4 --- /dev/null +++ b/src/components/Header/SearchBar.tsx @@ -0,0 +1,31 @@ +import React from 'react'; +import SearchIcon from '@material-ui/icons/Search'; +import { InputBase } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; + +const useStyles = makeStyles(theme => ({ + root: { + background: 'rgba(255, 255, 255, 0.5)', + borderRadius: '2px', + padding: theme.spacing(0.5), + display: 'flex', + alignItems: 'center' + } +})); + +const SearchBar: React.FC = () => { + const classes = useStyles(); + + return ( + <div className={classes.root}> + <SearchIcon /> + <InputBase + placeholder="Search..." + /> + </div> + ); +}; + + +export default SearchBar; + |